TabHost佈局及新浪式TabHost佈局

 

未驗證，看着還不錯

 

原文：http://www.cnblogs.com/sank615/archive/2011/12/20/2286636.html

新浪微博下端導航欄

 

　　效果如圖：

 

 佈局文件：

 

<?xml version="1.0" encoding="utf-8"?>

<TabHost xmlns:android="http://schemas.android.com/apk/res/android"

    android:layout_width="fill_parent"

    android:layout_height="fill_parent"

    android:id="@android:id/tabhost"

    >

    <LinearLayout 

        android:orientation="vertical" 

        android:layout_width="fill_parent" 

        android:layout_height="fill_parent">

    <FrameLayout 

        android:id="@android:id/tabcontent" 

        android:layout_width="fill_parent" 

        android:layout_height="wrap_content" 

        android:layout_weight="1.0"/>

    <TabWidget 

        android:id="@android:id/tabs" 

        android:visibility="gone" 

        android:layout_width="fill_parent" 

        android:layout_height="wrap_content" 

        />

 <RadioGroup 

     android:gravity="center_vertical"

     android:orientation="horizontal"

     android:id="@+id/rgTab"

     android:background="@drawable/maintab_toolbar_bg"

     android:layout_width="fill_parent"

     android:layout_height="wrap_content"

     >

    <RadioButton 

        style="@style/main_tab_rb"

        android:text="首頁"

        android:id="@+id/rbHome"

        android:drawableTop="@drawable/icon_1_n"/>

    <RadioButton 

        style="@style/main_tab_rb"

        android:text="私信"

        android:id="@+id/rbSixin"

        android:drawableTop="@drawable/icon_2_n"/>

    <RadioButton 

        style="@style/main_tab_rb"

        android:text="評論"

        android:id="@+id/rbComment"

        android:drawableTop="@drawable/icon_3_n"/>

    <RadioButton 

       style="@style/main_tab_rb"

       android:text="刷新"

       android:id="@+id/rbRefresh"

       android:drawableTop="@drawable/icon_4_n"/>

    <RadioButton 

       style="@style/main_tab_rb"

       android:text="更多"

       android:id="@+id/rbMore"

       android:drawableTop="@drawable/icon_5_n"/>

    

 </RadioGroup>

 </LinearLayout>

</TabHost>     

此處應注意三個組件的id：android:id="@android:id/tabhost"，android:id="@android:id/tabcontent"，android:id="@android:id/tabs",在這個佈局文件中咱們將TabWidget的android:visibility="gone" 這樣就起到了去掉tabHost默認佈局的效果，而後咱們在下面添加RadioGroup控件，在RadioGroup的選項改變事件裏完成Tab的切換，達到點擊radioButton就像點擊TabWidget的效果。RadioGroup的選項改變事件代碼在下面的MainTabActivity.java中。

 

styles.xml

 

<?xml version="1.0" encoding="utf-8"?>

<resources>

    <style name="main_tab_rb">

        <item name="android:layout_width">fill_parent</item>

        <item name="android:layout_height">fill_parent</item>

        <item name="android:layout_weight">1.0</item>

        <item name="android:background">@drawable/rb_menu_bg</item>

        <item name="android:gravity">center_horizontal</item>

        <item name="android:button">@null</item>

        <item name="android:textColor">#ffffffff</item>

        <item name="android:ellipsize">marquee</item>

        <item name="android:singleLine">true</item>

        <item name="android:textSize">12sp</item>

        <item name="android:paddingTop">5dp</item>

        <item name="android:layout_marginTop">2dp</item>

    </style>

</resources

rb_menu_bg.xml

 

<?xml version="1.0" encoding="UTF-8"?>

<selector 

    xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:state_focused="true" android:drawable="@drawable/home_btn_bg_s"/>

    <item android:state_pressed="true" android:drawable="@drawable/home_btn_bg_s"/>

    <item android:state_checked="true" android:drawable="@drawable/home_btn_bg_d"/>

</selector>

MainTabActivity.java

 

public class MainTabActivity extends TabActivity {

 

    private RadioGroup rgTab;

    private TabHost th;

   

    @Override

    protected void onCreate(Bundle savedInstanceState) {

        // TODO Auto-generated method stub

        super.onCreate(savedInstanceState);

        this.setContentView(R.layout.main);

        rgTab = (RadioGroup) this.findViewById(R.id.rgTab);

        th = this.getTabHost();

        th.addTab(th.newTabSpec("TS_HOME").setIndicator("TS_HOME").setContent(new Intent(MainTabActivity.this,HomeActivity.class)));

        th.addTab(th.newTabSpec("TS_SIXIN").setIndicator("TS_SIXIN").setContent(new Intent(MainTabActivity.this,SixinActivity.class)));

        th.addTab(th.newTabSpec("TS_COMMENT").setIndicator("TS_COMMENT").setContent(new Intent(MainTabActivity.this,CommentActivity.class)));

        th.addTab(th.newTabSpec("TS_REFRESH").setIndicator("TS_REFRESH").setContent(new Intent(MainTabActivity.this,RefreshActivity.class)));

        th.addTab(th.newTabSpec("TS_MORE").setIndicator("TS_MORE").setContent(new Intent(MainTabActivity.this,MoreActivity.class)));

        rgTab.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {

           

            @Override

            public void onCheckedChanged(RadioGroup group, int checkedId) {

                // TODO Auto-generated method stub

                switch (checkedId) {

               

                case R.id.rbHome:

                    th.setCurrentTabByTag("TS_HOME");

                    break;

                   

                case R.id.rbSixin:

                    th.setCurrentTabByTag("TS_SIXIN");

                    break;

                   

                case R.id.rbComment:

                    th.setCurrentTabByTag("TS_COMMENT");

                    break;

                   

                case R.id.rbRefresh:

                    th.setCurrentTabByTag("TS_REFRESH");

                    break;

                   

                case R.id.rbMore:

                    th.setCurrentTabByTag("TS_MORE");

                    break;

 

                default:

                    break;

                }