提供了编程的基础技术教程

zl程序教程

您现在的位置是：首页 >  移动开发

当前栏目

安卓使用selector定制复选框(checkbox)

安卓 定制 checkbox 复选框 Selector 使用
2023-09-27 14:27:30 时间

效果图

未选中/选中状态

实现方案

  1. 增加选中状态下背景图:switch_selected.xml
<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="32dp"
    android:height="32dp"
    android:viewportWidth="1024"
    android:viewportHeight="1024">
    <path
        android:fillColor="#FF8C00"
        android:pathData="M512.1,960C271.5,960 76.5,765 76.5,524.5c0,-178.1 107,-331.2 260.3,-398.7l0.7,1.3c2.1,-0.5 4.3,-0.7 6.6,-0.7 17.2,0 31.1,14 31.1,31.1 0,7.6 -2.9,14.4 -7.4,19.9l1.4,2.3c-2.5,1 -5,2.3 -7.4,3.4 -2.8,2 -5.9,3.4 -9.2,4.3 -126.3,59.8 -213.7,188.3 -213.7,337.3C138.8,730.8 306,898 512.2,898s373.1,-167.4 373.1,-373.5c0,-139.9 -77.1,-261.5 -190.8,-325.4 -12,-4.3 -20.7,-15.7 -20.7,-29.2 0,-17.2 14,-31.1 31.1,-31.1 5.8,0 11.1,1.7 15.7,4.4l0.5,-0.8c134.9,74 226.4,217.2 226.4,382.1C947.6,765 752.6,960 512.1,960zM711.1,275.5c0,6.8 5.5,12.5 12.5,12.5 6.9,0 12.5,-5.5 12.5,-12.5s-5.5,-12.5 -12.5,-12.5 -12.5,5.7 -12.5,12.5zM512.1,835.6C340.3,835.6 201,696.3 201,524.5c0,-21.1 2.2,-41.7 6.1,-61.7l-22.9,-12.1c-5.3,23.8 -8.2,48.4 -8.2,73.7 0,185.5 150.4,335.9 335.9,335.9s335.9,-150.4 335.9,-335.9c0,-85.5 -32,-163.5 -84.6,-222.7l-15.7,20.1c46.9,54.4 75.3,125.1 75.3,202.6 0.2,171.9 -139,311.2 -310.7,311.2zM530.7,623.9c17.2,0 31.1,-14 31.1,-31.1L561.8,95.1c0,-17.2 -14,-31.1 -31.1,-31.1h-12.5c-17.2,0 -31.1,14 -31.1,31.1v497.8c0,17.2 14,31.1 31.1,31.1l12.5,-0.1z" />
</vector>
  1. 增加未选中状态下背景图:switch_unselected.xml
<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="32dp"
    android:height="32dp"
    android:viewportWidth="1024"
    android:viewportHeight="1024">
    <path
        android:fillColor="#DCDCDC"
        android:pathData="M512.1,960C271.5,960 76.5,765 76.5,524.5c0,-178.1 107,-331.2 260.3,-398.7l0.7,1.3c2.1,-0.5 4.3,-0.7 6.6,-0.7 17.2,0 31.1,14 31.1,31.1 0,7.6 -2.9,14.4 -7.4,19.9l1.4,2.3c-2.5,1 -5,2.3 -7.4,3.4 -2.8,2 -5.9,3.4 -9.2,4.3 -126.3,59.8 -213.7,188.3 -213.7,337.3C138.8,730.8 306,898 512.2,898s373.1,-167.4 373.1,-373.5c0,-139.9 -77.1,-261.5 -190.8,-325.4 -12,-4.3 -20.7,-15.7 -20.7,-29.2 0,-17.2 14,-31.1 31.1,-31.1 5.8,0 11.1,1.7 15.7,4.4l0.5,-0.8c134.9,74 226.4,217.2 226.4,382.1C947.6,765 752.6,960 512.1,960zM711.1,275.5c0,6.8 5.5,12.5 12.5,12.5 6.9,0 12.5,-5.5 12.5,-12.5s-5.5,-12.5 -12.5,-12.5 -12.5,5.7 -12.5,12.5zM512.1,835.6C340.3,835.6 201,696.3 201,524.5c0,-21.1 2.2,-41.7 6.1,-61.7l-22.9,-12.1c-5.3,23.8 -8.2,48.4 -8.2,73.7 0,185.5 150.4,335.9 335.9,335.9s335.9,-150.4 335.9,-335.9c0,-85.5 -32,-163.5 -84.6,-222.7l-15.7,20.1c46.9,54.4 75.3,125.1 75.3,202.6 0.2,171.9 -139,311.2 -310.7,311.2zM530.7,623.9c17.2,0 31.1,-14 31.1,-31.1L561.8,95.1c0,-17.2 -14,-31.1 -31.1,-31.1h-12.5c-17.2,0 -31.1,14 -31.1,31.1v497.8c0,17.2 14,31.1 31.1,31.1l12.5,-0.1z" />
</vector>
  1. 增加selector: switch_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/switch_selected" android:state_checked="true" />
    <item android:drawable="@drawable/switch_unselected" android:state_checked="false" />
</selector>
  1. 在checkbox中使用
<CheckBox
    android:button="@drawable/switch_selector"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" />

源代码

https://gitee.com/cxyzy1/CheckBoxDemo

安卓开发入门教程系列汇总

安卓发展历程及前景

安卓发展历程
安卓开发前景展望

初探安卓

安装开发工具
创建第一个安卓工程

开发语言学习

Kotlin语言基础

UI控件学习系列

UI控件_TextView
UI控件_EditText
UI控件_Button
UI控件_ImageView
UI控件_RadioButton
UI控件_CheckBox
UI控件_ProgressBar

关注头条号,第一时间获取最新文章:

相关文章