Android ------ ViewPager1和ViewPager2的使用

Posted 2022-02-03 切切歆语

android X的东西都已经使用很久了，都没好好记录一下，

现在记录一下Android X 下 ViewPager1和ViewPager2的使用，几乎是每个项目中都会使用的控件，他们之间还是有点区别的，

案例效果图，ViewPager和ViewPager2

首先ViewPager1和ViewPager2 是在Android X 的appcompat 库中，创建项目就有的

xml

     <androidx.viewpager.widget.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

     <androidx.viewpager2.widget.ViewPager2
        android:id="@+id/viewpager2"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

首页来看看ViewPager1的Adapter

public class MyFragmentPagerAdapter extends FragmentPagerAdapter 
       
        private List<Fragment> fragmentList;

        public MyFragmentPagerAdapter(FragmentManager fm,List<Fragment> fragmentList) 
            super(fm, BEHAVIOR_RESUME_ONLY_CURRENT_FRAGMENT);
            this.fragmentList = fragmentList;
        

        @NonNull
        @Override
        public Fragment getItem(int position) 
            return fragmentList.get(position);
        

        @Override
        public int getCount() 
            return fragmentList.size();
        
    

ViewPager2的Adapter

public class MyFragmentPagerAdapter extends FragmentStateAdapter 

        private List<Fragment> fragmentList;

        public MyFragmentPagerAdapter(@NonNull @NotNull FragmentActivity fragmentActivity,List<Fragment> fragmentList) 
            super(fragmentActivity);
            this.fragmentList = fragmentList;
        
        @NonNull
        @NotNull
        @Override
        public Fragment createFragment(int i) 
            return fragmentList.get(i);
        

        @Override
        public int getItemCount() 
            return fragmentList.size();
        
    

ViewPager加载Fragment

MyFragmentPagerAdapter pagerAdapter = new MyFragmentPagerAdapter(getSupportFragmentManager(),fragmentList);
        viewpager.setAdapter(pagerAdapter);
        viewpager.setOffscreenPageLimit(fragmentList.size());
        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) 
            
        );

ViewPager2加载Fragment

MyFragmentPagerAdapter pagerAdapter = new MyFragmentPagerAdapter(this,fragmentList);
        viewpager2.setAdapter(pagerAdapter);
        viewpager2.setOffscreenPageLimit(fragmentList.size());
        viewpager2.registerOnPageChangeCallback(new ViewPager2.OnPageChangeCallback() 
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) 
                super.onPageScrolled(position, positionOffset, positionOffsetPixels);
            

            @Override
            public void onPageSelected(int position) //滑动到第几个
                super.onPageSelected(position);
                navigation.getMenu().getItem(position).setChecked(true);
            

            @Override
            public void onPageScrollStateChanged(int state) 
                super.onPageScrollStateChanged(state);
            
        );

效果图是结合BottomNavigationView+ViewPager一起使用的

上一篇博客讲到了BottomNavigationView，可以去看看他的介绍

BottomNavigationView+ViewPager/ViewPager2的绑定都是一样的

 navigation.setOnNavigationItemSelectedListener(new BottomNavigationView.OnNavigationItemSelectedListener() 
            @Override
            public boolean onNavigationItemSelected(@NonNull @NotNull MenuItem menuItem) 
                if (menuItem.getItemId() == R.id.menu_mail)
                    viewpager.setCurrentItem(0);
                else if (menuItem.getItemId() == R.id.menu_bookshelf)
                    viewpager.setCurrentItem(1);
                else if (menuItem.getItemId() == R.id.menu_my_config)
                    viewpager.setCurrentItem(2);
                
                return false;
            
        );

还有一种方式：

navigation.setOnNavigationItemSelectedListener(item -> 
           Toast.makeText(ApiDemo1Activity2.this,
                   "下标"+item.getOrder(),Toast.LENGTH_LONG).show();
            viewpager.setCurrentItem(item.getOrder());
            return true;
        );

这个下标如何来的呢？

那当然是BottomNavigationView 绑定的按钮中设置的了

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

    <item
        android:id="@+id/menu_mail"
        android:icon="@drawable/ic_bottom_mail"
        android:title="@string/book_mail"
        android:orderInCategory="0"
        />

    <item
        android:id="@+id/menu_bookshelf"
        android:icon="@drawable/ic_bottom_books"
        android:orderInCategory="1"
        android:title="@string/book_shelf" />

    <item
        android:id="@+id/menu_my_config"
        android:icon="@drawable/ic_bottom_person"
        android:orderInCategory="2"
        android:title="@string/my" />

</menu>

属性  android:orderInCategory="0"  来设置下标，这样就更方便绑定ViewPager了

总结ViewPager和ViewPager2的区别

1. ViewPager2API最大的变化是它现在使用RecyclerView。
2. 使用ViewPager2需要迁移到 AndroidX ，因为android.support库中不支持ViewPager2
3. FragmentStateAdapter 替换 FragmentStatePagerAdapter
4. RecyclerView.Adapter 替代 PagerAdapter
5. registerOnPageChangeCallback替换 addPageChangeListener

官方文档介绍：

ViewPager2  |  Android 开发者  |  Android Developers