Android中如何设置SwitchCompat的Thumb尺寸小于Track尺寸

要做出你设计图里的样式，核心是通过自定义Drawable分别控制Track（轨道）和Thumb（滑块）的尺寸与样式，具体步骤如下：

1. 自定义Track的Drawable #

在res/drawable目录下创建switch_track.xml，定义轨道样式，确保轨道宽度大于滑块尺寸，同时设置对应圆角与状态颜色：

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- 选中状态的轨道 -->
    <item android:state_checked="true">
        <shape android:shape="rectangle">
            <corners android:radius="20dp"/> <!-- 圆角大小按需调整 -->
            <solid android:color="#4CAF50"/> <!-- 选中时轨道颜色 -->
            <size android:width="50dp" android:height="30dp"/> <!-- 轨道尺寸，宽度大于滑块直径 -->
        </shape>
    </item>
    <!-- 未选中状态的轨道 -->
    <item android:state_checked="false">
        <shape android:shape="rectangle">
            <corners android:radius="20dp"/>
            <solid android:color="#E0E0E0"/> <!-- 未选中时轨道颜色 -->
            <size android:width="50dp" android:height="30dp"/>
        </shape>
    </item>
</selector>

2. 自定义Thumb的Drawable #

在res/drawable目录下创建switch_thumb.xml，定义圆形滑块样式，尺寸要小于轨道高度：

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- 选中状态的滑块 -->
    <item android:state_checked="true">
        <shape android:shape="oval">
            <solid android:color="#FFFFFF"/> <!-- 选中时滑块颜色 -->
            <size android:width="26dp" android:height="26dp"/> <!-- 滑块尺寸，小于轨道高度 -->
            <stroke android:width="1dp" android:color="#4CAF50"/> <!-- 可选：滑块边框 -->
        </shape>
    </item>
    <!-- 未选中状态的滑块 -->
    <item android:state_checked="false">
        <shape android:shape="oval">
            <solid android:color="#FFFFFF"/>
            <size android:width="26dp" android:height="26dp"/>
            <stroke android:width="1dp" android:color="#E0E0E0"/>
        </shape>
    </item>
</selector>

3. 定义SwitchCompat的自定义样式 #

在res/values/styles.xml中添加自定义样式，关联上述两个Drawable并调整内边距确保滑块居中：

<style name="CustomSwitchCompatStyle" parent="Widget.MaterialComponents.CompoundButton.SwitchCompat">
    <item name="track">@drawable/switch_track</item>
    <item name="thumb">@drawable/switch_thumb</item>
    <!-- 调整内边距，让滑块在轨道中居中 -->
    <item name="android:paddingLeft">2dp</item>
    <item name="android:paddingRight">2dp</item>
    <item name="android:paddingTop">2dp</item>
    <item name="android:paddingBottom">2dp</item>
    <!-- 禁用默认最小宽高限制，避免轨道被强制拉伸 -->
    <item name="android:minWidth">0dp</item>
    <item name="android:minHeight">0dp</item>
</style>

4. 在布局中使用自定义样式 #

在布局文件里添加SwitchCompat并应用自定义样式：

<androidx.appcompat.widget.SwitchCompat
    android:id="@+id/customSwitch"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    style="@style/CustomSwitchCompatStyle"
    android:checked="false"/>

注意事项 #

• 轨道和滑块的尺寸可根据设计图自行调整，只要保持滑块直径小于轨道高度即可。
• 如果需要更顺滑的滑动过渡，可在Thumb的Drawable中添加波纹效果，或使用animated-selector实现状态切换动画。

内容的提问来源于stack exchange，提问作者Nguyễn Mạnh Cường