Android TabHost + RadioButton实现Tab导航栏

来源：互联网发布：bit.edu.cn域名编辑：程序博客网时间：2024/05/21 12:50

最近闲着无事，看了很多的关于项目中的Tab导航栏的实现，最近也好久没更新了，整理了我认为比较好的实现方式：TabHost + RadioButton，相信tabHost大家都比较熟悉，在这里就不在介绍了，感兴趣的可以自己去看看。

我们来先看布局：

activity_main.xml

<?xml version="1.0" encoding="utf-8"?><TabHost xmlns:android="http://schemas.android.com/apk/res/android"    android:id="@android:id/tabhost"    android:layout_width="match_parent"    android:layout_height="match_parent"    >    <LinearLayout        android:layout_width="match_parent"        android:layout_height="match_parent"        android:orientation="vertical" >        <FrameLayout            android:id="@android:id/tabcontent"            android:layout_width="match_parent"            android:layout_height="0.0dip"            android:layout_weight="1.0" >        </FrameLayout>        <TabWidget            android:id="@android:id/tabs"            android:layout_width="match_parent"            android:layout_height="wrap_content"            android:visibility="gone" >        </TabWidget>        <RadioGroup            android:id="@+id/radioGroup"            android:layout_width="match_parent"            android:layout_height="@dimen/title_bottom_height"            android:background="@color/background_bottomBar"            android:orientation="horizontal" >            <RadioButton                android:id="@+id/position"                android:layout_height="match_parent"                android:layout_width="0dp"                android:layout_weight="1"                android:checked="true"                android:drawableTop="@drawable/btn_position"                android:button="@null"                android:text="职位"                android:textColor="@color/btn_text_color"                android:textSize="@dimen/sp12"                android:gravity="center"                android:paddingTop="@dimen/dp5"                />            <RadioButton                android:id="@+id/training"                android:layout_width="0dp"                android:layout_weight="1"                android:layout_height="match_parent"                android:drawableTop="@drawable/btn_training"                android:button="@null"                android:text="培训"                android:textSize="@dimen/sp12"                android:textColor="@color/btn_text_color"                android:gravity="center"                android:paddingTop="@dimen/dp5"                 />            <RadioButton                android:id="@+id/found"                android:layout_width="0dp"                android:layout_weight="1"                android:layout_height="match_parent"                android:drawableTop="@drawable/btn_found"                android:textColor="@color/btn_text_color"                android:text="发现"                android:textSize="@dimen/sp12"                android:gravity="center"                android:paddingTop="@dimen/dp5"                android:button="@null"                 />            <RadioButton                android:id="@+id/message"                android:layout_width="0dp"                android:layout_height="match_parent"                android:layout_weight="1"                android:drawableTop="@drawable/btn_message"                android:button="@null"                android:text="消息"                android:textSize="@dimen/sp12"                android:textColor="@color/btn_text_color"                android:gravity="center"                android:paddingTop="@dimen/dp5"               />            <RadioButton                android:id="@+id/my"                android:layout_width="0dp"                android:layout_weight="1"                android:layout_height="match_parent"                android:drawableTop="@drawable/btn_my"                android:text="我的"                android:textSize="@dimen/sp12"                android:textColor="@color/btn_text_color"                android:gravity="center"                android:paddingTop="@dimen/dp5"                android:button="@null"                 />        </RadioGroup>    </LinearLayout></TabHost>

布局很简单，最外层tabHost，里面是radioGroup包裹的radioButton，在这里就不一一赘述了。

下面我们来看代码：

MainActivity.class:

public class MainActivity extends TabActivity {    private static final String TAG = MainActivity.class.getName();    private RadioGroup radioGroup;    private TabHost tabHost;    @Override    public void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        radioGroup = (RadioGroup) findViewById(R.id.radioGroup);        tabHost = (TabHost) findViewById(android.R.id.tabhost);        initTabs();    }    private void initTabs() {        tabHost.setFocusable(true);        tabHost.setCurrentTab(0);        TabHost.TabSpec tabSpec = tabHost.newTabSpec("0");        Intent intent = new Intent(this, PositionActivity.class);        tabSpec.setIndicator("position").setContent(intent);        tabHost.setup(this.getLocalActivityManager());        tabHost.addTab(tabSpec);        TabHost.TabSpec tabSpec2 = tabHost.newTabSpec("1");        Intent intent2 = new Intent(this, TrainingActivity.class);        tabSpec2.setIndicator("training").setContent(intent2);        tabHost.addTab(tabSpec2);        TabHost.TabSpec tabSpec3 = tabHost.newTabSpec("2");        Intent intent3 = new Intent(this, FoundActivity.class);        tabSpec3.setIndicator("found").setContent(intent3);        tabHost.addTab(tabSpec3);        TabHost.TabSpec tabSpec4 = tabHost.newTabSpec("3");        Intent intent4 = new Intent(this, MessageActivity.class);        tabSpec4.setIndicator("message").setContent(intent4);        tabHost.addTab(tabSpec4);        TabHost.TabSpec tabSpec5 = tabHost.newTabSpec("4");        Intent intent5 = new Intent(this, MyActivity.class);        tabSpec5.setIndicator("my").setContent(intent5);        tabHost.addTab(tabSpec5);        radioGroup.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {            @Override            public void onCheckedChanged(RadioGroup group, int checkedId) {                switch (checkedId) {                    case R.id.position:                        tabHost.setCurrentTab(0);                        break;                    case R.id.training:                        tabHost.setCurrentTab(1);                        break;                    case R.id.found:                        tabHost.setCurrentTab(2);                        break;                    case R.id.message:                        tabHost.setCurrentTab(3);                        break;                    case R.id.my:                        tabHost.setCurrentTab(4);                        break;                }            }        });    }

大家可以看到这里MainActivity继承的是TabActivity，这里值得注意的是tabHost初始化的时候必须是android.R.id;主要原理是：利用Intent跳转，设置下标，radioGroup的监听事件：setOnCheckedClick，相信大家都能看懂，是不是很简单呢，

当然实现方式很多，谷歌5.0之后推出的tabLayout +ViewPager也是可以实现的，tabHost+Fragment都是可以的

0 0