06 ViewPager2-使用

作者: 凤邪摩羯 | 来源:发表于2021-07-26 09:09 被阅读0次

    一、ViewPager2的变化

    ViewPager2是用来替换ViewPager的,ViewPager2是final修饰的,直接继承ViewGroup,其内部是使用RecyclerView,ViewPager2默认是使用懒加载。
    ViewPager2与ViewPager的改进:
    (1)支持Right to Left布局,即从右向左布局
    (2)支持竖向滚动
    (3)支持notifyDataSetChanged
    (4)支持懒加载
    而api上的变动如下:
    (1)FragmentStateAdapter替换了原来的 FragmentStatePagerAdapter
    (2)RecyclerView.Adapter替换了原来的 PagerAdapter
    (3)registerOnPageChangeCallback替换了原来的 addPageChangeListener

    二、ViewPager2的使用

    1.单纯使用ViewPager2

    projectViewPager.adapter = object: FragmentStateAdapter(this) {
        override fun getItemCount(): Int = mProjectTypeList.size
    
        override fun createFragment(position: Int): Fragment = chooseFragment(position)
    
    }
    
    

    ViewPager2使用的Adapter是FragmentStateAdapter和RecyclerView.Adapter。如果是需要展示Fragment,则使用FragmentStateAdapter;如果是需要展示View,则使用RecyclerView.Adapter

    2.ViewPager2+TabLayout联动

    viewPager.adapter = object: FragmentStateAdapter(this){
        override fun getItemCount(): Int = systemBean.children.size
    
        override fun createFragment(position: Int): Fragment = SystemTypeFragment.newInstance(systemBean.children[position].id, false)
    
    }
    // 联动ViewPager2和TabLayout
    TabLayoutMediator(tabLayout, viewPager){
        tab, position -> tab.text = systemBean.children[position].name
    }.attach()
    
    

    ViewPager2的联动需要配合TabLayoutMediator使用。
    在TabLayoutMediator的构造器中,第三个参数是TabConfigurationStrategy接口实现对象,接口如下:

    public interface TabConfigurationStrategy {
      /**
       * Called to configure the tab for the page at the specified position. Typically calls {@link
       * TabLayout.Tab#setText(CharSequence)}, but any form of styling can be applied.
       *
       * @param tab The Tab which should be configured to represent the title of the item at the given
       *     position in the data set.
       * @param position The position of the item within the adapter's data set.
       */
      void onConfigureTab(@NonNull TabLayout.Tab tab, int position);
    }
    
    

    第一个参数就是TabLayout当前的Tab,而position就是当前Tab的索引。这个方法是将ViewPager2与TabLayout绑定之后遍历调用的。
    通过这个Tab对象,可以对每一个Tab做自定义,比如自定义Tab的文本显示内容,或者Tab的显示样式。
    上面的例子中就是自定义每个Tab的文本内容。

    TabLayoutMediator(tabLayout, viewPager) { tab, position ->
        tab.customView = mTabs[position]
        // tab.text = mTitles[position]
    }.attach()
    
    

    这个就在自定义Tab的显示View的。
    这里的mTabs是一个自定义View的列表

    3.ViewPager2与BottomNavigationView联动

    这个做法其实就是给BottomNavigationView添加setOnNavigationItemSelectedListener监听,然后根据选择的position切换ViewPager2

        private val navigationItemSelectedListener = BottomNavigationView.OnNavigationItemSelectedListener {
            when(it.itemId) {
                R.id.home -> {
                    switchFragment(0)
                }
                R.id.blog -> {
                    switchFragment(1)
                }
    //            R.id.search -> {
    //                switchFragment(2)
    //            }
                R.id.project -> {
                    switchFragment(2)
                }
                R.id.personal -> {
                    switchFragment(3)
                }
            }
            true
        }
    
    
    main_nav_view.setOnNavigationItemSelectedListener(navigationItemSelectedListener)
    
    
    private fun switchFragment(position: Int): Boolean {
        // 设置为false,就是取消点击item的时候viewpager的滑动效果
        mainViewPager.setCurrentItem(position, false)
        return true
    }
    
    private fun initViewPager() {
        mainViewPager.run {
            isUserInputEnabled = false
            offscreenPageLimit = 2
            adapter = object: FragmentStateAdapter(activity!!) {
                override fun getItemCount(): Int = fragmentList.size
    
                override fun createFragment(position: Int): Fragment = fragmentList[position]
            }
        }
    }
    
    

    相关文章

      网友评论

        本文标题:06 ViewPager2-使用

        本文链接:https://www.haomeiwen.com/subject/xxgmaktx.html