android switch样式

2020-09-08  本文已影响0人  happyhou
WechatIMG1462.png

中间白色的原点是thumb,黄色的背景是track。


            <Switch
                    android:id="@+id/ai_setting_camera_switch"
                    android:layout_width="50dp"
                    android:layout_height="wrap_content"
                    android:background="@null"
                    android:checked="true"
                    android:showText="false"
                    android:thumb="@drawable/ai_thumb_selector"
                    android:track="@drawable/ai_track_selector"
                    />

ai_thumb_selector:

<?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/ai_thumb_on" />
    <item android:drawable="@drawable/ai_thumb_off" />
</selector>

ai_thumb_on:

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

    <!--高度40-->
    <size android:height="20dp" android:width="20dp" />
    <!--圆角弧度20-->
    <corners android:radius="20dp"/>
    <!--变化率-->
    <gradient
        android:endColor="#ffffff"
        android:startColor="#ffffff" />
    <stroke android:width="1dp"
        android:color="#FFD506" />
</shape>

ai_thumb_off:

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

    <!--高度40-->
    <size android:height="20dp" android:width="20dp" />
    <!--圆角弧度20-->
    <corners android:radius="20dp"/>
    <!--变化率-->
    <gradient
        android:endColor="#ffffff"
        android:startColor="#ffffff" />
    <stroke android:width="1dp"
        android:color="#EDEDED" />
</shape>

ai_track_selector:

<?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/ai_track_blue" />
    <item android:drawable="@drawable/ai_track_gray" />
</selector>

ai_track_blue:

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

    <!--高度30此处设置宽度无效-->
    <size android:height="22dp"/>
    <!--圆角弧度15-->
    <corners android:radius="15dp"/>
    <!--变化率定义从左到右的颜色不变-->
    <gradient
        android:endColor="#FFD506"
        android:startColor="#FFD506"/>
</shape>

ai_track_gray:

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

    <!--高度30此处设置宽度无效-->
    <size android:height="22dp"/>
    <!--圆角弧度15-->
    <corners android:radius="15dp"/>
    <!--变化率定义从左到右的颜色不变-->
    <gradient
        android:endColor="#EDEDED"
        android:startColor="#EDEDED"/>
</shape>
上一篇下一篇

猜你喜欢

热点阅读