如何在Android Theme中修改Material ToggleButton颜色？背景黑+开启态紫线

问题原因 #

你使用了原生Android的android:Widget.Material.Button.Toggle作为父样式，同时直接给backgroundTint设置固定黑色，覆盖了ToggleButton默认的状态选择器，导致选中时的标识线条丢失。另外，Material Components的ToggleButton需要使用对应的组件样式才能正确应用Material Design特性。

修复步骤 #

1. 切换到Material Components的ToggleButton父样式
   替换父样式为Widget.MaterialComponents.Button.Toggle，而非原生Android样式，确保能调用Material库的专属属性。

2. 自定义背景状态选择器
   在drawable目录下创建toggle_button_background.xml，定义不同状态的背景样式，保留选中时的紫色线条：

   <?xml version="1.0" encoding="utf-8"?>
   <selector xmlns:android="http://schemas.android.com/apk/res/android">
       <!-- 选中状态 -->
       <item android:state_checked="true">
           <shape android:shape="rectangle">
               <solid android:color="@color/black" />
               <stroke android:width="2dp" android:color="@color/purple_500" />
               <corners android:radius="4dp" />
           </shape>
       </item>
       <!-- 未选中状态 -->
       <item android:state_checked="false">
           <shape android:shape="rectangle">
               <solid android:color="@color/black" />
               <corners android:radius="4dp" />
           </shape>
       </item>
       <!-- 按下状态 -->
       <item android:state_pressed="true">
           <shape android:shape="rectangle">
               <solid android:color="@color/dark_gray" />
               <corners android:radius="4dp" />
           </shape>
       </item>
   </selector>
   

3. 更新主题中的ToggleButton样式
   修改主题配置，使用自定义背景并适配Material库的属性：

   <style name="Theme.GymTimerDark" parent="Theme.MaterialComponents.DayNight.NoActionBar">
       <item name="colorPrimary">@color/purple_500</item>
       <item name="colorPrimaryDark">@color/black</item>
       <item name="colorAccent">@color/purple_200</item>
       <item name="android:colorBackground">@color/white</item>
       <item name="android:textColor">@color/black</item>
       <!-- 使用Material专属的ToggleButton样式属性 -->
       <item name="materialButtonToggleStyle">@style/CustomToggleButtonStyle</item>
   </style>
   
   <style name="CustomToggleButtonStyle" parent="Widget.MaterialComponents.Button.Toggle">
       <item name="android:background">@drawable/toggle_button_background</item>
       <item name="android:textColor">@color/white</item>
       <!-- 禁用默认tint，避免覆盖自定义背景 -->
       <item name="backgroundTint">@null</item>
   </style>
   

关键说明 #

• 用materialButtonToggleStyle替代android:buttonStyleToggle，这是Material Components专门为ToggleButton设计的属性，适配性更强。
• 自定义背景选择器时，明确指定选中状态的stroke颜色为紫色，同时保持背景为黑色，既满足需求又保留选中标识。
• 将backgroundTint设为@null，防止默认的着色效果干扰自定义背景。

内容的提问来源于stack exchange，提问作者rockline