TabActivity

最近一个项目中用到了TabActivity，遇到了不少问题，而且发现论坛中也有类似的问题，所以在这里写个TabActivity的例子，望大家多多指教。

在这里给大家介绍两种TabActivity效果，一种是用TabActivity实现，另外一种是ViewFlipper实现。
话不多说，先给个效果图，不然有人说我无图无真相了。







附近中有的都是一些小技巧很好用，
比如，图片中的菜单，是利用RadioGroup做成的，而且有选中的效果，RadioGroup做成菜单，网络上面也有不少的例子，今天我也顺便说下原理。
Radiogroup中之能有一个是选中的效果，这个刚刚好，为菜单中选中提供了方便，但是系统提供的背景和图标是很好用，所以我们要自己自定义一个，这里就用到了style和shape，详细情况大家可以看代码。
选中的效果是一个图片背景的切换，这个定义在shape的xml文件里面。

1. <RadioGroup
   
2.             android:id="@+id/rg"
   
3.             android:layout_width="fill_parent"
   
4.             android:layout_height="50px"
   
5.             android:background="#f00"
   
6.             android:orientation="horizontal" >
   
7. 
   
8.             <RadioButton
   
9.                 android:id="@+id/rb01"
   
10.                 style="@style/menu_item"
    
11.                 android:checked="true"
    
12.                 android:drawableTop="@drawable/menu_home"
    
13.                 android:text="主页" />
    
14. 
    
15.             <RadioButton
    
16.                 android:id="@+id/rb02"
    
17.                 style="@style/menu_item"
    
18.                 android:drawableTop="@drawable/menu_clear"
    
19.                 android:text="清除" />
    
20. 
    
21.             <RadioButton
    
22.                 android:id="@+id/rb03"
    
23.                 style="@style/menu_item"
    
24.                 android:drawableTop="@drawable/menu_refresh"
    
25.                 android:text="刷新" />
    
26. 
    
27.             <RadioButton
    
28.                 android:id="@+id/rb04"
    
29.                 style="@style/menu_item"
    
30.                 android:drawableTop="@drawable/menu_save"
    
31.                 android:text="保存" />
    
32. 
    
33.             <RadioButton
    
34.                 android:id="@+id/rb05"
    
35.                 style="@style/menu_item"
    
36.                 android:drawableTop="@drawable/menu_more"
    
37.                 android:text="更多" />
    
38.         </RadioGroup>

复制代码

1. <style name="menu_item">
   
2.         <item name="android:layout_width">fill_parent</item>
   
3.         <item name="android:layout_height">fill_parent</item>
   
4.         <item name="android:button">@null</item>
   
5.         <item name="android:gravity">center_horizontal</item>
   
6.         <item name="android:background">@drawable/menu_item_bg</item>
   
7.         <item name="android:layout_weight">1</item>
   
8.     </style>

复制代码

1. <?xml version="1.0" encoding="utf-8"?>
   
2. <selector xmlns:android="http://schemas.android.com/apk/res/android">
   
3.         <item android:state_pressed="false" android:state_checked="false" android:drawable="@drawable/menu_normal" />
   
4.         <item android:state_checked="true" android:drawable="@drawable/menu_press" />
   
5.         <item android:state_pressed="true" android:drawable="@drawable/menu_press" />
   
6. </selector>

复制代码

系统在中自带TabActivity，TabHost是在顶部的，如果要改变位置的话，比如，放在底部，就可以改变xml中的位置，那么显示的位置当然也在底部了，本实例中我们不需要系统自带的Tabhost，我就把他隐藏了， android:visibility="gone" ，使用我们自己设置的菜单栏。
另外Tabhost切换的动画，也是大家关注的问题。

1. public class TabMainActivity extends TabActivity {
   
2. 
   
3.         TabHost tab;
   
4.         Context context;
   
5.         RadioGroup rg;
   
6. 
   
7.         public void onCreate(Bundle savedInstanceState) {
   
8.                 super.onCreate(savedInstanceState);
   
9.                 setContentView(R.layout.tab_main);
   
10. 
    
11.                 tab = getTabHost();
    
12.                 context = this;
    
13. 
    
14.                 tab.addTab(tab.newTabSpec("A").setIndicator("A").setContent(new Intent(context, AActivity.class)));
    
15.                 tab.addTab(tab.newTabSpec("B").setIndicator("B").setContent(new Intent(context, BActivity.class)));
    
16.                 tab.addTab(tab.newTabSpec("C").setIndicator("C").setContent(new Intent(context, CActivity.class)));
    
17.                 tab.addTab(tab.newTabSpec("D").setIndicator("D").setContent(new Intent(context, DActivity.class)));
    
18.                 tab.addTab(tab.newTabSpec("E").setIndicator("E").setContent(new Intent(context, EActivity.class)));
    
19. 
    
20.                 rg = (RadioGroup) findViewById(R.id.rg);
    
21.                 rg.setOnCheckedChangeListener(new OnCheckedChangeListener() {
    
22.                         public void onCheckedChanged(RadioGroup group, int checkedId) {
    
23.                                 int idx = -1;
    
24.                                 if (checkedId == R.id.rb01) {
    
25.                                         idx = 0;
    
26.                                 } else if (checkedId == R.id.rb02) {
    
27.                                         idx = 1;
    
28.                                 } else if (checkedId == R.id.rb03) {
    
29.                                         idx = 2;
    
30.                                 } else if (checkedId == R.id.rb04) {
    
31.                                         idx = 3;
    
32.                                 } else if (checkedId == R.id.rb05) {
    
33.                                         idx = 4;
    
34.                                 }
    
35.                                 switchActivity(idx);
    
36.                         }
    
37.                 });
    
38.         }
    
39. 
    
40.         protected void switchActivity(int idx) {
    
41.                 int n = tab.getCurrentTab();
    
42. 
    
43.                 if (idx < n) {
    
44.                         tab.getCurrentView().startAnimation(AnimationUtils.loadAnimation(this, R.anim.slide_left_out));
    
45.                 } else if (idx > n) {
    
46.                         tab.getCurrentView().startAnimation(AnimationUtils.loadAnimation(this, R.anim.slide_right_out));
    
47.                 }
    
48.                 tab.setCurrentTab(idx);
    
49.                 if (idx < n) {
    
50.                         tab.getCurrentView().startAnimation(AnimationUtils.loadAnimation(this, R.anim.slide_left_in));
    
51.                 } else if (idx > n) {
    
52.                         tab.getCurrentView().startAnimation(AnimationUtils.loadAnimation(this, R.anim.slide_right_in));
    
53.                 }
    
54.                 
    
55.                 RadioButton rb = (RadioButton) rg.getChildAt(idx);
    
56.                 rb.setChecked(true);
    
57.         }
    
58. 
    
59.         private Map<String, Object> data = new HashMap<String, Object>();
    
60. 
    
61.         protected void put(String key, String value) {
    
62.                 data.put(key, value);
    
63.         }
    
64. 
    
65.         protected Object get(String key) {
    
66.                 return data.get(key);
    
67.         }
    
68. }

复制代码

主要的核心代码在上面的代码中,原理是先使当前的界面播放退出的动画，然后切换界面，最后播放新的界面进入的动画，请注意播放动画的代码是

tab.getCurrentView().startAnimation();

而不是

tab.getCurrentTabView().startAnimation();

我在开始写代码的时候，就发了这样的错误，找了好几天才把这个bug给找到，真郁闷。




还有TabActivity是一个Main,其他Activity相当于一个Sub，通常在一个sub中切换到另外一个sub中就比较麻烦了
，
可以使用如下的代码实现功能
BActivity----->CActivity

1. public class BActivity extends Activity{
   
2. 
   
3.         Button btn;
   
4.         TabMainActivity main;
   
5.         protected void onCreate(Bundle savedInstanceState) {
   
6.                 super.onCreate(savedInstanceState);
   
7.                 setContentView(R.layout.b);
   
8.                 btn = (Button) findViewById(R.id.button1);
   
9.                 main = (TabMainActivity) getParent();
   
10.                 btn.setOnClickListener(new OnClickListener() {
    
11.                         public void onClick(View v) {
    
12.                                 main.put("test", "abc123");
    
13.                                 main.switchActivity(2);
    
14.                         }
    
15.                 });
    
16.         }
    
17. }

复制代码

在BActivity中使用getParent();得带的就是MainActivity,我们可以在main写一个切换的方法，然后在B中就可以调用了，如果两个Activity之间要传递数据,那么也可以使用上面的方法，切换前先把数据放在main中，切换后在从main中取得数据。

下面说一说，ViewFlipper是一个很不错的组建，用的情况也是比较多的
ViewFlipper的子View中可以有好几个，但是显示只显示一个，利用这个原理可以做好多事情，比如，做一个类似于Window资源管理器中的视图切换，一个是网格布局，一个是列表布局， 那么就可以利用ViewFlipper来切换，
同理可以可以实现类似于TabActivity的功能，我在附件的源码中有例子。



TabActivity也有缺点，比如，在sub中不能使用startActivityForResult这样的方法，就算可以使用，那么返回的响应也不再sub中而是在main中，

1. protected void onActivityResult(int requestCode, int resultCode, Intent data) {
   
2.                 super.onActivityResult(requestCode, resultCode, data);
   
3.         }

复制代码

那么就可以使用ViewFlippler来实现一个此功能

还有一个重要地方，就是ViewFlipper可以很简单的实现两个View之间的动画切换。

1. public class VfActivity extends Activity {
   
2. 
   
3.         ViewFlipper vf;
   
4.         RadioGroup rg;
   
5.         Context context;
   
6. 
   
7.         AView a;
   
8.         BView b;
   
9.         CView c;
   
10.         DView d;
    
11.         EView e;
    
12.         protected void onCreate(Bundle savedInstanceState) {
    
13.                 super.onCreate(savedInstanceState);
    
14.                 setContentView(R.layout.vf);
    
15. 
    
16.                 vf = (ViewFlipper) findViewById(R.id.vf);
    
17. 
    
18.                 rg = (RadioGroup) findViewById(R.id.rg);
    
19.                 context = this;
    
20.                 a = new AView(this);
    
21.                 b = new BView(this);
    
22.                 c = new CView(this);
    
23.                 d = new DView(this);
    
24.                 e = new EView(this);
    
25.                 
    
26.                 vf.addView(a.makeNewView());
    
27.                 vf.addView(b.makeNewView());
    
28.                 vf.addView(c.makeNewView());
    
29.                 vf.addView(d.makeNewView());
    
30.                 vf.addView(e.makeNewView());
    
31.                 
    
32.                 rg.setOnCheckedChangeListener(new OnCheckedChangeListener() {
    
33. 
    
34.                         public void onCheckedChanged(RadioGroup group, int checkedId) {
    
35.                                 int idx = -1;
    
36.                                 if (checkedId == R.id.rb01) {
    
37.                                         idx = 0;
    
38.                                 } else if (checkedId == R.id.rb02) {
    
39.                                         idx = 1;
    
40.                                 } else if (checkedId == R.id.rb03) {
    
41.                                         idx = 2;
    
42.                                 } else if (checkedId == R.id.rb04) {
    
43.                                         idx = 3;
    
44.                                 } else if (checkedId == R.id.rb05) {
    
45.                                         idx = 4;
    
46.                                 }
    
47.                                 changeViewByHorizontalnAnim(vf, idx);
    
48.                         }
    
49.                 });
    
50.         }
    
51. 
    
52.         public void changeViewByHorizontalnAnim(ViewFlipper vf, int idx) {
    
53. 
    
54.                 int currentIdx = vf.getDisplayedChild();
    
55.                 if (idx == currentIdx) {
    
56.                         return;
    
57.                 }
    
58.                 Animation leftIn = AnimationUtils.loadAnimation(context, R.anim.left_in);
    
59.                 Animation leftOut = AnimationUtils.loadAnimation(context, R.anim.left_out);
    
60.                 Animation rightIn = AnimationUtils.loadAnimation(context, R.anim.right_in);
    
61.                 Animation rightOut = AnimationUtils.loadAnimation(context, R.anim.right_out);
    
62.                 Animation in = null;
    
63.                 Animation out = null;
    
64.                 if (idx > currentIdx) {
    
65.                         in = leftIn;
    
66.                         out = leftOut;
    
67.                 } else if (idx < currentIdx) {
    
68.                         in = rightIn;
    
69.                         out = rightOut;
    
70.                 } else {
    
71.                         return;
    
72.                 }
    
73.                 vf.setInAnimation(in);
    
74.                 vf.setOutAnimation(out);
    
75.                 vf.setDisplayedChild(idx);
    
76.         }
    
77. }

复制代码

 

项目的结构如上图，Vf(ViewFlipper的简写，输入法来回切换太麻烦，希望大家能看懂，见谅啊，:-))
,vf在实现tab的时候，我先顶一个抽象类，

1. public abstract class AbstractView {
   
2. 
   
3.         protected Context context;
   
4.         protected VfActivity activity;
   
5. 
   
6.         public AbstractView(VfActivity va) {
   
7.                 context = va;
   
8.                 activity = va;
   
9.         }
   
10. 
    
11.         public abstract View makeNewView();
    
12. }

复制代码

构造方法，把vf所在的activity穿进去，然后有个makenewview的方法，子类实现此方法，就可以得到一个界面
然后使用vf.addView(xxx.makeNewView());就行了，这里就不介绍vf的使用方法了，网上这方面的例子也很多。



终于写完了，如果有什么不同意见，可以留言，大家一起探讨探讨。写了好几个小时，累死了。

打完收工。。。。。。。

转自：http://www.eoeandroid.com/forum.php?mod=viewthread&tid=114362