014 Android BottomNavigationView 底部导航组件使用

1.导入BottomNavigationView组件(点击下载按钮，安装组件)

2.新建菜单

(1)app--->src-->main--->res ,选中res目录右击new--->android resource file ，按照如下图设置即可。

注意：File name 可以任意选择，不一定是menu，例如menu_main

(2)右击menu->new->Menu Resource file

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:id="@+id/item1"
        android:title="主界面"
        android:icon="@mipmap/ic_action_home"
        ></item>
    <item
        android:id="@+id/item2"
        android:title="我"
        android:icon="@mipmap/ic_action_me"
        ></item>
    <item
        android:id="@+id/item3"
        android:title="查看"
        android:icon="@mipmap/ic_action_explore"
        ></item>
    <item
        android:id="@+id/item4"
        android:title="设置"
        android:icon="@mipmap/ic_action_settings"
        ></item>
</menu>

3.将菜单添加到BottomNavigationView组件（在XML文件中编写代码）

app:menu="@menu/menu_main"

4.ViewPager实现多页面效果

<1>新建4个页面相应的xml文件

<2>新建4个java文件(MyFragment类继承Fragment类)

<3>MainActivity.java文件中利用适配器将ViewPager与MyFragment类连接在一起

5.源码

对应工程名为：test15

<1>XML文件

(1)主页面布局

用LinearLayout，上方的ViewPager占满剩余屏幕（android:layout_weight=”1”），下方BottomNavigationView 高度为wrap_content。

"app:menu="@menu/menu_main"将刚刚写的子项定义文件加载进来，android:background=”?android:attr/windowBackground”的效果是：当BottomNavigationView与上方内容同色时，会显示的一条分割线。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">
    
    <android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"/>

    <android.support.design.widget.BottomNavigationView
        android:id="@+id/bottom1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="?android:attr/windowBackground"
        app:layout_constraintBottom_toBottomOf="parent"
        app:menu="@menu/menu_main" />
</LinearLayout>

(2)layout_page1.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:background="#ff0000">

    <TextView
        android:id="@+id/textView"
        android:textSize="30dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="我是主界面" />
</LinearLayout>

<2>java后台代码

MyFragment.java

package com.lucky.test15;

import android.os.Bundle;
import android.support.annotation.NonNull;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

public class MyFragment1 extends Fragment {
    @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        View view=inflater.inflate(R.layout.layout_page1,container,false);
        return view;
    }
}

MainActivity.java

package com.lucky.test15;

import android.support.annotation.NonNull;
import android.support.annotation.Nullable;
import android.support.design.internal.BottomNavigationMenuView;
import android.support.design.widget.BottomNavigationView;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.MenuItem;

import java.util.ArrayList;
import java.util.List;

public class MainActivity extends AppCompatActivity {
    ViewPager viewPager;
    List<Fragment> fragments;
    BottomNavigationView bottomNavigationView;
    MenuItem menuItem;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        viewPager=findViewById(R.id.viewpager);

        //底部菜单导航栏与viewPager相交互
        bottomNavigationView=findViewById(R.id.bottom1);
        bottomNavigationView.setOnNavigationItemSelectedListener(new BottomNavigationView.OnNavigationItemSelectedListener() {
            @Override
            public boolean onNavigationItemSelected(@NonNull MenuItem menuItem) {
                switch (menuItem.getItemId()){
                    //当点击到某子项，ViewPager就滑动到对应位置
                    case R.id.item1:
                        viewPager.setCurrentItem(0);
                        break;
                    case R.id.item2:
                        viewPager.setCurrentItem(1);
                        break;
                    case R.id.item3:
                        viewPager.setCurrentItem(2);
                        break;
                    case R.id.item4:
                        viewPager.setCurrentItem(3);
                        break;
                }
                return false;
            }
        });

        fragments=new ArrayList<>();
        fragments.add(new MyFragment1());
        fragments.add(new MyFragment2());
        fragments.add(new MyFragment3());
        fragments.add(new MyFragment4());

        Adapter adapter=new Adapter(getSupportFragmentManager(),fragments);
        viewPager.setAdapter(adapter);

        viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int i, float v, int i1) {

            }

            //onPageSelected()方法只在滑动停止时调用，position滑动停止所在页面位置
            @Override
            public void onPageSelected(int position) {
                if(menuItem!=null){
                    //将菜单子项设置为未选中状态
                    menuItem.setChecked(false);
                }else{
                    //菜单项均未被选中时，获取菜单子项中的第一个，将其设置为选中状态
                    menuItem=bottomNavigationView.getMenu().getItem(0);
                    menuItem.setChecked(true);
                }
                menuItem=bottomNavigationView.getMenu().getItem(position);
                menuItem.setChecked(true);

            }

            @Override
            public void onPageScrollStateChanged(int i) {

            }
        });

    }

    private class Adapter extends FragmentPagerAdapter{

        List<Fragment> list1;
        public Adapter(FragmentManager fm,List<Fragment> fragments) {
            super(fm);
            this.list1=fragments;
        }

        @Override
        public Fragment getItem(int position) {
            return list1.get(position);
        }

        @Override
        public int getCount() {
            return list1.size();
        }

    }
}

6.效果图

 参考文献：https://blog.csdn.net/htwhtw123/article/details/78441431