美文网首页
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