
翻了一遍switchCompat詳解,要想自己改掉原生樣式成上圖樣板,改掉原生track 和 thumb即可, 話不多說上demo
新建thumb_selector:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/thumb_on" android:state_checked="true">
<item android:drawable="@drawable/thumb_off" android:state_checked="false">
</selector>
thumb_on 和 thumb_off 樣式:
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" ?>
? ? <shape android:shape="rectangle">
? ? ? ? <size android:width="28dp" android:height="28dp" />
? ? ? ? <gradient android:startColor="#06b4ea" android:endColor="#009ee8" android:angle="-90" />
? ? ? ? <corners android:radius="20dp" />
<item android:gravity="center"? >
? ? <shape android:shape="oval"? >
? ? ? ? <solid android:color="#FFFFFF"/>
? ? ? ? <size android:width="16dp" android:height="16dp" />
</layer-list>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
? ? ? ? <shape android:shape="rectangle">
? ? ? ? ? ? <size android:width="28dp" android:height="28dp" />
? ? ? ? ? ? <corners android:radius="20dp" />
? ? ? ? android:gravity="center" >
? ? ? ? <shape android:shape="oval">
? ? ? ? ? ? <solid android:color="#19191919"? />
? ? ? ? ? ? <size android:height="16dp" android:width="16dp" />
</layer-list>
track_selector , track_on, track_off :
<selector xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
? ? <item android:state_checked="true"? android:drawable="@drawable/track_on" />
? ? <item android:drawable="@drawable/track_normal" />
</selector>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
? ? <size android:width="56dp" android:height="28dp" />
? ? <gradient android:startColor="#06b4ea" android:endColor="#009ee8" android:angle="-90" />
? ? <corners android:radius="20dp" />
</shape>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
? ? <size android:width="56dp" android:height="28dp" />
? ? <solid android:color="#0c000000" />
? ? <stroke android:color="#19191919" android:width="1dp" />
? ? <corners android:radius="20dp" />
</shape>
xml 中引用如下:
<androidx.appcompat.widget.SwitchCompat
? ? android:id="@+id/switch_compat"
? ? android:layout_width="wrap_content"
? ? android:layout_height="wrap_content"
? ? app:switchMinWidth="56dp"
? ? android:background="@null"
? ? app:track="@drawable/track_selector"
? ? android:thumb="@drawable/thumb_selector"
? ? app:theme="@style/switchStyle"/>
有些機型可能還是會展示原生樣式, 則需自己把原生樣式統(tǒng)統(tǒng)去掉,styles.xml新增:
<style name="switchStyle" parent="Theme.AppCompat.Light">
? ? <item name="colorControlActivated">#00000000
? ? <item name="colorSwitchThumbNormal">#00000000
? ? <item name="android:colorForeground">#00000000
</style>
xml中用app:theme調(diào)用即可。
OK啦~~~~~·