Android开发手册自定义Switch开关按钮控件


Posted in Java/Android onJune 10, 2022

?自定义Switch外观

外观定制这块属于基操了,我们利用属性 android:track 和 android:thumb 定制 Switch 的背景图片和滑块图片,UI那能直接切图肯定做起来更快,此方式实现极其简单指定图片就行,所以今天我们实操的是自定义drawable的形式。

Android开发手册自定义Switch开关按钮控件

布局样式

<Switch
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:thumb="@drawable/selector_switch_thumb"
    android:layout_margin="16dp"
    android:track="@drawable/selector_switch_track" />

Drawable代码

<?xml version="1.0" encoding="utf-8"?><!--switch的自定义轨道-->
<!--selector_switch_track.xml文件-->
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/track_on" android:state_checked="true" />
    <item android:drawable="@drawable/track_off" android:state_checked="false" />
</selector>
<?xml version="1.0" encoding="utf-8"?><!--switch的自定义圆钮-->
<!--selector_switch_thumb.xml文件-->
<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>
<?xml version="1.0" encoding="utf-8"?>
<!--track_on.xml文件-->
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid android:color="#BB00FF00" />
    <!-- 这个是用来实现轨道高度小于圆钮高度的,值越大轨道越细-->
    <!-- 同理,若thumb有stroke,track没有,可实现圆钮在轨道里的伪效果-->
    <stroke
        android:width="8dp"
        android:color="#00000000" />
    <corners android:radius="20dp" />
</shape>
<?xml version="1.0" encoding="utf-8"?>
<!--track_off.xml文件-->
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid android:color="#E4E4E4" />
    <!-- 这个是用来实现轨道高度小于圆钮高度的,值越大轨道越细-->
    <stroke
        android:width="8dp"
        android:color="#00000000" />
    <corners android:radius="20dp" />
</shape>
<?xml version="1.0" encoding="utf-8"?>
<!--thumb_on.xml文件-->
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <solid android:color="#FFFF00" />
    <size
        android:width="20dp"
        android:height="20dp" />
</shape>
<?xml version="1.0" encoding="utf-8"?>
<!--thumb_off.xml文件-->
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <solid android:color="#AAAAAA" />
    <size
        android:width="20dp"
        android:height="20dp" />
</shape>

要想实现下图效果:

Android开发手册自定义Switch开关按钮控件

就是小空在代码中注释所述,在开关按钮上增加一个透明的边框,轨道的高度会自动变化。

除了Switch还有另一个开关ToggleButton,该控件无thumb和track,相比Switch缺少了滑动的动画效果。在使用上和Switch基本一致,同样可以自定义。

Android开发手册自定义Switch开关按钮控件

以上就是Android开发手册自定义Switch开关按钮控件的详细内容,更多关于Android开发自定义Switch控件的资料请关注三水点靠木其它相关文章!


Tags in this post...

Java/Android 相关文章推荐
新手入门Jvm-- JVM对象创建与内存分配机制
Jun 18 Java/Android
详解Java实践之抽象工厂模式
Jun 18 Java/Android
Java Dubbo框架知识点梳理
Jun 26 Java/Android
Java常用工具类汇总 附示例代码
Jun 26 Java/Android
Java图书管理系统,课程设计必用(源码+文档)
Jun 30 Java/Android
Spring Security中用JWT退出登录时遇到的坑
Oct 16 Java/Android
OpenCV实现普通阈值
Nov 17 Java/Android
SpringBoot2零基础到精通之异常处理与web原生组件注入
Mar 22 Java/Android
Spring事务管理下synchronized锁失效问题的解决方法
Mar 31 Java/Android
教你在 Java 中实现 Dijkstra 最短路算法的方法
Apr 08 Java/Android
Java设计模式之代理模式
Apr 22 Java/Android
Springboot-cli 开发脚手架,权限认证,附demo演示
Apr 28 Java/Android
java实现面板之间切换功能
Jun 10 #Java/Android
Spring Boot项目如何优雅实现Excel导入与导出功能
Jun 10 #Java/Android
解决spring.thymeleaf.cache=false不起作用的问题
Jun 10 #Java/Android
Android开发手册Chip监听及ChipGroup监听
Jun 10 #Java/Android
Java实现带图形界面的聊天程序
Jun 10 #Java/Android
Android中View.post和Handler.post的关系
Android Canvas绘制文字横纵向对齐
Jun 05 #Java/Android
You might like
如何在PHP中使用Oracle数据库(6)
2006/10/09 PHP
ADODB类使用
2006/11/25 PHP
在PHP中使用反射技术的架构插件使用说明
2010/05/18 PHP
php实现读取手机客户端浏览器的类
2015/01/09 PHP
User Scripts: Video Download by User Scripts
2007/05/14 Javascript
Javascript 实现TreeView CheckBox全选效果
2010/01/11 Javascript
jQuery动态改变图片显示大小(修改版)的实现思路及代码
2013/12/24 Javascript
jQuery的one()方法用法实例
2015/01/19 Javascript
JavaScript实现的简单幂函数实例
2015/04/17 Javascript
jQuery插件实现静态HTML验证码校验
2015/11/06 Javascript
JavaScript如何动态创建table表格
2020/08/02 Javascript
jQuery操作基本控件方法实例分析
2015/12/31 Javascript
AngularJS实现数据列表的增加、删除和上移下移等功能实例
2016/09/05 Javascript
微信小程序开发的四十个技术窍门总结(推荐)
2017/01/23 Javascript
vue实现element表格里表头信息提示功能(推荐)
2019/11/20 Javascript
vue实现给div绑定keyup的enter事件
2020/07/31 Javascript
[33:23]Secret vs Serenity 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
Python3实现将文件树中所有文件和子目录归档到tar压缩文件的方法
2015/05/22 Python
Python减少循环层次和缩进的技巧分析
2016/03/15 Python
Pandas中把dataframe转成array的方法
2018/04/13 Python
解决pip install xxx报错SyntaxError: invalid syntax的问题
2018/11/30 Python
详解python的argpare和click模块小结
2019/03/31 Python
Python中的类与类型示例详解
2019/07/10 Python
使用Python对Dicom文件进行读取与写入的实现
2020/04/20 Python
python 实现读取csv数据,分类求和 再写进 csv
2020/05/18 Python
Python基于traceback模块获取异常信息
2020/07/23 Python
Columbia Sportswear法国官网:全球户外品牌
2020/09/25 全球购物
Vector, ArrayList, HashTable, HashMap哪些是线程安全的,哪些不是
2015/10/12 面试题
爱岗敬业演讲稿
2014/05/05 职场文书
关于教师节的广播稿
2014/09/10 职场文书
自愿解除劳动合同协议书
2014/09/11 职场文书
2015年项目经理工作总结
2015/04/30 职场文书
党员“一帮一”活动总结
2015/05/07 职场文书
史上最全书信经典范文大全(建议收藏)
2019/07/10 职场文书
vue如何使用模拟的json数据查看效果
2022/03/31 Vue.js
Python语法学习之进程的创建与常用方法详解
2022/04/08 Python