How to create CheckBoxes in Android

CheckBox is a fully implemented widget provided by Android. Checkboxes are used for selecting one or more options from a set. In this tutorial we would be discussing about creating the standard and customized CheckBoxes. CheckBox is a special type of button that has two states, checked and unchecked.
The CheckBox in Android is as below.

As you can see the above picture, CheckBox in android has a TextView whose properties can be used to format the widget. One must avoid using a single checkbox to turn an option off or on. The checked event of the CheckBox is handled by setting the onCheckedChangeListener for the CheckBox. The callback for the listener is onCheckedChanged(), which is responsible for receiving the CheckBox whose state has changed and its new state.

Creating a CheckBox

You can create a CheckBox by creating an instance of android.widget. CheckBox as below,

<CheckBox
android:id="@+id/checkBox1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="Check Me" />
Within Java, you can manage the state of a checkbox by using the following,

 isChecked() : used to obtain the state of the CheckBox.
toggle() : toggles the CheckBox state.
setChecked() : Used to set the CheckBox state to checked or unchecked.

Let us now create a sample application that shows the usage of CheckBoxes in Android.
Step 1: Set up the android development environment
This topic has already been discussed in one of our previous posts Environment. Please refer the post for more queries. I would be using Android 4.0 for this example
Step 2: Create An Android Project
Create an Android project named “CheckBoxDemo” with the launcher activity CheckBoxDemoActivity.java. For more information on how to create a new project in android, please refer to the post Create an android project.
Step 3: Create the required layouts
I would be using main.xml layout file. To know more about layout xml files, please go through the post Layouts. Open the main.xml file and paste the below code.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/RelativeLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >

<TextView
android:id="@+id/TextView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="20dip"
android:text="CheckBox Demo"
android:textSize="18sp"
android:textStyle="bold" />

<CheckBox
android:id="@+id/checkBox1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="CheckBox: Unchecked" />

</RelativeLayout>
As you can see in the above code, the main.xml has a RelativeLayout which in turn has a textview and a checkbox. The CheckBox tag is used to create the Checkbox widget.
Step 4: Create the required activities
The launcher Activity CheckBoxDemoActivity.java. has the below code,
package my.app;

import android.app.Activity;
 import android.os.Bundle;
 import android.widget.CheckBox;
 import android.widget.CompoundButton;
 import android.widget.CompoundButton.OnCheckedChangeListener;

public class CheckBoxDemoActivity extends Activity implements OnCheckedChangeListener {
 CheckBox ck1;

/** Called when the activity is first created. */
 @Override
 public void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.main);

ck1=(CheckBox)findViewById(R.id.checkBox1);
 ck1.setOnCheckedChangeListener(this);

}

//Called when the checked state of a compound button has changed
 @Override
 public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
 // TODO Auto-generated method stub

if(isChecked){
 ck1.setText("CheckBox: Checked");
 }
 else{
 ck1.setText("CheckBox: Unchecked");
 }

}
 }
Each CheckBox is managed separately. As you can see, we have registered a listener which is to be notified when the state of the Chekcbox changes. In this example, we would be changing the text of the checkbox when the user clicks on it.

As you can notice, we have registered onCheckedChangeListener and not onClickedListener as in the case of normal button. The callback for the listener is onCheckedChanged(). This callback receives the CheckBox whose state has changed.
Step 5: Declaring the Activities in AndroidManifest.xml
The AndroidManifest.xml file has the below code. To know more about manifest file, please refer the post Manifest.
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="my.app"
android:versionCode="1"
android:versionName="1.0" >

<uses-sdk android:minSdkVersion="14" />

<application
android:icon="@drawable/ic_launcher"
android:label="@string/app_name" >
<activity
android:label="@string/app_name"
android:name=".CheckBoxDemoActivity" >
<intent-filter >
<action android:name="android.intent.action.MAIN" />

<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>

</manifest>
Step 6: Run your application
Select your project->Right click->Run As->Android Application

Your launcher activity opens up as below,
At first the CheckBox is in unchecked state as shown by the TextView. Clicking the CheckBox immediately updates its text as below,
You can see the changed text in the above figure. Unchecked has been changed to checked when the CheckBox state is checked.
Creating custom CheckBox
Till now we have studied how to create a standard CheckBox in Android. So now you would be learning how to create custom CheckBox in android. Like all widgets, the standard CheckBox can be customized. You can change the color, shape and behaviors. This is done by creating a XML selector and assigning that selector to the CheckBox in your layout. selectors are the elements provided by android which allows users to create a single reference to multiple images and the conditions under which they shuold be visible. Follow below steps for creating custom CheckBoxes.

Prepare two images for CheckBox state. Here in this tutorial I would be using a Red square for CheckBox unchecked state and Green square for a checked state. Place these images in res/drawable folder. checked.png is to display when the CheckBox is in checked state. unchecked.png is to display when the CheckBox is in unchecked state.
Create a selector XML in res/drawable folder. The content of the selector XML checkbox_selector.xml is as below,

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

The project structure with selector XML is as below,

Assign the selector to your CheckBox in your layout  – Unlike buttons, Checkboxes have a slightly different mechanism for changing the states. In case of CheckBox, the background is not associated with the state so assigning the selector to the checkbox is done through another attribute called android:button. The below is the code of the main.xml for creating custom checkbox.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/RelativeLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >

<TextView
android:id="@+id/TextView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="20dip"
android:text="CheckBox Demo"
android:textSize="18sp"
android:textStyle="bold" />

<CheckBox
android:id="@+id/checkBox1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="CheckBox: Unchecked"
android:button="@drawable/checkbox_selector"
/>
</RelativeLayout>

Now Run your code with the changes made to the project, The custom adapter is displayed as below,
Change the state of the checked, you can see the changed color of the checkbox drawable,
This is how you can create and use the standard and custom Checkbox in android. CheckBox can be added to AlerDialogs. To know more about how to add CheckBoxes to AlertDialogs, please refer the post AlertDialogCheckBox Hope this turorial served your purpose. Feel free to post your comments.