Android CheckBox Tutorial

Table of Contents

Checkbox set on Click Listener:

Android Checkbox is used when you want to allow the users to select multiple choice from a set such as a quiz set which has multiple answers. — Android CheckBox Tutorials

Android Checkbox is used when you want to allow the users to select multiple choice from a set such as if you ask a question which has multiple answers than here you can use android acheckbox. Each checkbox can be used seprately to this you have to set click listner for each checkbox. If you want to create a checkbox you should add CheckBox in the Activity Layout of your xml file such as given by:

<CheckBox
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Java" />

Above Checkbox layout can be created easily to create it just copy the below code:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:orientation="vertical">
   <TextView
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:text="Which Languages you know?"/>
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
        <CheckBox
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="PHP" />
        <CheckBox
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="HTML" />
    </LinearLayout>
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
        <CheckBox
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Java" />
        <CheckBox
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Kotlin" />
    </LinearLayout>
</LinearLayout>

You can also set background to checkbox using

android:background="@color/colorPrimary"

or set a gradient color, first of all create a drawable file for your gradient colors than set like this way:

android:background="@drawable/gradeint"

You can also set padding and margin to make it looks better as shwon in the below screenshot:

The source code of above screenshot checkbox design is give below:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:orientation="vertical">
   <TextView
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:textStyle="bold"
       android:textColor="@color/colorPrimary"
       android:text="Which Languages you know?"/>
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
        <CheckBox
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/gradeint"
            android:textColor="@color/white"
            android:paddingLeft="10dp"
            android:paddingRight="10dp"
            android:layout_margin="10dp"
            android:text="PHP" />
        <CheckBox
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/gradeint"
            android:textColor="@color/white"
            android:paddingLeft="10dp"
            android:paddingRight="10dp"
            android:layout_margin="10dp"
            android:text="HTML" />
    </LinearLayout>
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
        <CheckBox
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/gradeint"
            android:textColor="@color/white"
            android:paddingLeft="10dp"
            android:paddingRight="10dp"
            android:layout_margin="10dp"
            android:text="Java" />
        <CheckBox
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/gradeint"
            android:textColor="@color/white"
            android:paddingLeft="10dp"
            android:paddingRight="10dp"
            android:layout_margin="10dp"
            android:text="Kotlin" />
    </LinearLayout>
</LinearLayout>

Checkbox set on Click Listener: #

If you want to set click listener to checkbox then first of all assign a id to each checkbox one by one then initialize each checkbox in your MainActivity.java file using these id like that:

Also add onclick in each of checkbox layout like that:

android:onClick="selectLanguages"

And Create a Android Button so that you can check that which checkbx is checked or not by calling or showing a tosat of selected checkbox in toast. Now final layout file will be:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:orientation="vertical">
   <TextView
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:textStyle="bold"
       android:textColor="@color/colorPrimary"
       android:text="Which Languages you know?"/>
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
        <CheckBox
            android:id="@+id/php"  // id for click listener
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/gradeint"
            android:textColor="@color/white"
            android:paddingLeft="10dp"
            android:paddingRight="10dp"
            android:layout_margin="10dp"
            android:onClick="selectLanguages"
            android:text="PHP" />
        <CheckBox
            android:id="@+id/html"  // id for click listener
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/gradeint"
            android:textColor="@color/white"
            android:paddingLeft="10dp"
            android:paddingRight="10dp"
            android:layout_margin="10dp"
            android:onClick="selectLanguages"
            android:text="HTML" />
    </LinearLayout>
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
        <CheckBox
            android:id="@+id/java" // id for click listener
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/gradeint"
            android:textColor="@color/white"
            android:paddingLeft="10dp"
            android:paddingRight="10dp"
            android:layout_margin="10dp"
            android:onClick="selectLanguages"
            android:text="Java" />
        <CheckBox
            android:id="@+id/kotlin"  // id for click listener
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/gradeint"
            android:textColor="@color/white"
            android:paddingLeft="10dp"
            android:paddingRight="10dp"
            android:layout_margin="10dp"
            android:onClick="selectLanguages"
            android:text="Kotlin" />
    </LinearLayout>
    <Button
        android:id="@+id/submitBtn"  // id for click listener when submit button pressed
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@color/colorAccent"
        android:text="Submit"
        android:textColor="@color/white"
        android:textStyle="bold"/>
</LinearLayout>

Now add the below code to MainActivity.java file:

import android.annotation.SuppressLint;
import android.app.Activity;
import android.graphics.Color;
import android.hfad.com.sudoku.R;
import android.os.Build;
import android.os.Bundle;
import android.view.Gravity;
import android.view.View;
import android.widget.Button;
import android.widget.CheckBox;
import android.widget.TextView;
import android.widget.Toast;

public class MainMenuActivity extends Activity {
    String languages = "";

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        Button submitbtn = (Button) findViewById(R.id.submitBtn);

        submitbtn.setOnClickListener(new View.OnClickListener() {
            @SuppressLint("NonConstantResourceId")
            @Override
            public void onClick(View view) {
                showToast("You have selected : "+languages);
            }
        });

    }
    @SuppressLint("NonConstantResourceId")
    public void selectLanguages(View view) {

        boolean checked = ((CheckBox) view).isChecked();
        switch (view.getId()) {
            case R.id.php:
                if (checked) {
                    languages += "\nPHP";
                } else {
                    languages = "";
                }

                    break;
            case R.id.html:
                if (checked) {
                    languages += "\nHTML";
                } else{
                    languages = "";
                }

                    break;
            case R.id.kotlin:
                if (checked) {
                    languages += "\nKotlin";
                } else{
                    languages = "";
                }

                    break;
            case R.id.java:
                if (checked) {
                    languages += "\nJava";
                } else{
                    languages = "";
                }
                    break;
        }
    }

        public void showToast (String message){
            Toast toast = Toast.makeText(this, message, Toast.LENGTH_LONG);
            View tv = toast.getView();
            tv.setPadding(20, 15, 20, 15);
            TextView toastMessage = (TextView) tv.findViewById(android.R.id.message);
            toastMessage.setTextSize(25);
            toastMessage.setTextColor(Color.WHITE);
            toastMessage.setCompoundDrawablesWithIntrinsicBounds(R.drawable.ic_play, 0, 0, 0);
            toastMessage.setGravity(Gravity.CENTER);
            toastMessage.setCompoundDrawablePadding(16);
            if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
                tv.setBackground(getDrawable(R.drawable.gradeint));
            }
            toast.show();
        }
}

Final output you can check in below screenshot: