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 相关文章推荐
浅析NIO系列之TCP
Jun 15 Java/Android
看完这篇文章获得一些java if优化技巧
Jul 15 Java/Android
java设计模式--建造者模式详解
Jul 21 Java/Android
Java面试题冲刺第十九天--数据库(4)
Aug 07 Java/Android
MyBatis自定义SQL拦截器示例详解
Oct 24 Java/Android
Java 在线考试云平台的实现
Nov 23 Java/Android
Java中的继承、多态以及封装
Apr 11 Java/Android
Elasticsearch Recovery 详细介绍
Apr 19 Java/Android
Java 多态分析
Apr 26 Java/Android
springcloud整合seata
May 20 Java/Android
Android开发手册Chip监听及ChipGroup监听
Jun 10 Java/Android
Spring boot实现上传文件到本地服务器
Aug 14 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对图像的各种处理函数代码小结
2013/07/08 PHP
PHP统计数值数组中出现频率最多的10个数字的方法
2015/04/20 PHP
Zend Framework框架Smarty扩展实现方法
2016/03/22 PHP
PHP学习笔记之php文件操作
2016/06/03 PHP
thinkPHP5.0框架自动加载机制分析
2017/03/18 PHP
PHP数组中头部和尾部添加元素的方法(array_unshift,array_push)
2017/04/10 PHP
SUN的《AJAX与J2EE》全文译了
2007/02/23 Javascript
超轻量级的基于jquery的三级展开列表
2011/04/26 Javascript
浅谈javascript中的闭包
2015/05/13 Javascript
PHP+jquery+ajax实现分页
2016/12/09 Javascript
微信小程序 表单Form实例详解(附源码)
2016/12/22 Javascript
vue mint-ui学习笔记之picker的使用
2017/10/11 Javascript
vue本地打开build后生成的dist文件夹index.html问题
2019/09/04 Javascript
layer.js open 隐藏滚动条的例子
2019/09/05 Javascript
微信小程序实用代码段(收藏版)
2019/12/17 Javascript
微信小程序自定义弹出模态框禁止底部滚动功能
2020/03/09 Javascript
vue-cli3项目配置eslint代码规范的完整步骤
2020/09/10 Javascript
从零学python系列之数据处理编程实例(一)
2014/05/22 Python
详解Django中Request对象的相关用法
2015/07/17 Python
python批量提取word内信息
2015/08/09 Python
python下setuptools的安装详解及No module named setuptools的解决方法
2017/07/06 Python
Python如何快速上手? 快速掌握一门新语言的方法
2017/11/14 Python
tensorflow学习笔记之简单的神经网络训练和测试
2018/04/15 Python
Python最小二乘法矩阵
2019/01/02 Python
Django框架验证码用法实例分析
2019/05/10 Python
对Python生成器、装饰器、递归的使用详解
2019/07/19 Python
tensorflow实现训练变量checkpoint的保存与读取
2020/02/10 Python
Python内建序列通用操作6种实现方法
2020/03/26 Python
家长给老师的道歉信
2014/01/13 职场文书
院领导写的就业推荐信
2014/03/09 职场文书
表彰大会策划方案
2014/05/13 职场文书
中国梦演讲稿范文
2014/08/28 职场文书
2015年学校党建工作总结
2015/05/19 职场文书
2019已经过半,你知道年中工作总结该怎么写吗?
2019/07/03 职场文书
TV动画《史上最强大魔王转生为村民A》番宣CM公布
2022/04/01 日漫
CentOS下安装Jenkins的完整步骤
2022/04/07 Servers