Android开发Tabhost+RadioGroup实现底部菜单栏

现在比较流行的是Tabhost+RadioGroup实现底部菜单栏，今天在公司没什么事，就想到了前几天做项目时遇到的底部实现菜单栏的问题。

实现菜单栏的功能，用的比较多的是tabhost，但是现在更多的是tabhost+radiogroup这种模式。

1，先来看看布局

<?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="fill_parent"

    android:layout_height="fill_parent" >

    <LinearLayout

        android:layout_width="fill_parent"

        android:layout_height="fill_parent"

        android:orientation="vertical" >

        <FrameLayout

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

            android:layout_width="fill_parent"

            android:layout_height="0.0dip"

            android:layout_weight="1.0" />

        <TabWidget

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

            android:layout_width="fill_parent"

            android:layout_height="wrap_content"

            android:layout_weight="0.0"

            android:tabStripEnabled="false"

            android:visibility="gone" />

        <RadioGroup

            android:id="@+id/main_radio"

            android:layout_width="fill_parent"

            android:layout_height="wrap_content"

            android:layout_gravity="bottom"

            android:background="@drawable/mmfooter_bg"

            android:gravity="clip_horizontal"

            android:orientation="horizontal"

            android:visibility="visible" >

            <RadioButton

                android:id="@+id/radio_button0"

                style="@style/main_tab_bottom"

                android:drawableTop="@drawable/tab_weixin_pressed"

                android:tag="radio_button0"

                android:background="@android:color/transparent"  

                android:text="@string/wjt" />

            <RadioButton

                android:id="@+id/radio_button1"

                style="@style/main_tab_bottom"

                android:drawableTop="@drawable/tab_address_normal"

                android:tag="radio_button1"

                android:background="@android:color/transparent"  

                android:text="@string/friend" />

            <RadioButton

                android:id="@+id/radio_button2"

                style="@style/main_tab_bottom"

                android:drawableTop="@drawable/tab_settings_normal"

                android:tag="radio_button2"

                android:background="@android:color/transparent"  

                android:text="@string/setting" />

        </RadioGroup>

    </LinearLayout>

</TabHost>

其中

 style="@style/main_tab_bottom"

这句是引用<?xml version="1.0" encoding="utf-8"?>

<resources>

    <style name="main_tab_bottom">

        <item name="android:textSize">@dimen/bottom_tab_font_size</item>

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

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

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

        <item name="android:paddingTop">@dimen/bottom_tab_padding_up</item>

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

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

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

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

        <item name="android:drawablePadding">@dimen/bottom_tab_padding_drawable</item>

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

    </style>

    <style name="topBar">

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

        <item name="android:layout_height">48dp</item>

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

    </style>

    <style name="topsearch">

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

        <item name="android:layout_height">48dp</item>

        <item name="android:background">@color/whitesmoke</item>

    </style>

    <style name="topLeftButton">

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

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

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

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

        <item name="android:layout_marginLeft">6dp</item>

    </style>

    <style name="backButton" parent="topLeftButton">

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

        <item name="android:layout_width">30dp</item>

        <item name="android:layout_height">30dp</item>

        <item name="android:layout_marginLeft">15dp</item>

    </style>

</resources>

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

<resources>

    <dimen name="bottom_tab_padding_drawable">2.0dip</dimen>

    <dimen name="bottom_tab_padding_up">5.0dip</dimen>

    <dimen name="bottom_tab_font_size">10.0dip</dimen>

</resources>

中的资源，这里比较注意的是

 <style name="main_tab_bottom">中

<item name="android:button">@null</item>的这一句和

         

 

            <RadioButton

                android:id="@+id/radio_button1"

                style="@style/main_tab_bottom"

                android:drawableTop="@drawable/tab_address_normal"

                android:tag="radio_button1"

                android:background="@android:color/transparent"  

                android:text="@string/friend" />

中的  android:background="@android:color/transparent"  如果这两句你不引用，你的底部菜单栏就会出现排版错乱

出现如图


添加以上两句后出现的是如图


代码下载如果有什么错误欢迎大家指出。