底部导航栏的实现方案

TabLayout+Fragment实现底部导航栏

1. 在布局中添加TabLayout

要使用TabLayout要先添加依赖

添加依赖

在布局文件中加入需要的控件

为了更好地设置每一个TabItem的布局，新建一个Item的布局文件

2. 实例化TabLayout

在Activity文件中添加实例化控件的代码，对TabLayout进行监听，需要实现三个方法

       tabLayout = findViewById(R.id.bottom_tab_layout);
        // 提供自定义的布局添加Tab
        for(int i=0;i

这里提供了一个适配Item内容的类

public class ItemAdapter {
    public static final int[] mTabIcon = new int[]{R.drawable.ic_home_grey_500_24dp, R.drawable.ic_crop_square_grey_500_24dp, R.drawable.ic_polymer_grey_500_24dp, R.drawable.ic_blur_on_grey_500_24dp};
    public static final int[] mTabIconPressed = new int[]{R.drawable.ic_home_black_24dp, R.drawable.ic_crop_square_black_24dp, R.drawable.ic_polymer_black_24dp, R.drawable.ic_blur_on_black_24dp};
    public static final String[] mTabTitle = new String[]{"首页", "发现", "关注", "我的"};

    public static Fragment[] getFragments(String from){
        Fragment fragments[] = new Fragment[4];
        fragments[0] = HomeFragment.newInstance(from);
        fragments[1] = DiscoverFragment.newInstance(from);
        fragments[2] = FollowFragment.newInstance(from);
        fragments[3] = ProfileFragment.newInstance(from);
        return fragments;
    }


    public static View getTabView(Context context, int position) {
        View view = LayoutInflater.from(context).inflate(R.layout.tab_item_layout, null);
        ImageView tabIcon = (ImageView) view.findViewById(R.id.tab_content_image);
        tabIcon.setImageResource(ItemAdapter.mTabIcon[position]);
        TextView tabText = (TextView) view.findViewById(R.id.tab_content_title);
        tabText.setText(mTabTitle[position]);
        return view;
    }
}

3. 设置点击Item的变化

点击每一个不同的tab就会跳转到不同的页面，这里新建了四个Fragment用于页面切换，下面给出完整代码

public class MainActivity extends AppCompatActivity {


    private TabLayout tabLayout;
    private Fragment[]mFragmensts;
    private static int item = 4;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mFragmensts = ItemAdapter.getFragments("Tab");
        initTablayout();
    }

    public void initTablayout(){

        tabLayout = findViewById(R.id.bottom_tab_layout);
        // 提供自定义的布局添加Tab
        for(int i=0;i