美文网首页
Android Material 组件TabLayout的bug

Android Material 组件TabLayout的bug

作者: 盗梦如画 | 来源:发表于2021-08-28 18:14 被阅读0次
    TabLayout+ViewPager2

    当我们需要更改TabLayout的tabIndicator的时候可以自定义 app:tabIndicator="@drawable/tab_indicator"

    <?xml version="1.0" encoding="utf-8"?>
    <layer-list xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        android:shape="rectangle"
        tools:ignore="ResourceName">
        <item
            android:width="26dp"
            android:height="3dp"
            android:gravity="center">
            <shape android:shape="rectangle">
                <gradient
                    android:angle="0"
                    android:endColor="#ffff823f"
                    android:startColor="#ffff823f"
                    android:type="linear" />
                <corners
                  android:radius="@dimen/dp_2" />
            </shape>
        </item>
    </layer-list>
    

    xml使用如下

        // app:tabIndicator 设置自定义的指示器
      / /app:tabTextAppearance 修改默认的字体大小
    //app:tabIndicatorColor 可以设置指示器颜色
                <com.google.android.material.tabs.TabLayout
                    android:id="@+id/mTabLayout"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    app:tabIndicator="@drawable/tab_indicator"
                    app:tabIndicatorColor="#ffff823f"
                    app:tabMode="scrollable"
                    app:tabRippleColor="@android:color/transparent"
                    app:tabSelectedTextColor="@color/white"
                    app:tabTextAppearance="@style/TabLayoutTextSize"
                    app:tabTextColor="@color/white" />
    
    如果需要tablayout+viewPage2同时更改选中tab的字体 加粗
    /**
     * tablayout+viewPage2
     * @param activity FragmentActivity
     * @param tabLayout TabLayout
     * @param viewPager2 ViewPager2
     * @param mListFragment ArrayList<FrameLayout>
     * @param mTabTitle ArrayList<String>
     * @param textColor Int 字体颜色
     */
    fun initTabLayout(
        activity: FragmentActivity, tabLayout:TabLayout,
        viewPager2:ViewPager2,
        mListFragment: ArrayList<Fragment>,
        mTabTitle: ArrayList<String>,
        @ColorRes textColor:Int=0,
        isBold:Boolean=true
    ) {
        tabLayout.addOnTabSelectedListener(object : TabLayout.OnTabSelectedListener {
            override fun onTabSelected(tab: TabLayout.Tab) {
                val textView = TextView(activity)
                if (textColor!=0){
                    textView.setTextColor(ContextCompat.getColor(activity, textColor))
                    textView.gravity = Gravity.CENTER
                }
                if (isBold){
                    textView.setTextSize(TypedValue.COMPLEX_UNIT_SP, 16f)
                    textView.typeface = Typeface.defaultFromStyle(Typeface.BOLD)//加粗
                }
                textView.text = tab.text
                tab.customView = textView
    
            }
    
            override fun onTabUnselected(tab: TabLayout.Tab) {
                if (textColor!=0){
                    tab.customView = null
                }
            }
            override fun onTabReselected(tab: TabLayout.Tab) {}
        })
        viewPager2.offscreenPageLimit = mListFragment.size
        viewPager2.orientation = ViewPager2.ORIENTATION_HORIZONTAL;
        viewPager2.adapter = MyViewPage2Adapter(activity, mListFragment)
        viewPager2.isUserInputEnabled=true//禁止滑动
        //TabLayout与ViewPager2联动
        TabLayoutMediator(tabLayout, viewPager2,
            TabLayoutMediator.TabConfigurationStrategy { tab, position ->
                tab.text = mTabTitle[position]
            }).attach()
    }
    

    如上图:
    但是在使用com.google.android.material:material:1.2.1的时候 指示器滑动正常
    当把material升级1.4.0的时候 滑动的时候指示器会多次一个并且快速的隐藏,并且出现一个闪烁效果体验不好,解决办法把版本更改回1.2.1就可以了(暂时没有看1.2.1和1.4.0源码的区别,空了去研究下怎么回事)

    相关文章

      网友评论

          本文标题:Android Material 组件TabLayout的bug

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