Android 自定义开关按钮样式

---

用到shape形状和selector选择器

---

效果图：

1，定义一个drawable/shape_thumb_off.xml文件,定义开关关闭时，thumb滑块显示的效果。

<?xml version="1.0" encoding="utf-8"?>
<shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <corners
        android:radius="50dp"
        />
    <size
android:height="20dp"
        android:width="20dp"
        />
    <!--填充色-->
    <solid
        android:color="@color/white"/>


</shape>

2，定义一个drawable/shape_thumb_on.xml文件,定义开关打开时，thumb滑块显示的效果。

<?xml version="1.0" encoding="utf-8"?>
<shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <corners
        android:radius="50dp"
        />
    <size
android:height="30dp"
        android:width="30dp"
        />
    <!--填充色-->
    <solid
        android:color="@color/white"/>
    <!--描边-->
    <stroke
        android:width="1dp"
        android:color="@color/red"/>
</shape>

3，定义开关关闭状态下track轨迹的样式 drawable/shape_track_off.xml

<?xml version="1.0" encoding="utf-8"?>
<shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <!--填充色-->
    <solid
        android:color="@color/gray"/>
<size
    android:width="50dp"
    android:height="30dp"
    />
<!--圆角-->
<corners
android:radius="30dp"
    />
</shape>

4，定义开关为打开状态下track轨迹的样式 drawable/shape_track_on.xml

<?xml version="1.0" encoding="utf-8"?>
<shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <!--填充色-->
    <solid
        android:color="@color/red"/>
    <size
        android:width="50dp"
        android:height="30dp"
        />
<!--圆角-->
<corners
android:radius="30dp"
    />
</shape>

5，定义thumb滑块在打开关闭状态下的不同，，用selector选择器

<?xml version="1.0" encoding="utf-8"?>
<!--selector选择器 就是在不同的状态下设置不同的显示效果-->
<selector
    xmlns:android="http://schemas.android.com/apk/res/android"
    >
    <!--z状态是什么，-->
    <!-- 特使状态写在上面 正常状态写在最后-->


    <!-- android:state_checked="true"，，当打开时候用@drawable/shape_thumb_on形状-->
    <item android:drawable="@drawable/shape_thumb_on" android:state_checked="true" />

    <item android:drawable="@drawable/shape_thumb" />


</selector>

6，定义track轨迹在打开关闭状态下的不同，，用selector选择器

<?xml version="1.0" encoding="utf-8"?>
<!--selector选择器 就是在不同的状态下设置不同的显示效果-->
<selector
    xmlns:android="http://schemas.android.com/apk/res/android"
    >
    <!--z状态是什么，-->
    <!-- 特使状态写在上面 正常状态写在最后-->


    <!-- -->
    <item android:drawable="@drawable/shape_track_on" android:state_checked="true" />

    <item android:drawable="@drawable/shape_track" />


</selector>

7，最后在布局文件中的定义。

  <Switch
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="开关按钮"
        android:showText="true"
        android:thumb="@drawable/selector_thumb"
        android:track="@drawable/selector_track"
        />