如何设计 Android Switch？

Posted 2023-04-14

【中文标题】如何设计 Android Switch？

【英文标题】：How can I style an Android Switch?

【发布时间】：2012-04-24 11:21:03

【问题描述】：

API 14 中引入的开关小部件默认采用全息主题样式。 我想稍微改变它的风格，出于品牌原因改变它的颜色和形状。怎么办？我知道这一定是可能的，因为我看到了默认 ICS 和三星的 touchwiz 主题之间的区别

我假设我需要一些状态可绘制对象，并且我在http://developer.android.com/reference/android/R.styleable.html 中看到了一些带有 Switch_thumb 和 Switch_track 的样式，它们看起来就像我可能想要的那样。我只是不知道如何使用它们。

如果有什么不同，我正在使用 ActionbarSherlock。当然，只有运行 API v14 或更高版本的设备才能使用开关。

【参考方案1】：

您可以定义用于背景的可绘制对象，以及像这样的切换器部分：

<Switch
    android:layout_
    android:layout_
    android:thumb="@drawable/switch_thumb"
    android:track="@drawable/switch_bg" />

现在您需要创建一个选择器来定义切换器可绘制对象的不同状态。 这里是来自 Android 来源的副本：

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_enabled="false" android:drawable="@drawable/switch_thumb_disabled_holo_light" />
    <item android:state_pressed="true"  android:drawable="@drawable/switch_thumb_pressed_holo_light" />
    <item android:state_checked="true"  android:drawable="@drawable/switch_thumb_activated_holo_light" />
    <item                               android:drawable="@drawable/switch_thumb_holo_light" />
</selector>

这定义了拇指可绘制对象，即在背景上移动的图像。滑块使用了四个ninepatch 图像：

停用的版本（Android正在使用的xhdpi版本） 按下的滑块： 已激活的滑块（开启状态）： 默认版本（关闭状态）：

以下选择器中还定义了三种不同的背景状态：

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_enabled="false" android:drawable="@drawable/switch_bg_disabled_holo_dark" />
    <item android:state_focused="true"  android:drawable="@drawable/switch_bg_focused_holo_dark" />
    <item                               android:drawable="@drawable/switch_bg_holo_dark" />
</selector>

停用版本： 重点版： 以及默认版本：

要拥有一个样式开关，只需创建这两个选择器，将它们设置为您的开关视图，然后将七个图像更改为您想要的样式。

【讨论】：

非常详细的感谢，让拇指的一部分移出轨道的 9 补丁滑块图像特别有用，因为我无法弄清楚他们是如何做到的。 （默认滑块的尖边位移动超过轨道的末端以在一侧形成方形末端）

还有一种状态是，它可以在开关处于“on”状态时改变轨迹图像。所以如果你想改变“on”/“off”的轨道，使用这个状态。

如何设置拇指的文本颜色样式？我在任何地方都找不到它:(

@pojomx。您是否找到任何文本颜色的解决方案 - 即开/关文本颜色？我面临同样的问题并停留在同一点。

改变文字颜色 => android:switchTextAppearance="@style/mySwitchTextSyle"

【参考方案2】：

这是 Janusz 的详细回复。但只是为了那些来到这个页面寻求答案的人，更简单的方法是从 Android Asset Studio 链接到 http://android-holo-colors.com/（死链接）

AndroidOnRocks.com（网站现在离线）对所有工具都有很好的描述

但是，我强烈建议大家阅读 Janusz 的回复，因为它会使理解更加清晰。使用该工具快速完成工作

【讨论】：

非常节省时间。 9个补丁，状态列表drawables等一键完成！

这个答案非常方便，我希望看到它发布为“通过自定义颜色轻松创建 android holo 控件的工具”的问题并接受答案。开发人员需要这个。

我确信这将是一个很棒的工具...所有链接都死了，很遗憾

【参考方案3】：

您可以通过设置不同的颜色属性来自定义材质样式。 例如自定义应用主题

<style name="CustomAppTheme" parent="Theme.AppCompat">
    <item name="android:textColorPrimaryDisableOnly">#00838f</item>
    <item name="colorAccent">#e91e63</item>
</style>

自定义开关主题

<style name="MySwitch" parent="@style/Widget.AppCompat.CompoundButton.Switch">
    <item name="android:textColorPrimaryDisableOnly">#b71c1c</item>
    <item name="android:colorControlActivated">#1b5e20</item>
    <item name="android:colorForeground">#f57f17</item>
    <item name="android:textAppearance">@style/TextAppearance.AppCompat</item>
</style>

您可以通过定义 xml drawables 来自定义切换轨道和切换拇指，如下图所示。欲了解更多信息http://www.zoftino.com/android-switch-button-and-custom-switch-examples

【参考方案4】：

另一种更简单的方法是使用形状而不是 9-patches。 这里已经解释过了： https://***.com/a/24725831/512011

【讨论】：

idk，kishu27 的答案中提到的工具对于更改颜色要快得多，因为它会为您制作所有文件。我想如果你想自定义除了颜色之外的形状，虽然这可能更快。

这个工具真的很棒，但坦率地说，我不喜欢这样的想法，即如果你只想改变某物的颜色，你需要生成一堆图像。此外，如果您使用形状，您可以为开关位置设置不同的颜色。

是的，如果你像我一样优柔寡断，不断改变颜色直到找到你喜欢的颜色，那么这会更快，幸运的是我有其他人负责挑选颜色:)