一、今天完成的事情

之前做类似于微信的底部导航栏时用的是TextView+ImageView实现的，每个Tab对应一组TextView+ImageView，滑动ViewPager切换页面时需要改变对应的文本颜色和图片资源，比较麻烦，今天学了另一种方式，使用RadioGroup+RadioButton实现，其实之前知道有这种方式，但一直没去用，主要思路是用一个RadioGroup表示导航栏，RadioGroup中包含数个RadioButton，每个RadioButton代表一个Tab，因同一个Radio Group中的RadioButton只能单选，所以省去了许多代码，当某个RadioButton被选中时切换对应的资源即可。

准备图片资源

图片资源文件中有两个item，区别是第一个item带有一个android：state_checked = “true”属性，当RadioButton被选中时，就会引用第一个图片资源，否则引用第二个图片资源，这样，切换图片的逻辑就不用写在代码中了，非常方便。

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

文本资源，原理同上

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@color/myColorPrimary" android:state_checked="true" />
    <item android:color="@color/grey_bababa" />
</selector>

另外，因为导航栏中会用到多个RadioButton，一般为3至4个，而RadioButton的属性大多都是相同的，所以可以把相同的属性抽取出来写成style文件，使用时直接引用style可以节省布局文件的代码量

<style name="tab_menu_item">
    <item name="android:layout_width">0dp</item>
    <item name="android:layout_height">match_parent</item>
    <item name="android:layout_weight">1</item>
    <item name="android:gravity">center</item>
    <item name="android:paddingTop">3dp</item>
    <item name="android:button">@null</item>
    <item name="android:textColor">@drawable/tab_menu_text</item>
    <item name="android:textSize">14sp</item>
</style>

使用

<RadioButton
    android:id="@+id/rb_chat"
    style="@style/tab_menu_item"
    android:drawableTop="@drawable/tab_menu_chat"
    android:text="@string/chat"/>

可以看现在的布局文件中的RadioButton非常简洁，4行就搞定了。

在Activity中，当页面切换时不需要处理底部导航栏中的tab的图标和文本的变化。

二、明天计划的事情

继续做IM

三、遇到的问题

四、收获

布局文件中当多个控件具有相同的属性时可以将这些属性抽取出来写在sytyle文件用，使用时直接引用style即可，不用每次重复写相同的代码。