Decorating CheckBox in Android Android 04.07.2017

In Android, CheckBox is a type of two state button either unchecked or checked in Android. You should use CheckBox when presenting a group of selectable options to users that are not mutually exclusive. CompoundButton is the parent class of CheckBox class.

Unlike RadioButton, android CheckBox works like toggle between two states.

<CheckBox
    android:id="@+id/cbState"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="State of Red button"/>

Below is a list of main properties of CheckBox:

• checked is an attribute of CheckBox used to set the current state of a CheckBox.
• gravity is an optional attribute which is used to control the alignment of the text in CheckBox like left, right, center, top, bottom, center_vertical, center_horizontal etc.
• background attribute is used to set the background of a CheckBox. We can set a color or a drawable in the background of a CheckBox.

You can check the current state of a CheckBox programmatically by using isChecked() method. This method returns a Boolean value either true or false. Below is an example code in which we checked the current state of a CheckBox.

CheckBox cbState = (CheckBox) findViewById(R.id.cbState);

//check current state of a check box (true or false)
Boolean cbState = cbState.isChecked();

// set the current state of a check box
cbState.setChecked(true);

// listener for changes
cbState.setOnCheckedChangeListener(new OnCheckedChangeListener() {
    public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
        // update your model
    }
});

// listener on click
cbState.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        // update your model
    }
});

Here’s some source code for a listener for a set of checkboxes

cbState1.setOnClickListener(checkboxClickListener);
cbState2.setOnClickListener(checkboxClickListener);

View.OnClickListener checkboxClickListener = new View.OnClickListener() {
    @Override
    public void onClick(View view) {
        boolean checked = ((CheckBox) view).isChecked();
        if (checked) {
            String text = null;
            switch (view.getId()){
                case R.id.cbState1:
                    text = "State 1";
                    break;
                case R.id.cbState2:
                    text = "State 2";
                    break;
            }
            Toast.makeText(MainActivity.this, text, Toast.LENGTH_LONG).show();
        }
    }
};

Following snippet makes CheckBox read-only.

android:enabled="false"

We can also change color of CheckBox.

<CheckBox
    android:id="@+id/cbState"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="State of Red button"
    android:theme="@style/CheckBoxTheme"/>

Code for styles.xml file.

<resources>
    ...
    <style name="CheckBoxTheme" parent="Theme.AppCompat.Light">
        <item name="colorControlNormal">#FFC107</item>
        <item name="colorControlActivated">#9C27B0</item>
    </style>
</resources>

We can also create a custom CheckBox. Add three XML-based resources to the res/drawable folder, two that represent the drawing code for the actual CheckBox and a third that is the state selector.

File res/drawable/checked.xml.

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
    <gradient android:startColor="#ffff0000" android:endColor="#ff000000" android:angle="270"/>
    <stroke android:width="4px" android:color="#ffc0c0c0" />
    <size android:height="20dp" android:width="20dp"/>
</shape>

File res/drawable/unchecked.xml.

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
    <gradient android:startColor="#ff585858" android:endColor="#ff000000" android:angle="270"/>
    <stroke android:width="4px" android:color="#ffc0c0c0" />
    <size android:height="20dp" android:width="20dp"/>
</shape>

File res/drawable/custom_checkbox.xml.

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="true" android:drawable="@drawable/checked" />
    <item android:state_pressed="true" android:drawable="@drawable/checked" />
    <item android:drawable="@drawable/unchecked" />
</selector>

Apply selector to the CheckBox.

<CheckBox
    android:id="@+id/cbState"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="State of Red button"
    android:button="@drawable/custom_checkbox"/>