Android开发入门组件（五）——CheckBox

今天来写组件CheckBox的使用，老套路先上成果图，让大家先懂我要做什么，很明白就是做一个多选款框按钮。

1.常用属性

先讲一下CheckBox的常用属性，不像RadioButton那样需要放在RadioGroup中定义为一类，只需要直接定义CheckBox即可。

放代码看一下先

<TextView
        android:id="@+id/tv_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="你会哪些开发？"
        android:textColor="#000000"
        android:textSize="25sp"
        android:layout_marginBottom="20dp"/>
    <CheckBox
        android:id="@+id/cb1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="10dp"
        android:text="Android"
        android:textSize="20sp"
        android:textColor="#959632"/>
    <CheckBox
        android:id="@+id/cb2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="10dp"
        android:text="IOS"
        android:textSize="20sp"
        android:textColor="#959632"/>
    <CheckBox
        android:id="@+id/cb3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="10dp"
        android:text="html"
        android:textSize="20sp"
        android:textColor="#959632"/>
    <CheckBox
        android:id="@+id/cb4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="10dp"
        android:text="other"
        android:textSize="20sp"
        android:textColor="#959632"/>

效果图

2.自定义样式

根据选中和未选中的两种情况进行不同图片的显示，而不是之前的打钩方框。

不同的是在android:button="@drawable/bg_checkbox" 进行样式的引用

（1）样式文件

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="false"
        android:drawable="@drawable/username"> //未选中时的图片源
    </item>
    <item android:state_checked="true"
        android:drawable="@drawable/password">  //选中时的图片源
    </item>
</selector>

（2）xml文件

<LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="你的兴趣是？"
            android:textColor="#000"
            android:textSize="25sp"
            android:layout_marginBottom="10dp"
            />
        <CheckBox
            android:id="@+id/cb5"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="10dp"
            android:text="电影"
            android:button="@drawable/bg_checkbox"  //进行样式的引用
            android:paddingLeft="10dp" 
            android:textSize="20sp"
            android:textColor="#959632" />
        <CheckBox
            android:id="@+id/cb6"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="10dp"
            android:button="@drawable/bg_checkbox"  //进行样式的引用
            android:text="旅行"
            android:paddingLeft="10dp"
            android:textSize="20sp"
            android:textColor="#959632" />
        <CheckBox
            android:id="@+id/cb7"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="10dp"
            android:text="运动"
            android:paddingLeft="10dp"  
            android:button="@drawable/bg_checkbox"  //进行样式的引用
            android:textSize="20sp"
            android:textColor="#959632"/>
        <CheckBox
            android:id="@+id/cb8"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="10dp"
            android:text="电竞"
            android:paddingLeft="10dp"
            android:button="@drawable/bg_checkbox"  //进行样式的引用
            android:textSize="20sp"
            android:textColor="#959632"/>
    </LinearLayout>

效果图放上

3.监听事件

package com.example.androidstudy;
import androidx.appcompat.app.AppCompatActivity;
import android.content.Intent;
import android.graphics.Color;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.CheckBox;
import android.widget.CompoundButton;
import android.widget.RadioButton;
import android.widget.RadioGroup;
import android.widget.Toast;

public class CheckBoxActivity extends AppCompatActivity {

    CheckBox cb5,cb6,cb7,cb8;
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_checkbox);
        cb5=findViewById(R.id.cb5);
        cb6=findViewById(R.id.cb6);
        cb7=findViewById(R.id.cb7);
        cb8=findViewById(R.id.cb8);
        cb5.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
            @Override
            public void onCheckedChanged(CompoundButton compoundButton, boolean b) {
                Toast.makeText(CheckBoxActivity.this,b?"5选中":"5未选中",Toast.LENGTH_SHORT).show();
            }
        });
        cb6.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
            @Override
            public void onCheckedChanged(CompoundButton compoundButton, boolean b) {
                Toast.makeText(CheckBoxActivity.this,b?"6选中":"6未选中",Toast.LENGTH_SHORT).show();
            }
        });
        cb7.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
            @Override
            public void onCheckedChanged(CompoundButton compoundButton, boolean b) {
                Toast.makeText(CheckBoxActivity.this,b?"7选中":"7未选中",Toast.LENGTH_SHORT).show();
            }
        });
        cb8.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
            @Override
            public void onCheckedChanged(CompoundButton compoundButton, boolean b) {
                Toast.makeText(CheckBoxActivity.this,b?"8选中":"8未选中",Toast.LENGTH_SHORT).show();
            }
        });
    }
}

效果图放上