TabLayout 自定义布局及样式

<com.google.android.material.tabs.TabLayout
    android:id="@+id/tab"
    android:layout_width="match_parent"
    app:layout_constraintTop_toBottomOf="@id/view_2"
    app:layout_constraintLeft_toLeftOf="parent"
    android:background="#10F8F3F3"
    app:tabMode="scrollable"
    app:tabGravity="center"
    app:tabIndicatorColor="#FF5700"
    app:tabIndicatorHeight="@dimen/dp_3"
    app:tabIndicator="@drawable/indicator"
    android:layout_height="?attr/actionBarSize"/>

new TabLayoutMediator(binding.tab, binding.vp, true, (tab, position) -> tab.setCustomView(makeTabView(position))).attach();
binding.vp.registerOnPageChangeCallback(changeCallback);

private View makeTabView(int position) {
    View tabView = LayoutInflater.from(requireActivity()).inflate(R.layout.layout_tab, null);
    TextView text = tabView.findViewById(R.id.text);
    TextView number = tabView.findViewById(R.id.number);
    text.setText(titles[position]);
    number.setText(numbers[position]);
    text.setTextSize(16);
    text.setTextColor(Color.parseColor("#929292"));
    text.setTypeface(Typeface.DEFAULT);
    number.setTextSize(16);
    number.setTextColor(Color.parseColor("#929292"));
    number.setBackgroundResource(R.drawable.bg_bk_huise_25);
    number.setTypeface(Typeface.DEFAULT);
    return tabView;
}

private ViewPager2.OnPageChangeCallback changeCallback = new ViewPager2.OnPageChangeCallback() {
    @Override
    public void onPageSelected(int position) {
        if(position==0){
            SwipeBackHelper.getCurrentPage(requireActivity())//SwipeBackHelper与Viewpage2滑动冲突
                    .setSwipeBackEnable(true);
        }else {
            SwipeBackHelper.getCurrentPage(requireActivity())//获取当前页面
                    .setSwipeBackEnable(false);
        }
        TextView text = null;
        TextView number = null;
        for (int i = 0; i < titles.length; i++) {
            text = binding.tab.getTabAt(i).getCustomView().findViewById(R.id.text);
            number = binding.tab.getTabAt(i).getCustomView().findViewById(R.id.number);
            text.setTextSize(12);
            text.setTextColor(Color.parseColor("#929292"));
            text.setTypeface(Typeface.DEFAULT);
            number.setTextSize(12);
            number.setTextColor(Color.parseColor("#929292"));
            number.setBackgroundResource(R.drawable.bg_bk_huise_25);
            number.setTypeface(Typeface.DEFAULT);
        }

        text = binding.tab.getTabAt(position).getCustomView().findViewById(R.id.text);
        number = binding.tab.getTabAt(position).getCustomView().findViewById(R.id.number);
        text.setTextSize(16);
        text.setTextColor(Color.parseColor("#000000"));
        text.setTypeface(Typeface.DEFAULT_BOLD);
        number.setTextSize(13);
        number.setTextColor(Color.parseColor("#FF5700"));
        number.setBackgroundResource(R.drawable.bg_bk_shuihong_25);
        number.setTypeface(Typeface.DEFAULT_BOLD);
    }
};

自定义布局

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="wrap_content"
    android:layout_height="?attr/actionBarSize"
    android:gravity="center">

    <androidx.appcompat.widget.AppCompatTextView
        android:id="@+id/text"
        android:layout_gravity="center"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="全部"
        android:textStyle="bold"
        android:textSize="@dimen/sp_16"
        android:textColor="@color/black"/>

    <androidx.appcompat.widget.AppCompatTextView
        android:id="@+id/number"
        android:layout_gravity="center"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="@dimen/dp_6"
        android:background="@drawable/bg_bk_shuihong_25"
        android:text="100"
        android:textStyle="bold"
        android:textSize="@dimen/sp_12"
        android:textColor="#FF5700"/>
</LinearLayout>

指示器样式

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:width="20dp"
        android:height="3dp"
        android:gravity="center_horizontal">
        <shape>
            <corners android:radius="5dp" />
        </shape>
    </item>
</layer-list>