Android控件篇 TabLayout中的Tab间隔设置方法 上篇

Posted 2021-09-04 彭老希

一、效果图（手机拍的，存在色差）

二、布局代码

 <!-- app:tabTextAppearance="@style/TabTextSize"    设置文本字体大小 
         android:overScrollMode="never"             滚动模式 : 绝不  
         app:tabMode="fixed"                        标签模式 ：固定的  
         app:tabIndicatorHeight="0dp"               指示器高度
         app:tabRippleColor="@color/transparent"    标签波纹颜色
         app:tabIndicatorColor="@color/transparent" 选项卡指示器颜色
         app:tabIndicatorFullWidth="false"          选项卡指示器全宽
         app:tabSelectedTextColor="#FFFFFF"         选项卡【选定】的文本颜色
         app:tabTextColor="#5994FF"                 选项卡文本颜色
         -->
         
    <com.google.android.material.tabs.TabLayout
        android:layout_width="match_parent"
        android:layout_height="40dp"
        android:layout_marginTop="13dp"
        android:layout_marginHorizontal="63dp"
        android:overScrollMode="never"
        app:tabBackground="@drawable/select_tab_background_color"
        app:tabMode="fixed"
        app:tabIndicatorHeight="0dp"
        app:tabGravity="fill"
        app:tabTextAppearance="@style/TabTextSize"
        app:tabRippleColor="@color/transparent"
        app:tabIndicatorColor="@color/transparent"
        app:tabIndicatorFullWidth="false"
        app:tabSelectedTextColor="#FFFFFF"
        app:tabTextColor="#5994FF" />

三、@drawable/select_tab_background_color

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <!-- 选择状态 -->
    <item android:state_selected="true">
    
        <layer-list>
            <!-- 设置间隔背景为透明色 -->
            <item>
                <shape>
                    <solid android:color="@android:color/transparent"/>
                </shape>
            </item>
            
			<!-- 实际背景色 -->
            <item android:left="10dp" android:right="10dp" >
                <shape>
                    <corners
                        android:topLeftRadius="25dp"
                        android:topRightRadius="25dp"
                        android:bottomLeftRadius="25dp"
                        android:bottomRightRadius="25dp" />
                    <solid android:color="#ff5994ff"/>
                </shape>
            </item>
            
        </layer-list>
    </item>

    <!-- 默认状态 -->
    <item android:state_selected="false">
        <layer-list>
            <!-- 设置间隔背景为透明色 -->
            <item>
                <shape>
                    <solid android:color="@android:color/transparent"/>
                </shape>
            </item>
            
            <!-- 实际背景色 -->
            <item android:left="10dp" android:right="10dp">
                <shape>
                    <corners
                        android:topLeftRadius="25dp"
                        android:topRightRadius="25dp"
                        android:bottomLeftRadius="25dp"
                        android:bottomRightRadius="25dp" />
                    <solid android:color="#ffffffff"/>
                </shape>
            </item>
            
        </layer-list>
    </item>

</selector>