我如何设计Android开关？

113

在API 14中引入的开关小部件的默认样式为全息主题。我想让它略有不同，为了品牌的原因改变它的颜色和形状。人们如何去做这件事？我知道这一定是可能的，因为我见过我想我需要一些状态可绘制默认ICS和三星的TouchWiz主题我如何设计Android开关？

enter image description here

之间的区别，我已经看到了一些样式http://developer.android.com/reference/android/R.styleable.html与Switch_thumb和Switch_track，看起来像我可能会后。我只是不知道如何去使用它们。

我正在使用ActionbarSherlock，如果这有所作为。当然，只有运行API v14或更高版本的设备才能够使用交换机。

来源

2012-04-12 Glenn.nz

247

您可以定义用作背景的图形内容和切换器部分是这样的：

<Switch 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    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>

这定义了拇指可绘制，即上方移动背景的图像。有用于滑块4个ninepatch图像：

失活的版本（即Android是使用xhdpi版本） The deactivated version
压制滑块： The pressed slider
活化的滑块（接通状态）： The activated slider
缺省版本（关闭状态）： enter image description here

也有以下选择中定义为背景三种不同状态：

<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>

停用的版本： The deactivated version
聚焦的版本： The focused version
和默认版本： the default version

为了有一个风格的切换只需创建此两个选择，它们设置为你的交换机视图，然后更改7张图像到你想要的风格。

来源

2012-04-13 12:27:03 Janusz

非常详细的感谢，可以让拇指搬出轨道的一部分9补丁滑块的图像是特别有帮助，因为我不能工作了他们是如何做。（默认的滑块有尖的边缘位移过轨道末端以在一侧形成方形端） – 2012-04-15 23:54:26

很棒的工作 - 非常详细 – Ahmad 2012-04-30 16:39:07

还有一个状态是哪个当开关处于“开”状态时可以改变轨道图像。所以如果你想改变轨道上的“开”/“关”，使用这种状态。 – narangrajeev81 2013-10-08 11:11:48

这是一个非常棒的详细回复Janusz。但只是为了寻求答案的人们，更简单的方法是从Android Asset Studio链接http://android-holo-colors.com/（无效链接）

所有工具的详细描述都在AndroidOnRocks.com（网站现在离线）

但是，我强烈建议大家阅读Janusz的回复，因为它会使理解更清晰。使用该工具真正快速地做东西

来源

2013-02-21 22:38:46 kishu27

很棒的时间节省9-补丁，状态列表drawables等所有在一个点击！ – Steve 2013-11-15 23:23:34

这个工具是太棒了 – dirkoneill 2014-06-13 19:36:01

竖起大拇指为神话般的链接 – 2015-09-01 18:08:23

替代和更简单的方法是使用形状而不是9个补丁。这里已经说明了： https://stackoverflow.com/a/24725831/512011

来源

2015-10-08 09:14:58 netpork

idk，工具我在kishu27的回答中提到的只是改变颜色，因为它为你制作所有的文件要快得多。我想如果你想定制除了颜色之外的形状，虽然这可能更快。 – JStephen 2015-10-08 18:28:01

这个工具真的很棒，但坦率地说，我不喜欢这样一个想法，即如果你只想改变一些你需要生成一些图像的颜色。另外，如果您正在使用形状，则可以使用不同的颜色来关闭/打开开关位置。 – netpork 2015-10-09 14:27:44

是真的，如果你像我一样优柔寡断，不停地改变颜色，直到找到你喜欢的颜色，那么这个速度要快得多，对我来说，幸运的是别人负责挑选颜色:) – JStephen 2015-10-09 15:11:13

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

<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绘图资源切换拇指像下面的图像。欲了解更多信息http://www.zoftino.com/android-switch-button-and-custom-switch-examples

来源

2017-09-19 08:18:06

我如何设计Android开关？

回答

相关问题