安卓ViewPager与Fragment配合使用（模仿微信主页面效果）

前言

ViewPager(视图滑动切换工具)是安卓3.0引入的一个页面容器组件，用于手势滑动切换页面，常常用于页面导航或者图片轮播。在安卓开发时将其与Android 碎片(fragment)相配合可以快速搭建出类似微信的滑动视图效果。

实现

1.创建fragment

通过android student 创建多个fragment，并为其初始化对应页面。这里需要注意的一点是本实例中的所有fragment对象一定要统一引用相同包下的fragment类，否则运行中会造成多种fragment类型冲突的异常。

2.创建Activity为其注册ViewPager组件并在底部添加3个按钮

public class Menu extends AppCompatActivity implements View.OnClickListener {
    private ViewPager viewPager;
    //用于存放创建的fragment
    private List<Fragment> fragmentList = new ArrayList<>();
    //在底部的三个按钮，使用TextView实现(方便添加图标)
    private TextView index;
    private TextView function;
    private TextView myself;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_menu);
        initView();
    }

    private void initView() {
        viewPager = (ViewPager) findViewById(R.id.viewpager);
        //将创建的fragment放入集合
        fragmentList.add(new Index());
        fragmentList.add(new Function());
        fragmentList.add(new Myself());
        //自定义的FragmentPagerAdapter适配器，传入刚刚创建的fragment集合
        MyFragmentPagerAdapter adapter = new MyFragmentPagerAdapter(getSupportFragmentManager(), fragmentList);
        //为ViewPager设置适配器
        viewPager.setAdapter(adapter);
        //初始化TextView组件
        index = (TextView) findViewById(R.id.index);
        index.setOnClickListener(this);
        function = (TextView) findViewById(R.id.function);
        function.setOnClickListener(this);
        myself = (TextView) findViewById(R.id.myself);
        myself.setOnClickListener(this);
    }
     @Override
    public void onClick(View v) {
        switch (v.getId()){
            case R.id.index:
            	//ViewPager的页面切换方法，0为第一个界面(也就是第一个fragment)
                viewPager.setCurrentItem(0);
                break;
            case R.id.function:
                viewPager.setCurrentItem(1);
                break;
            case R.id.myself:
                viewPager.setCurrentItem(2);
                break;
        }
    }

Activity界面的xml文件 activity_menu

<?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=".activity.Menu">

    <androidx.viewpager.widget.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="8"/>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:orientation="horizontal"
        android:gravity="center"
        android:background="#ccc"
        android:padding="5dp"
        android:layout_weight="1">
        <TextView
            android:id="@+id/index"
            android:drawableTop="@drawable/index"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:layout_height="wrap_content"
            android:textSize="18sp"
            android:gravity="center"
            android:text="@string/index"></TextView>
        <TextView
            android:id="@+id/function"
            android:drawableTop="@drawable/function"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:layout_height="wrap_content"
            android:textSize="18sp"
            android:gravity="center"
            android:text="@string/function"></TextView>
        <TextView
            android:id="@+id/myself"
            android:drawableTop="@drawable/myself"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:layout_height="wrap_content"
            android:textSize="18sp"
            android:gravity="center"
            android:text="@string/myself"></TextView>
    </LinearLayout>
</LinearLayout>

3.为ViewPager创建FragmentPagerAdapter适配器

创建MyFragmentPagerAdapter类作为ViewPager的适配器并让其继承FragmentPagerAdapter类

public class MyFragmentPagerAdapter extends FragmentPagerAdapter {

    private List<Fragment> list;

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

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

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

4.模拟器运行

可以实现ViewPager的滑动切换页面效果并且还可以通过下方的按钮进行页面的切换，每个ViewPager页面对应的就是集合中的fragment对象，这样我们就完成了类似微信页面的效果。