Android仿新浪微博底栏(FragmentTabHost的使用)

转自：http://blog.csdn.net/chenleicpp/article/details/9393619

主布局：

[html]  view plain copy

1. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
2.     xmlns:tools="http://schemas.android.com/tools"  
3.     android:layout_width="match_parent"  
4.     android:layout_height="match_parent"   
5.     android:orientation="vertical">  
6.     <FrameLayout   
7.         android:id="@+id/realtabcontent"  
8.         android:layout_width="match_parent"  
9.         android:layout_height="0dip"  
10.         android:layout_weight="1">  
11.     </FrameLayout>  
12.       
13.     <android.support.v4.app.FragmentTabHost  
14.         android:id="@android:id/tabhost"  
15.         android:layout_width="match_parent"  
16.         android:layout_height="wrap_content"  
17.         android:background="@drawable/tabbar_background">  
18.         <TabHost   
19.             android:id="@android:id/tabs"  
20.             android:layout_width="match_parent"  
21.             android:layout_height="wrap_content">  
22.         </TabHost>  
23.      <span style="white-space:pre"> </span><FrameLayout   
24.             android:id="@android:id/tabcontent"  
25.             android:layout_width="match_parent"  
26.             android:layout_height="wrap_content">  
27.         </FrameLayout>          
28.     </android.support.v4.app.FragmentTabHost>  
29. </LinearLayout>  

Indicator的layout

[html]  view plain copy

1. <?xml version="1.0" encoding="utf-8"?>  
2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
3.     android:layout_width="match_parent"  
4.     android:layout_height="match_parent" >  
5.   
6.     <LinearLayout  
7.         android:layout_width="match_parent"  
8.         android:layout_height="wrap_content"  
9.     android:gravity="center_horizontal|bottom"  
10.         android:orientation="vertical">  
11.   
12.         <ImageView  
13.             android:id="@+id/iv_icon"  
14.             android:layout_width="wrap_content"  
15.             android:layout_height="wrap_content"  
16.             android:src="@drawable/icon_home" />  
17.   
18.         <TextView  
19.             android:id="@+id/tv_icon"  
20.             android:layout_width="wrap_content"  
21.             android:layout_height="wrap_content"  
22.             android:textColor="#FFFFFFFF"  
23.             android:textSize="10sp" />  
24.     </LinearLayout>  
25.   
26. </LinearLayout>  

底部按钮的selector

[html]  view plain copy

1. <?xml version="1.0" encoding="utf-8"?>  
2. <selector xmlns:android="http://schemas.android.com/apk/res/android">  
3.     <item android:drawable="@drawable/tabbar_home_highlighted" android:state_selected="true"></item>  
4.     <item android:drawable="@drawable/tabbar_home"/>  
5. </selector>  

按下效果的selector

[html]  view plain copy

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

MainActivity

[java]  view plain copy

1. package cn.cl.tebdemo;  
2.   
3. import android.os.Bundle;  
4. import android.support.v4.app.FragmentActivity;  
5. import android.support.v4.app.FragmentTabHost;  
6. import android.view.LayoutInflater;  
7. import android.view.View;  
8. import android.widget.ImageView;  
9. import android.widget.TabHost.TabSpec;  
10. import android.widget.TextView;  
11.   
12. /** 
13.  * 仿新浪微博底栏 
14.  * @author chenleicpp 
15.  * 
16.  */  
17. public class MainActivity extends FragmentActivity {  
18.   
19.     private FragmentTabHost mTabHost;  
20.   
21.     private Class fragmentArray[] = { Main1Fragment.class, Main2Fragment.class, Main3Fragment.class, Main4Fragment.class, Main5Fragment.class };  
22.     private int iconArray[] = { R.drawable.icon_home, R.drawable.icon_meassage, R.drawable.icon_selfinfo, R.drawable.icon_square,  
23.             R.drawable.icon_more };  
24.     private String titleArray[] = { "首页", "消息", "个人", "广场", "更多" };  
25.   
26.     @Override  
27.     protected void onCreate(Bundle savedInstanceState) {  
28.         super.onCreate(savedInstanceState);  
29.         setContentView(R.layout.activity_main);  
30.         setupView();  
31.     }  
32.   
33.     private void setupView() {  
34.         mTabHost = (FragmentTabHost) findViewById(android.R.id.tabhost);  
35.         mTabHost.setup(this, getSupportFragmentManager(), R.id.realtabcontent);  
36.         mTabHost.getTabWidget().setDividerDrawable(null);  
37.   
38.         int count = fragmentArray.length;  
39.   
40.         for (int i = 0; i < count; i++) {  
41.             TabSpec tabSpec = mTabHost.newTabSpec(titleArray[i]).setIndicator(getTabItemView(i));  
42.             mTabHost.addTab(tabSpec, fragmentArray[i], null);  
43.             mTabHost.getTabWidget().getChildAt(i).setBackgroundResource(R.drawable.home_btn_bg);  
44.         }  
45.   
46.     }  
47.   
48.     private View getTabItemView(int index) {  
49.         LayoutInflater layoutInflater = LayoutInflater.from(this);  
50.         View view = layoutInflater.inflate(R.layout.view_idle_bottom_navi, null);  
51.   
52.         ImageView imageView = (ImageView) view.findViewById(R.id.iv_icon);  
53.         imageView.setImageResource(iconArray[index]);  
54.   
55.         TextView textView = (TextView) view.findViewById(R.id.tv_icon);  
56.         textView.setText(titleArray[index]);  
57.   
58.         return view;  
59.     }  
60.   
61. }  

至此为止，主要代码就写完了，具体的请看demo源码：

源码下载