Android switch 使用

  • 第一步
            <Switch
                android:id="@+id/switchbutton"
                android:layout_width="wrap_content"
                android:layout_height="34dp"
                android:layout_gravity="center"
                android:layout_marginLeft="37dp"
                android:layout_marginRight="37dp"
                android:layout_marginTop="34dp"
                android:showText="false"//球上是否显示文字,默认是true
                android:switchMinWidth="180dp"//这个属性是滑动块的宽度,可恶啊
                android:thumb="@drawable/switch_thumb"
                android:track="@drawable/switch_track" />

另一种情况

    <Switch
        android:id="@+id/switchbutton_mode"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentEnd="true"
        android:layout_marginRight="5dp"
        android:layout_marginTop="20dp"
        android:showText="true"
        android:textOn="英译汉"
        android:textOff="汉译英"
        android:thumb="@drawable/switch_thumb"
        android:track="@drawable/switch_track"/>
  • 第二步:画图
  1. 在drabable文件下switch_thumb.xml
<?xml version="1.0" encoding="utf-8"?>
<!-- 控制Switch在不同状态下,按钮的颜色 -->
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="true" android:drawable="@drawable/check_thumb" />
    <item android:drawable="@drawable/no_check_thumb" />
</selector>
  1. 在drabable文件下check_thumb.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle" >

    <!-- 高度40 -->
    <size android:height="40dp" android:width="40dp"/>
    <!-- 圆角弧度 20 -->
    <corners android:radius="20dp"/>

    <!-- 变化率 -->
    <gradient
        android:endColor="#FAFAFA"
        android:startColor="#FEFEFE" />

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

</shape>
  1. 在drabable文件下no_check_thumb.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle" >

    <!-- 高度40 -->
    <size android:height="40dp" android:width="40dp"/>
    <!-- 圆角弧度 20 -->
    <corners android:radius="20dp"/>

    <!-- 变化率 -->
    <gradient
        android:endColor="#FAFAFA"
        android:startColor="#FEFEFE" />

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

</shape>
  1. 在drabable文件下switch_track.xml
<?xml version="1.0" encoding="utf-8"?>
<!-- 控制Switch在不同状态下,底下下滑条的颜色 -->
<selector xmlns:android="http://schemas.android.com/apk/res/android" >

    <item android:state_checked="true" android:drawable="@drawable/check_track" />
    <item android:drawable="@drawable/no_check_track" />

</selector>
  1. 在drabable文件下check_track.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- 高度40 此处设置宽度无效 -->
    <size android:height="34dp" android:width="180dp"/>
    <!-- 圆角弧度 20 -->
    <corners android:radius="25dp"/>

    <!-- 变化率 angle=0 X轴负方向-->
    <gradient
        android:endColor="#FF5151"
        android:startColor="#FF5151"
        android:angle="0"/>
</shape>
  1. 在drabable文件下no_check_track.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle" >

    <!-- 高度40 此处设置宽度无效-->
    <size android:height="34dp" android:width="180dp"/>
    <!-- 圆角弧度 20 -->
    <corners android:radius="25dp"/>

    <!-- 变化率 定义从左到右的颜色不变 -->
    <gradient
        android:endColor="#9e9e9e"
        android:startColor="#9e9e9e" />

</shape>

猜你喜欢

转载自blog.csdn.net/shuijianbaozi/article/details/84064849