自定义switch控件

需要在drawable目录下新建四个xml文件

switch_thumb_on.xml

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

   switch_thumb_off.xml 

2. <?xml version="1.0" encoding="utf-8"?>
   <shape xmlns:android="http://schemas.android.com/apk/res/android"
       android:shape="rectangle">
       <solid
           android:color="#7c7c7c">
       </solid>
   
       <size
           android:width="30dp"
           android:height="30dp">
       </size>
       <corners
           android:radius="32dp">
       </corners>
   
   </shape>

   switch_track_off.xml

3. <?xml version="1.0" encoding="utf-8"?>
   <shape xmlns:android="http://schemas.android.com/apk/res/android"
       android:shape="rectangle">
       <solid
           android:color="@android:color/darker_gray">
       </solid>
       <stroke android:color="#00000000"
           android:width="20dp" />
   
       <corners
           android:radius="20dp">
       </corners>
   
   </shape>
   

   switch_teack_on.xml

4. <?xml version="1.0" encoding="utf-8"?>
   <shape xmlns:android="http://schemas.android.com/apk/res/android"
       android:shape="rectangle">
   
       <solid
           android:color="@android:color/holo_green_light">
       </solid>
       <stroke android:color="#00000000"
           android:width="20dp"/>
   
       <corners
           android:radius="20dp">
       </corners>
   
   </shape>
   

   前两个为可移动滑块的开关xml文件，后面两个为滑块轨迹的xml文件，接下来再新建一个xml文件switch_track.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/switch_track_on" />
    <item android:state_checked="false"
        android:drawable="@drawable/switch_track_off"/>


</selector>

这个xml文件规定了滑块不同状态引用对应的xml文件，此时有两种做法：

方法1. 在value-->styles.xml中添加

style name="My.TextAppearance" parent="@style/TextAppearance.AppCompat.Widget.Switch">
 
        <item name="android:textSize">20dp</item>
 
        <item name="android:textColor">#000</item>
 
    </style>

然后在你布局的xml文件中添加：

<Switch
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true"
        android:layout_gravity="center_horizontal"
        android:layout_marginStart="348dp"
        android:layout_weight="1"
        android:checked="false"
        android:switchTextAppearance="@style/My.TextAppearance"
        tools:checked="true" />

运行模拟器，就可以看到自定义switch。

方法2.再新建一个xml文件，switch_thumb.xml

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

</selector>

再去布局文件引用switch控件即可

<Switch
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:layout_marginStart="248dp"
        android:switchMinWidth="70dp"
        android:checked="false"
        android:showText="true"
        android:textOn="开"
        android:textOff="关"
        android:thumb="@drawable/switch_thumb"
        android:track="@drawable/switch_track"
        tools:checked="true" />

这里前面的移动轨迹xml中

<stroke android:color="#00000000"
    android:width="20dp" />

代表用一个透明边框去约束里面的轨迹从而实现，轨迹为一条细线，这里感谢我的同事对我的指导＠jerome