（1）底部导航栏——按键设置

本博文禁止随意转载

前面做完viewpager初始化后没有考虑到与按键的配合，这里选择用常用的radiogroup+fragment的方式来实现按键，之前的代码得有些改动，但是viewpager的基本思路还是一样.

先介绍一下RadioGroup,RadioGroup 为单项选择按钮组，其中可以包含多个 RadioButton，即单选按钮，它们共同为用户提供一种多选一的选择方式
使用时代码步骤：RadioGroup+其内部–>代表不同选项的RadioButton,RadioButton需要的装饰设定需要额外加在styles.xml文件中，代码如下：

<style name="Custom" />
    <style name="Custom.TabRadioButton">
        <item name="android:layout_width">0dp</item>
        <item name="android:layout_weight">1</item>
        <item name="android:layout_height">match_parent</item>
        <item name="android:padding">5dp</item>
        <item name="android:gravity">center</item>
        <item name="android:button">@null</item>
        <item name="android:textSize">14sp</item>
        <item name="android:textColor">@color/tab_text_color_selector</item>
    </style>

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    tools:context="com.example.wechat.MainActivity" ><!--此属性声明此布局默认与哪个活动关联-->


    <RadioGroup
            android:id="@+id/tabs_rg"
            android:layout_width="match_parent"
            android:layout_height="56dp"
            android:layout_alignParentBottom="true"<!--将此按钮集合控制在底部-->
            android:background="#dcdcdc"
            android:orientation="horizontal">

            <RadioButton
                android:id="@+id/wechat_tab"
                style="@style/Custom.TabRadioButton"
                android:checked="true"
                android:drawableTop="@drawable/tab_sign_selector"
                android:text="微信" />

            <RadioButton
                android:id="@+id/addresslist_tab"
                style="@style/Custom.TabRadioButton"
                android:drawableTop="@drawable/tab_record_selector"
                android:text="通讯录" />

            <RadioButton
                android:id="@+id/discover_tab"
                style="@style/Custom.TabRadioButton"
                android:drawableTop="@drawable/tab_contact_selector"
                android:text="发现" />

            <RadioButton
                android:id="@+id/individual_tab"
                style="@style/Custom.TabRadioButton"
                android:drawableTop="@drawable/tab_setting_selector"
                android:text="我" />
        </RadioGroup>
    <androidx.viewpager.widget.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_above="@+id/tabs_rg" />
</RelativeLayout>

这里常规排版了就不解释了，注意一下格式，比较重要的是viewpager是默认覆盖在radiogroup上的，要想实现点击效果就得加android:layout_above="@+id/tabs_rg"

上一篇文章MainActivity继承的是Activity,在与fragment相关代码互动时会出错，所以这里选择改用继承AppCompatActivity，上面的import也得跟着改，下面是MainActivity代码内容：

import android.os.Bundle;
import androidx.fragment.app.Fragment;
import androidx.fragment.app.FragmentManager;
import androidx.fragment.app.FragmentPagerAdapter;
import androidx.appcompat.app.AppCompatActivity;
import androidx.viewpager.widget.ViewPager;
import android.widget.RadioButton;
import android.widget.RadioGroup;
import java.util.ArrayList;
import java.util.List;

public class MainActivity extends AppCompatActivity {

    private ViewPager mViewPager;  //对应的viewPager
    private RadioGroup mTabRadioGroup;
    private List<Fragment> mFragments;//存放不同碎片
    private FragmentPagerAdapter mAdapter;//viewpager的适配器

   @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initView();
    }
    private void initView() {
     
        mViewPager = findViewById(R.id.viewpager);//将其与相应布局关联
        mTabRadioGroup = findViewById(R.id.tabs_rg);//将其与相应布局关联
        mFragments = new ArrayList<>(4);//
        mFragments.add(BlankFragment.newInstance("今日"));//以下是给对应fragment的简单传参，暂时先这样
        mFragments.add(BlankFragment.newInstance("记录"));
        mFragments.add(BlankFragment.newInstance("通讯录"));
        mFragments.add(BlankFragment.newInstance("设置"))；
        mAdapter = new MyFragmentPagerAdapter(getSupportFragmentManager(), mFragments);/*getSupportFragmentManager()获取FragmentManger的对象*/
        mViewPager.setAdapter(mAdapter);//将viewpager进行适配
        mViewPager.addOnPageChangeListener(mPageChangeListener);/*实现viewpager下的页面变化监听工作，用来在滑动后页面变化情况下同时变化按钮*/
        mTabRadioGroup.setOnCheckedChangeListener(mOnCheckedChangeListener);/*点击事件的监听器，用来在点击后使按钮画面同时变化*/
    }

@Override
protected void onDestroy() {
    super.onDestroy();
    mViewPager.removeOnPageChangeListener(mPageChangeListener);
}

程序结束时结束监听画面变化

private ViewPager.OnPageChangeListener mPageChangeListener = new ViewPager.OnPageChangeListener() {
    @Override
    public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

    }

暂时没用，具体化呈现当前滑动状态，position是当前所在页面 ，positionOffset是当前所在页面偏移百分比 ，positionOffsetPixels是当前所在页面偏移量

  @Override
    public void onPageSelected(int position) {
        RadioButton radioButton = (RadioButton) mTabRadioGroup.getChildAt(position);
        radioButton.setChecked(true);
    }

此方法是页面跳转完后得到调用，此时用getChildAt(position)使下方对应按键得到当前位置的视图

  @Override
    public void onPageScrollStateChanged(int state) {

    }
    
};

还是暂时没用，用来呈现当前滑动的状态，state会返回三个值1，2，0，分别代表正在滑动，滑动完成，未操作

private RadioGroup.OnCheckedChangeListener mOnCheckedChangeListener = new RadioGroup.OnCheckedChangeListener() {
    @Override
    public void onCheckedChanged(RadioGroup group, int checkedId) {
        for (int i = 0; i < group.getChildCount(); i++) {
            if (group.getChildAt(i).getId() == checkedId) {
                mViewPager.setCurrentItem(i);
                return;
            }
        }
    }
}

groupChildCount()得到下方按钮数量，getChildAt(i).getId()得到当前按钮所对应的id,这里checkedId代表的是按钮的Id，从第一个按钮开始挨个检索确定按钮对应数字，此时按钮对应i,mViewPager.setCurrentItem(i)使此i按钮对应的第i个界面为当前显示界面，归结起来就是由位置得数字，再将对应数字的viewpager显示出来

   private class MyFragmentPagerAdapter extends FragmentPagerAdapter {

        private List<Fragment> mList;

        public MyFragmentPagerAdapter(FragmentManager fm, List<Fragment> list) {
            super(fm);
            this.mList = list;
        }

上面的碎片集合用来操作了布局对应。这里需要再定义mlist来用

 @Override
    public Fragment getItem(int position) {
        return this.mList == null ? null : this.mList.get(position);
    }

在getItem(int position)中，根据传来的参数position，来返回当前要显示的fragment

  @Override
    public int getCount() {
        return this.mList == null ? 0 : this.mList.size();
    }
}
}

返回了当前要滑动的View的个数
这里方法和上一章view那有所不同，同时考虑到了mlist为空时的情况

补充：以后此部分优化可能的方向：1.通过监听滑动状态实现翻页过程中下方按键图标的同步渐变效果
2.碎片中收到消息后对应按钮部分的右上角会出现小红心标志（同微信）
3.碎片中输入的暂态储存