需求
在登录页面。我们需要有一个复选框,让用户进行勾选,同意我们的流氓政策和协议,不然就不让用。
实现效果
未选择
已选择
我们知道,这个CheckBox的默认样式是一个正方形,现在改成一个圆形的话,首先需要准备两个图案。
创建一个文件
baseline_checked_circle_24.xml
这个文件长这样
<vector xmlns:android="http://schemas.android.com/apk/res/android"android:width="24dp"android:height="24dp"android:tint="#FFFFFF"android:viewportWidth="24"android:viewportHeight="24"><pathandroid:fillColor="@android:color/white"android:pathData="M12,2C6.48,2 2,6.48 2,12s4.48,10 10,10 10,-4.48 10,-10S17.52,2 12,2zM10,17l-5,-5 1.41,-1.41L10,14.17l7.59,-7.59L19,8l-9,9z" />
</vector>
再创建一个这样的图片
baseline_uncheck_circle_outline_24.xml
<vector xmlns:android="http://schemas.android.com/apk/res/android"android:width="24dp"android:height="24dp"android:tint="#382D2D"android:viewportWidth="24"android:viewportHeight="24"><pathandroid:fillColor="@android:color/white"android:pathData="M16.59,7.58L10,14.17l-3.59,-3.58L5,12l5,5 8,-8zM12,2C6.48,2 2,6.48 2,12s4.48,10 10,10 10,-4.48 10,-10S17.52,2 12,2zM12,20c-4.42,0 -8,-3.58 -8,-8s3.58,-8 8,-8 8,3.58 8,8 -3.58,8 -8,8z" />
</vector>
创建一个选择器文件 checkbox_circle.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android"><item android:drawable="@drawable/baseline_checked_circle_24" android:state_checked="true" /><item android:drawable="@drawable/baseline_uncheck_circle_outline_24" android:state_checked="false" />
</selector>
我们还可以创建这个选择器文件
checkbox_color_selector.xml
这是圆圈外面的颜色变换
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android"><!-- 选中状态下的颜色 --><item android:color="#FFFFFF" android:state_checked="true" /><!-- 未选中状态下的颜色 --><item android:color="#382D2D" android:state_checked="false" />
</selector>
在布局文件
<CheckBoxandroid:id="@+id/login_cb"android:layout_width="wrap_content"android:layout_height="@dimen/dp_20"android:background="#00FFFFFF"android:button="@drawable/checkbox_circle"android:buttonTint="@color/checkbox_color_selector"android:checked="true"android:paddingStart="@dimen/dp_5"android:text="勾选即同意"android:textColor="#FFFFFF"android:textSize="@dimen/sp_12" />
在Activity里面
loginCb.setOnCheckedChangeListener { _, isChecked ->if(isChecked){//选中}else{//未选中}
}