安卓开发之-BottomNavigationView+ViewPager+Fragment实现导航栏

1.效果类似于手机qq那样的来回页面切换

2.首先在build.gradle中添加依赖：

compile 'com.android.support:design:25.3.1'

3.然后，设置我们的activity的layout文件为：

<?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:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context="com.example.dengjiale.xuanshang.fragment.HomeActivity">

    <FrameLayout
        android:id="@+id/content"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1">

         <android.support.v4.view.ViewPager
             android:id="@+id/home_vp"
             android:layout_width="match_parent"
             android:layout_height="match_parent">

         </android.support.v4.view.ViewPager>
    </FrameLayout>

    <android.support.design.widget.BottomNavigationView
        android:id="@+id/navigation"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:background="?android:attr/windowBackground"
        app:menu="@menu/navigation" />

</LinearLayout>

该布局文件就是一个viewPager组件和一个BottomNavigationView组件，一个用于显示容纳和切换Fragment，一个用于导航

，其中底部导航栏用到的Menu文件的内容如下：

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">

    <item
        android:id="@+id/navigation_home"
        android:icon="@drawable/ic_home_black_24dp"
        android:title="主页" />

    <item
        android:id="@+id/navigation_order"
        android:icon="@drawable/ic_dashboard_black_24dp"
        android:title="订单" />

    <item
        android:id="@+id/navigation_person"
        android:icon="@drawable/ic_notifications_black_24dp"
        android:title="我的" />



</menu>

4.接下来要建立Fragment文件，准备建立三个，其中一个的java代码和布局文件的内容如下，另外两个类似：

public class OrderFragment extends Fragment {
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        /* 引用创建好的xml布局 */
        View view = inflater.inflate(R.layout.fragment_order,container,false);
        return view;

    }
}

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.dengjiale.xuanshang.fragment.OrderFragment">

    <!-- TODO: Update blank fragment layout -->
    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:text="第二个" />

</FrameLayout>

5.接下来，就要写一个关于ViewPager的适配器

package com.example.dengjiale.xuanshang.fragment;

import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;

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

/**
 * Created by dengjiale on 2018/4/12.
 */

public class MyFragmentAdapter extends FragmentPagerAdapter {
    private ArrayList<Fragment> list;
    public MyFragmentAdapter(FragmentManager fm, ArrayList<Fragment> list){
        super(fm);
        this.list=list;
    }
    @Override
    public Fragment getItem(int position) {
        return list.get(position);
    }

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

6.ok,万事俱备，只欠东风，我们下面就要写我们的主要的activity了

package com.example.dengjiale.xuanshang.fragment;

import android.os.Bundle;
import android.support.annotation.NonNull;
import android.support.design.widget.BottomNavigationView;
import android.support.v4.app.Fragment;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.view.MenuItem;
import android.widget.TextView;

import com.example.dengjiale.xuanshang.R;

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

public class HomeActivity extends AppCompatActivity {
    //设置要用到的变量的引用
    private ViewPager viewPager;
    ArrayList<Fragment>fragmentList;
    private BottomNavigationView navigation;
    MyFragmentAdapter myFragmentAdapter;

   //设置导航栏选择变化监听器
    private BottomNavigationView.OnNavigationItemSelectedListener mOnNavigationItemSelectedListener
            = new BottomNavigationView.OnNavigationItemSelectedListener() {

        @Override
        public boolean onNavigationItemSelected(@NonNull MenuItem item) {
            switch (item.getItemId()) {
                //根据导航栏的选择给viewPager设置相应的Fragment
                case R.id.navigation_home:
                    viewPager.setCurrentItem(0);
                    return true;
                case R.id.navigation_order:
                    viewPager.setCurrentItem(1);
                    return true;
                case R.id.navigation_person:
                    viewPager.setCurrentItem(2);
                    return true;
            }
            return false;
        }

    };

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_home);
        //初始化底部导航栏
        navigation = (BottomNavigationView) findViewById(R.id.navigation);
        navigation.setOnNavigationItemSelectedListener(mOnNavigationItemSelectedListener);
        //初始化viewPager
        viewPager=(ViewPager)findViewById(R.id.home_vp);
        //初始化fragment列表
        fragmentList=new ArrayList<>();
        fragmentList.add(new HomeFragment());
        fragmentList.add(new OrderFragment());
        fragmentList.add(new PersonFragment());
        //初始化viewPager适配器
        myFragmentAdapter=new MyFragmentAdapter(getSupportFragmentManager(),fragmentList);
        //注入适配器
        viewPager.setAdapter(myFragmentAdapter);







       //设置viewPager点击事件
        viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

            }

            @Override
            public void onPageSelected(int position) {
            navigation.getMenu().getItem(position).setChecked(true);
            }

            @Override
            public void onPageScrollStateChanged(int state) {

            }
        });
    }

}

7.圆满结束。整个过程的思路就是通过bottomNavigation的点击事件来改变viewPager这个组件中应该显示的Fragment，实现了在一个activity中切换显示不同的fragment。