用布局方式作出模仿微信选项卡 1

效果图如图下图所示

 

1.准备八张PNG图片存入drawable文件夹中四张是用来表示没选中时候的状况（黑色），四张用来表示选中时候的状况（枚红色）并建立如下所示的四个xml文件。

1.2.fragment_action.xml(服务):

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/service"  android:state_checked="false"/>
    <item android:drawable="@drawable/service1" android:state_checked="true"/>
    <item android:drawable="@drawable/service"/>
</selector>
<!--设置图片按钮选中和没选中的样式，true的是选中的时候-->

1.3.四个文件类似，功能是一样的，一般都是用于布局文件中调用的。fragment_home.xml（主页）:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/home"  android:state_checked="false"/>
    <item android:drawable="@drawable/home1" android:state_checked="true"/>
<item android:drawable="@drawable/home"/>
</selector>

1.4.fragment_list.xml(发现):

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/look"  android:state_checked="false"/>
    <item android:drawable="@drawable/look1" android:state_checked="true"/>
    <item android:drawable="@drawable/look"/>
</selector>

1.5.fragment_me(个人)：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/me"  android:state_checked="false"/>
    <item android:drawable="@drawable/me1" android:state_checked="true"/>
    <item android:drawable="@drawable/me"/>
</selector>

2.建立一个text_color.xml来设置图标下方文字颜色的切换（主页、服务、查找、个人）：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!--设置点击与否的状态是两个颜色的切换效果。-->
    <item android:color="@color/colorAccent" android:state_checked="true" />
    <item android:color="@color/colorPrimaryDark"  android:state_checked="false"/>
    <item android:color="@color/colorPrimaryDark" />
</selector>

3.在layout中设立一个activity_main.xml的布局文件：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    >
    <!--主页空间-->
    <FrameLayout
        android:id="@+id/home"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

    </FrameLayout>
    <RadioGroup
        android:id="@+id/homeButton"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:gravity="center"
        android:layout_alignParentBottom="true"
        android:background="#FAEBD7">
        <RadioButton
            android:id="@+id/dhomeButton"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="主页"
            android:button="@null"
            android:gravity="center"
            android:layout_weight="1"
            android:textColor="@drawable/text_color"
            android:drawableTop="@drawable/fragment_home"

            />
        <RadioButton
        android:id="@+id/dserviceButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="服务"
        android:layout_weight="1"
            android:gravity="center"
            android:button="@null"
        android:textColor="@drawable/text_color"
        android:drawableTop="@drawable/fragment_list"
        />
        <RadioButton
            android:id="@+id/dlookButton"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="发现"
            android:button="@null"
            android:gravity="center"
            android:layout_weight="1"
            android:textColor="@drawable/text_color"
            android:drawableTop="@drawable/fragment_action"
            />
        <RadioButton
            android:id="@+id/dmeButton"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="个人"
            android:button="@null"
            android:gravity="center"
            android:layout_weight="1"
            android:textColor="@drawable/text_color"
            android:drawableTop="@drawable/fragment_me"
            />

    </RadioGroup>

   
    
</RelativeLayout>

拓展：

RadioButton和RadioGroup的关系：

1、RadioButton表示单个圆形单选框，而RadioGroup是可以容纳多个RadioButton的容器

2、每个RadioGroup中的RadioButton同时只能有一个被选中

3、不同的RadioGroup中的RadioButton互不相干，即如果组A中有一个选中了，组B中依然可以有一个被选中

4、大部分场合下，一个RadioGroup中至少有2个RadioButton

5、大部分场合下，一个RadioGroup中的RadioButton默认会有一个被选中，并建议您将它放在RadioGroup中的起始位置

RadioButton和CheckBox的区别：

1、单个RadioButton在选中后，通过点击无法变为未选中

    单个CheckBox在选中后，通过点击可以变为未选中

2、一组RadioButton，只能同时选中一个

     一组CheckBox，能同时选中多个

3、RadioButton在大部分UI框架中默认都以圆形表示

     CheckBox在大部分UI框架中默认都以矩形表示