写点什么

Android Switch 控件修改样式

发布于: 2021 年 11 月 07 日

<shape xmlns:android="http://schemas.android.com/apk/res/android" >


<size android:height="30dp"/>


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


<gradient


android:endColor="#33da33"


android:startColor="#33da33" />


</shape>


选择器 track.xml ??用于控制 Switch 不同状态下,滑动条的底图


<?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/green_track" />


<item ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? android:drawable="@drawable/gray_track" />


</selector>


2. 滑动按钮:底色我用的接近白色的淡灰色,打开时,边上的一圈线条为灰色,关闭时,边上的一圈线条为绿色


实现方式和底部滑动一致


gray_thumb.xml ?:关闭状态,按钮边上一圈颜色为深灰色


<?xml version="1.0" encoding="utf-8"?>


<shape xmlns:android="http://schemas.android.com/apk/res/android"


android:shape="rectangle" >


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


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


<gradient


android:endColor="#eeeeee"


android:startColor="#eeeeee" />


<stroke android:width="1dp"


android:color="#666666"/>


</shape>


green_thumb.xml : 打开状态,按钮边上一圈的颜色为绿色


<?xml version="1.0" encoding="utf-8"?>


<shape xmlns:android="http://schemas.android.com/apk/res/android"


android:shape="rectangle" >


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


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


<gradient


android:endColor="#eeeeee"


android:startColor="#eeeeee" />


<stroke android:width="1dp"


android:color="#33da33"/>


</shape>


选择器 thumb.xml ??用于控制 Switch 不同状态下,按钮的显示状态


<?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/green_thumb" />


<item ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? android:drawable="@drawable/gray_thumb" />


</selector>


3. 将以上选择器设置给 Switch,就好了


界面 ?activity_main.xml


<?xml version="1.0" encoding="utf-8"?>


<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"


android:layout_width="match_parent"


android:layout_height="match_parent"


android:orientation="vertical" >


<Switch


android:layout_width="wrap_content"


android:layout_height="


《Android学习笔记总结+最新移动架构视频+大厂安卓面试真题+项目实战源码讲义》
浏览器打开:qq.cn.hn/FTe 免费领取
复制代码


wrap_content"


android:switchMinWidth="20dp"


android:textOn=" ?"


android:textOff=" ?"


android:thumb="@drawable/thumb"


android:track="@drawable/track" />


<Switch?


android:layout_width="wrap_content"


android:layout_height="wrap_content"


/>


</LinearLayout>


4.高度,宽度的设置


细心的同学会发现,修改 ?android:layout_width ?,?android:layout_height ?这两个属性,并不会实际修改 Switch 的大小


设置大了,边上会出现空白部分,设置小了,Switch 显示不全。


实际设置高度方法:


上面定义滑动条和按钮底图的地方相信大家都注意到, ??<size android:height="30dp"/> ?这行代码,


修改 ?green_track.xml,gray_track.xml ?中的高度,即可修改高度(修改 green_thumb.xml ?gray_thumb.xml ?中的高度貌似无效)。


实际修改宽度的方法:

评论

发布
暂无评论
Android Switch控件修改样式