本文共 4234 字，大约阅读时间需要 14 分钟。

现如今，很多app中都有如下图所示的底部导航栏。千篇一律，重复的代码索然无味。这次，我们一起打造一个通用的底部导航。

需求：完成一个通用底部导航的处理

不管首页底下有几个导航模块，都能简单快速实现的替换，点击事件不需要再findViewById。

思路：

1.底部导航外层使用LinearLayout，作为一个底部导航的最外层container。设置id。

2.每个导航按钮用一个Framelayout作为container。 3.我们可以通过最外层container拿到导航按钮的个数，遍历导航按钮，设置点击事件，在点击事件中，改变该Framelayout的enable属性及其所有孩子的状态变化，同时改变其它Framelayout及其孩子的状态，完成统一管理。

代码：

MainActivity布局：

   
   
        //项目中切换Fragment，用FrameLayout占位    
        //底部导航    
    
             //每个导航按钮用一个FrameLayout占位        
                 
                  
              
             
                 
                  
              
             
                 
                  
              
             
                 
                  
              
         
    
   

布局效果如上图所示：用到五个选择器，分别是四个导航按钮切换不同状态图片的，和一个公用的切换文字颜色的

home.xml:

home_search_text_background.xml:

另外几个就不写出来了。跟home.xml如出一辙。

关于选择器，相信大家都写烦了。这里说一个插件，很多人用该都用过：

操作很简单，只需要把文件后缀按照它的规范写就行。

MainActivity的代码：

public class MainActivity extends AppCompatActivity {    //底部导航最外层container    @InjectView(R.id.main_bottom_switcher_container)    LinearLayout mainBottomSwitcherContainer;    //底部导航container中孩子的个数    private int childCount;    private List
   
     fragments=new ArrayList<>();    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        ButterKnife.inject(this);        initFragment();        initMainBottomSwitcher();//初始化底部导航    }    private void initFragment() {        fragments.add(new HomeFragment());        fragments.add(new OrderFragment());        fragments.add(new MeFragment());        fragments.add(new MoreFragment());        onClickListener.onClick(mainBottomSwitcherContainer.getChildAt(0));//默认在首页    }    /**     * 初始化底部导航     */    private void initMainBottomSwitcher() {        //获取底部container中孩子个数        childCount = mainBottomSwitcherContainer.getChildCount();        for (int i = 0; i < childCount; i++) {//给每个孩子设置点击事件            FrameLayout childAt = (FrameLayout) mainBottomSwitcherContainer.getChildAt(i);            childAt.setOnClickListener(onClickListener);        }    }    private View.OnClickListener onClickListener = new View.OnClickListener() {        @Override        public void onClick(View view) {            int indexOfChild = mainBottomSwitcherContainer.indexOfChild(view);            changeUi(indexOfChild);      //改变底部导航状态            changeFragment(indexOfChild);//切换Fragment        }    };    /**     * 改变点击的index对应控件和它所有孩子的状态  enable=false     * 改变其他控件和它们所有孩子的状态   enable=true     * @param index     */    private void changeUi(int index) {        for (int i = 0; i < childCount; i++) {            if (index == i) {                setEnable(mainBottomSwitcherContainer.getChildAt(i), false);            } else {                setEnable(mainBottomSwitcherContainer.getChildAt(i), true);            }        }    }    private void changeFragment(int index) {        Fragment fragment = fragments.get(index);        getSupportFragmentManager()                .beginTransaction()                .replace(R.id.main_fragment_container,fragment)                .commit();        //      .addToBackStack(fragment.getClass().getSimpleName())    }    /**     * 将每个导航按钮中的所有控件状态改变     * 由于我们处理一个通用的代码，那么导航按钮可能会有很多层控件，所以我们需要使用递归     * @param item     * @param b     */    private void setEnable(View item, boolean b) {        item.setEnabled(b);//解决的是：点击的导航按钮(我们用的是FrameLayout)是否还能点击        if (item instanceof ViewGroup) {            int childCount = ((ViewGroup) item).getChildCount();            for (int i = 0; i < childCount; i++) {                setEnable(((ViewGroup) item).getChildAt(i), b);//解决的是：每个导航按钮的孩子的状态的改变，如图片文字根据enable切换            }        }    }}
   

这里面，切换Fragment无关紧要，随便写几个测试即可。

可以看到，我们除了找到最外层的LinearLayout：

//底部导航最外层container    @InjectView(R.id.main_bottom_switcher_container)    LinearLayout mainBottomSwitcherContainer;

其它的控件，连id都没有指定。我们只需要拿到最外层的LinearLayout。并通过getChildCount()拿到导航按钮的个数即可。设置点击事件，在点击事件中，对整个底部导航所有控件(包含其所有孩子)的状态进行统一管理。怎么样，现在你不需要再去通过findViewById去找到导航按钮中的任何控件了。

如果你想在底部导航中加一个功能，只需要复制一个底部导航按钮的布局，改一下它的文字和图片即可。然后为它添加一个Fragment，注意，初始化Fragment的顺序跟布局中的顺序一致即可。

这样，一个通用的底部导航就处理好了，非常简单也很实用。