榮耀手機鬧鐘開關的switch樣式，最近簡單的方法可以直接設定兩張圖片，根據按鈕狀態來進行切換。

這裡主要說另外一種方式

首先建立兩個track的資原始檔，也就是後面的背景

建立未開啟狀態下的track起名為track_bg_gray

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <size android:width="50dp"
        android:height="22dp"/>
    <corners android:radius="11dp"/>
    <solid android:color="@color/colorLightGray"/>
</shape>
 

android:shape="rectangle"表示矩形
設定寬高 （這裡面設定寬度好像是不起作用的）
<size android:width="50dp"
    android:height="22dp"/>
設定圓角
<corners android:radius="11dp"/>
設定顏色（colorLightGray為自定義顏色）
<solid android:color="@color/colorLightGray"/>

建立開啟狀態下的track起名為track_bg_mian

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <size android:height="22dp"
        android:width="50dp"/>
    <corners android:radius="11dp"/>
    <solid android:color="@color/colorMian"/>
</shape>
 

建立未開啟狀態下的thumb起名為thumb_white

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <size android:width="22dp"
        android:height="22dp"/>
    <solid android:color="@color/colorwhite"/>
    <stroke android:width="3dp" android:color="@color/colorLightGray"/>
</shape>
 

建立開啟狀態下的的thumb起名為thumb_main

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <size android:width="22dp" android:height="22dp"/>
    <solid android:color="@color/colorwhite"/>
    <stroke android:color="@color/colorMian" android:width="3dp"/>
</shape>

建立track的selecter

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/track_bg_gray" android:state_checked="false"/>
    <item android:drawable="@drawable/track_bg_mian" android:state_checked="true"/>
</selector>

建立thumb的selecter

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/thumb_white" android:state_checked="false"/>
    <item android:drawable="@drawable/thumb_mian" android:state_checked="true"/>
</selector>

在建立switch時使用

<Switch
        android:id="@+id/switch_btn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:layout_alignParentRight="true"
        android:layout_marginRight="0dp"
        android:switchMinWidth="50dp"
        android:textOff="  "
        android:textOn="  "
        android:thumb="@drawable/selecter_thumb"
        android:track="@drawable/selector_track"/>