Switch自定义样式

因为系统的原因，Switch在不同的版本下和某些手机上的展示的样子满足不了自己，因此我需要自定义，
以下是本文的效果：

• 其实想要实现这个样式很简单，只需要了解Switch控件的两个属性就可以完美的自己自定义了

                 <Switch
                android:id="@+id/sMoRen"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:switchMinWidth="20dp"
                android:track="@drawable/track"
                android:thumb="@drawable/thumb"/>

• track控制Switch样色
• thumb控制中间滑块的样式

1、定义track，在drawable文件下创建track.xml文件

<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:state_checked="true" android:drawable="@drawable/green_track" />
    <item android:drawable="@drawable/gray_track" />
</selector>

green_track.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >

    <!-- 高度40 -->
    <size android:height="25dp"/>
    <!-- 圆角弧度 20 -->
    <corners android:radius="15dp"/>
    <!-- 变化率 -->
    <gradient
        android:endColor="@color/colorRed"
        android:startColor="@color/colorRed" />
</shape>

gray_track.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle" >
    <!-- 高度30   此处设置宽度无效-->
    <size android:height="25dp"/>
    <!-- 圆角弧度 15 -->
    <corners android:radius="15dp"/>
    <!-- 变化率  定义从左到右的颜色不变 -->
    <gradient
        android:endColor="@color/pageColor"
        android:startColor="@color/pageColor" />
</shape>

2、定义thumb，在drawable文件下创建thumb.xml文件

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >

    <item android:state_checked="true"
        android:drawable="@drawable/green_thumb" />
    <item
        android:drawable="@drawable/gray_thumb" />
</selector>

green_thumb.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle" >
    <!-- 高度40 -->
    <size android:height="25dp" android:width="25dp"/>
    <!-- 圆角弧度 20 -->
    <corners android:radius="25dp"/>
    <!-- 变化率 -->
    <gradient
        android:endColor="#eeeeee"
        android:startColor="#eeeeee" />
    <stroke android:width="1dp"
        android:color="@color/colorRed"/>
</shape>

gray_thumb,xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle" >

    <!-- 高度40 -->
    <size android:height="25dp" android:width="25dp"/>
    <!-- 圆角弧度 20 -->
    <corners android:radius="25dp"/>


    <!-- 变化率 -->
    <gradient
        android:endColor="@color/white"
        android:startColor="@color/white" />

    <stroke android:width="1dp"
        android:color="@color/pageColor"/>
</shape>

OK ! 本文完