收件箱 SwitchCompat 按钮
Inbox SwitchCompat button
今天看到收件箱应用
(来源:cbsistatic.com)
我想知道如何在工具栏(searchButton 左侧)上制作那个切换按钮。
我没有找到参考资料(或者我搜索不多)。
谢谢^^
给你。 https://android-arsenal.com/details/1/1985
您可以在同一站点中找到类似的 material。重用已经可用的东西很容易。干杯!!编码愉快!
这是一个老问题。但我想回答这个问题,因为我找到了一种无需使用任何第三方库即可实现相同目的的方法。
1 - 添加 SwitchCompat
到您的布局
<android.support.v7.widget.SwitchCompat
style="@style/SwitchCompatStyle"
android:id="@+id/toolbar_switch"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"/>
2 - 创建一个 XML 形状。 switch_thumb_on.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="oval">
<!--shadow color-->
<solid android:color="@color/colorGray2" />
</shape>
</item>
<!--padding to have shodow effect-->
<item
android:bottom="1dp"
android:left="0.5dp"
android:right="0.5dp"
android:top="0.5dp">
<!--switch thumb color-->
<shape android:shape="oval">
<solid android:color="@color/colorWhite" />
</shape>
</item>
<item
android:bottom="1dp"
android:left="0.5dp"
android:right="0.5dp"
android:top="0.5dp">
<!--switch image-->
<!--NOTE: switch_color_selector is not a color but a selector-->
<bitmap
android:src="@drawable/ic_network_on"
android:tint="@color/switch_color_selector" />
</item>
</layer-list>
ic_network_on
是开关拇指上显示的图标。如果您愿意,可以在此处添加 states/selector。 switch_color_selector
根据开关所在的状态为图标着色。
3 - 这是颜色选择器 switch_color_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:color="@color/colorAccent" android:state_checked="true" />
<item android:color="@color/colorGray1" />
</selector>
4 - 创建要应用于第一步添加的 Switch 的样式。
<style name="SwitchCompatStyle" parent="Widget.AppCompat.CompoundButton.Switch" >
<item name="android:thumb">@drawable/switch_thumb_on</item>
<item name="trackTint">@color/switch_color_selector</item>
</style>
这就是我得到的结果。
干杯。
今天看到收件箱应用
(来源:cbsistatic.com)
我想知道如何在工具栏(searchButton 左侧)上制作那个切换按钮。 我没有找到参考资料(或者我搜索不多)。
谢谢^^
给你。 https://android-arsenal.com/details/1/1985
您可以在同一站点中找到类似的 material。重用已经可用的东西很容易。干杯!!编码愉快!
这是一个老问题。但我想回答这个问题,因为我找到了一种无需使用任何第三方库即可实现相同目的的方法。
1 - 添加 SwitchCompat
到您的布局
<android.support.v7.widget.SwitchCompat
style="@style/SwitchCompatStyle"
android:id="@+id/toolbar_switch"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"/>
2 - 创建一个 XML 形状。 switch_thumb_on.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="oval">
<!--shadow color-->
<solid android:color="@color/colorGray2" />
</shape>
</item>
<!--padding to have shodow effect-->
<item
android:bottom="1dp"
android:left="0.5dp"
android:right="0.5dp"
android:top="0.5dp">
<!--switch thumb color-->
<shape android:shape="oval">
<solid android:color="@color/colorWhite" />
</shape>
</item>
<item
android:bottom="1dp"
android:left="0.5dp"
android:right="0.5dp"
android:top="0.5dp">
<!--switch image-->
<!--NOTE: switch_color_selector is not a color but a selector-->
<bitmap
android:src="@drawable/ic_network_on"
android:tint="@color/switch_color_selector" />
</item>
</layer-list>
ic_network_on
是开关拇指上显示的图标。如果您愿意,可以在此处添加 states/selector。 switch_color_selector
根据开关所在的状态为图标着色。
3 - 这是颜色选择器 switch_color_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:color="@color/colorAccent" android:state_checked="true" />
<item android:color="@color/colorGray1" />
</selector>
4 - 创建要应用于第一步添加的 Switch 的样式。
<style name="SwitchCompatStyle" parent="Widget.AppCompat.CompoundButton.Switch" >
<item name="android:thumb">@drawable/switch_thumb_on</item>
<item name="trackTint">@color/switch_color_selector</item>
</style>
这就是我得到的结果。
干杯。