Switch自定义样式

2017-03-11  本文已影响0人  颜崔
效果
ares.gif
布局使用
<Switch
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:switchMinWidth="55dp"
    android:textOff=""
    android:textOn=""
    android:thumb="@drawable/switch_selector"
    android:track="@drawable/switch_track" />
switch_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:state_pressed="true" android:drawable="@drawable/thumb_on"/>
    <item android:state_checked="true" android:drawable="@drawable/thumb_on"/>
    <item android:drawable="@drawable/thumb_off"/>

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

    <size android:width="20dp"
        android:height="20dp"/>

    <stroke android:width="1dp"
        android:color="#00ffffff"/>

    <corners android:bottomLeftRadius="20dp"
        android:bottomRightRadius="20dp"
        android:topLeftRadius="20dp"
        android:topRightRadius="20dp"/>

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

    <size android:width="20dp"
        android:height="20dp"/>

    <stroke android:width="6dp"
        android:color="#00ffffff"/>

    <corners android:bottomLeftRadius="20dp"
        android:bottomRightRadius="20dp"
        android:topLeftRadius="20dp"
        android:topRightRadius="20dp"/>

    <solid android:color="#c5c5c5" />
</shape>
switch_track.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:state_focused="true" android:drawable="@drawable/track_on"/>
    <item android:state_checked="true" android:drawable="@drawable/track_on"/>
    <item android:drawable="@drawable/track_off"/>

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

    <size android:height="21dp"
        android:width="55dp"/>

    <corners android:radius="12dp" />

    <stroke android:width="2px"
        android:color="#00bca1"/>

    <solid android:color="#00ffffff" />

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

    <size android:width="55dp"
        android:height="21dp"/>

    <corners android:radius="12dp" />

    <stroke android:width="2px"
        android:color="#c5c5c5"/>

    <solid android:color="#00ffffff" />
</shape>
上一篇 下一篇

猜你喜欢

热点阅读