美文网首页
Android的magicIndicator+ViewPager

Android的magicIndicator+ViewPager

作者: SeekLife0 | 来源:发表于2022-05-17 17:28 被阅读0次

参考:https://blog.csdn.net/lixinxiaos/article/details/105975927
magicIndicator:https://github.com/hackware1993/MagicIndicator

1、创建Fragment

创建自己的fragment,以下是推荐的初始化方式,基本上复制到fragment去即可

    //静态内部类,通过这种方式activity初始化fragment时可以传入参数
    companion object {
        private const val TYPE = "TYPE"
        fun newInstance(type: Int): CircleFollowFragment {
            val args = Bundle()
            args.putInt(TYPE, type)
            val fragment = CircleFollowFragment()
            fragment.arguments = args
            return fragment
        }
    }

2、布局

一上一下放在LinearLayout中即可

    <net.lucode.hackware.magicindicator.MagicIndicator
        android:id="@+id/mi_indicator"
        android:paddingHorizontal="15dp"
        android:layout_width="match_parent"
        android:layout_height="54dp"
        />

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

3、编写CommonNavigatorAdapter

这个导航栏适配器可以让我们自定义导航栏tab的布局,这是一个内部类放在activity中或单独写

inner class NavigatorAdapter : CommonNavigatorAdapter(){

        override fun getCount(): Int {
            if(mTitles == null){
                return 0
            }else{
                return mTitles.size
            }
        }

        override fun getTitleView(context: Context?, index: Int): IPagerTitleView {
            var commonPagerTitleView = CommonPagerTitleView(me)
            //设置自定义布局文件以及view的赋值
            commonPagerTitleView.setContentView(R.layout.tab_circle_index)
            val tvTitle = commonPagerTitleView.findViewById<TextView>(R.id.tv_title)
            val ivLine = commonPagerTitleView.findViewById<ImageView>(R.id.iv_line)
            //绑定标题名称
            when(index){
                0 -> {
                    tvTitle.text = mTitles[0]
                }
                1 -> {
                    tvTitle.text = mTitles[1]
                }
            }
            //tab切换监听
            commonPagerTitleView.onPagerTitleChangeListener = object : CommonPagerTitleView.OnPagerTitleChangeListener{

                override fun onSelected(index: Int, totalCount: Int) {
                    //改变字体大小
                    tvTitle.textSize = 17f
                    tvTitle.typeface = Typeface.defaultFromStyle(Typeface.BOLD)
                    //添加下划线
                    Glide.with(me).load(R.mipmap.icon_circle_tab)
                        .into(ivLine)
                }

                override fun onDeselected(index: Int, totalCount: Int) {
                    //改变字体大小
                    tvTitle.textSize = 17f
                    tvTitle.typeface = Typeface.defaultFromStyle(Typeface.NORMAL)
                    //去除下划线
                    Glide.with(me).load("")
                        .into(ivLine)
                }

                override fun onLeave(
                    index: Int,
                    totalCount: Int,
                    leavePercent: Float,
                    leftToRight: Boolean
                ) {

                }

                override fun onEnter(
                    index: Int,
                    totalCount: Int,
                    enterPercent: Float,
                    leftToRight: Boolean
                ) {

                }

            }

            //tab单个item点击事件监听
            commonPagerTitleView.setOnClickListener(View.OnClickListener {
                //切换viewPager
                viewPager.currentItem = index
            })

            return commonPagerTitleView
        }

        override fun getIndicator(context: Context?) : IPagerIndicator? { //tab指示器回调
            return null
        }

    }

4、初始化ViewPager

该内部类放入到activity中即可

    private inner class MyPagerAdapter(fm: FragmentManager?) : FragmentPagerAdapter(fm!!) {
        //fragment的数量
        override fun getCount(): Int {
            return mFragments.size
        }

        //自己设置的标题
        override fun getPageTitle(position: Int): CharSequence? {
            return mTitles[position]
        }

      //返回fragment
        override fun getItem(position: Int): Fragment {
            return mFragments[position]
        }
    }

给viewPager的adapter赋值

viewPager.adapter = MyPagerAdapter(supportFragmentManager)

5、初始化MagicIndcator

该方法放入到activity中即可

    private fun initIndicator(){
        //初始化Indicator
        var commonNavigator = CommonNavigator(me)
        commonNavigator.adapter = NavigatorAdapter()
        //绑定指示器到viewPager
        miIndicator.navigator = commonNavigator
        ViewPagerHelper.bind(miIndicator,viewPager)
        viewPager.currentItem = 0
    }

相关文章

网友评论

      本文标题:Android的magicIndicator+ViewPager

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