com.google.android.material.tabs.TabLayout常用属性

        android:id="@+id/tabLayout"

        android:layout_width="match_parent"

        android:layout_height="40dp"

        android:background="@color/colorPrimary"

        app:layout_constraintTop_toBottomOf="@+id/top"

        app:tabIndicatorHeight="2dp"

        app:tabIndicatorFullWidth="false"        //指示器宽度是否充满，fasle代表跟随文字宽度

 //如果想自定义指示器的圆角或者宽度，使用drawable创建，drawable事例在下面 ①

        app:tabIndicator="@drawable/home_tab_indicator_shape" 

如果想取消掉TabLayout选项卡点击时候的Ripple水波纹效果，直接给 app:tabRippleColor ="@android:color/transparent"即可：

        app:tabRippleColor = "@android:color/transparent"

        app:tabMode="scrollable"   //固定长度或者滑动

        app:tabSelectedTextColor="@color/color_white"

        app:tabTextColor="@color/color_white" />

 示例：①自定义的indicator drawable示例

        android:shape="rectangle">

       

                android:width="20dp"

                android:height="4dp" />

                

               

那么如果想要在选中的时候改变选中大小呢

只能通过自定义customView属性，去设置一个自定义的布局，然后监听选中事件，自己去手动设置选中或者未选中的样式

不推荐反射的方式：效率慢，而且效果不能尽如人意

所以下面介绍下如何使用CustomView，有了自定义View想怎么搞就怎么搞

fun setTabLayoutTab(str : ArrayList){

    for (i in 0 until str.size) {                   

         tabLayout.addTab(tabLayout.newTab())

    }

    for (i in 0 until str.size) {

        tabLayout.getTabAt(i)?.setCustomView(makeTabView(str[i]))

    }

    tabLayout.getTabAt(0)?.select()

    //与adapter建立关联

    vpDiscover.registerOnPageChangeCallback(

            object :    ViewPager2.OnPageChangeCallback() {

                   override fun onPageSelected(position: Int) {                                                             tabLayout.selectTab(tabLayout.getTabAt(position), true)

            }

    })

    tabLayout.addOnTabSelectedListener(

            ViewPager2OnTabSelectedListener(vpDiscover))

}

/** * 设置tablayout tab 自定义样式

* @param position

* @return

*/

private fun makeTabView(str: String): View {

        val tabView: HomeTabCustomView = HomeTabCustomView(requireContext())          tabView.setTitle(str) return tabView

}

CustomTabView

class HomeTabCustomView

        @JvmOverloads constructor(var mContext: Context, var attributeSet: AttributeSet?         = null, var defaultInt: Int = 0): FrameLayout(mContext, attributeSet, defaultInt) {

    init {

        LayoutInflater.from(mContext).inflate(R.layout.layout_tab_home_discover, this)

    }

    override fun setSelected(selected: Boolean) {

        onTabSelect(selected) super.setSelected(selected)

    }

    fun onTabSelect(selected: Boolean){

        if(selected){     

             tvTabTitle?.setTextSize(TypedValue.COMPLEX_UNIT_PX, 19.sp2px().toFloat())              viewTabLine.visibility = View.VISIBLE

        }else{

            tvTabTitle?.setTextSize(TypedValue.COMPLEX_UNIT_PX, 15.sp2px().toFloat())              viewTabLine.visibility = View.GONE

        }

    }

    fun setTitle(str:String){

        tvTabTitle.setText(str)

    }

}

以上应该能满足大部分开发中遇到的问题

参考：

https://my.oschina.net/u/4259809/blog/4330689

https://blog.csdn.net/Liuyz0420/article/details/105439066/

https://blog.csdn.net/jingzz1/article/details/102163021

https://www.jianshu.com/p/fde38f367019