Android Studio : Checkbox for user to select options example




A decent operating system user interface should have check boxes to allow users to select options that are not mutually exclusive. For this tutorial, we will learn how to create a couple of checkboxes with checkBox widget in Android Studio and create two listeners to scan if the options are toggled to checked or unchecked states. One listener is for individual check box and another is for a button to get all the checkboxes toggled states.

Below is an image of the finished application:

final image of the checkbox Android app

Let's get the layout designer in Android Studio code save in the activity_main_check_box.xml file:


 <?xml version="1.0" encoding="utf-8"?>
 <android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:app="http://schemas.android.com/apk/res-auto"
 xmlns:tools="http://schemas.android.com/tools"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 tools:context="com.example.sweetlogic.checkbox.MainActivityCheckBox">

 <CheckBox
 android:id="@+id/checkBoxDurian"
 android:layout_width="368dp"
 android:layout_height="48dp"
 android:text="Durian"
 android:visibility="visible"
 app:layout_constraintBottom_toBottomOf="parent"
 app:layout_constraintLeft_toLeftOf="parent"
 app:layout_constraintRight_toRightOf="parent"
 app:layout_constraintTop_toTopOf="parent"
 app:layout_constraintVertical_bias="0.295" />

 <CheckBox
 android:id="@+id/checkBoxRambutan"
 android:layout_width="368dp"
 android:layout_height="48dp"
 android:text="Rambutan"
 android:visibility="visible"
 app:layout_constraintBottom_toBottomOf="parent"
 app:layout_constraintLeft_toLeftOf="parent"
 app:layout_constraintRight_toRightOf="parent"
 app:layout_constraintTop_toTopOf="parent"
 app:layout_constraintVertical_bias="0.192" />

 <CheckBox
 android:id="@+id/checkBoxMango"
 android:layout_width="368dp"
 android:layout_height="48dp"
 android:text="Mango"
 android:visibility="visible"
 app:layout_constraintBottom_toBottomOf="parent"
 app:layout_constraintLeft_toLeftOf="parent"
 app:layout_constraintRight_toRightOf="parent"
 app:layout_constraintTop_toTopOf="parent"
 app:layout_constraintVertical_bias="0.088" />

 <Button
 android:id="@+id/buttonGetCheckBoxStates"
 android:layout_width="368dp"
 android:layout_height="48dp"
 android:text="Get CheckBox states"
 app:layout_constraintBottom_toBottomOf="parent"
 app:layout_constraintLeft_toLeftOf="parent"
 app:layout_constraintRight_toRightOf="parent"
 app:layout_constraintTop_toTopOf="parent"
 tools:layout_editor_absoluteX="8dp"
 tools:layout_editor_absoluteY="231dp" />

 <TextView
 android:id="@+id/textView"
 android:layout_width="368dp"
 android:layout_height="48dp"
 android:text="Fruits common in Malaysia"
 android:textColor="@android:color/background_dark"
 android:textSize="24sp"
 android:textStyle="bold"
 app:layout_constraintBottom_toBottomOf="parent"
 app:layout_constraintLeft_toLeftOf="parent"
 app:layout_constraintRight_toRightOf="parent"
 app:layout_constraintTop_toTopOf="parent"
 app:layout_constraintVertical_bias="0.004" />
 </android.support.constraint.ConstraintLayout>

XML codes for the layout designer


and fill in the Java codes at MainActivityCheckBox.java with:


 package com.example.sweetlogic.checkbox;

 import android.support.v7.app.AppCompatActivity;
 import android.os.Bundle;
 import android.view.View;
 import android.widget.Button;
 import android.widget.CheckBox;
 import android.widget.Toast;

 public class MainActivityCheckBox extends AppCompatActivity {

 @Override
 protected void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.activity_main_check_box);

 // get all the checkboxes states
 addListenerOnButton();
 // listen to individual check box
 addListenerOnDurianCheckBox();
 }

 public void addListenerOnDurianCheckBox() {
 final CheckBox durianCheckBox = (CheckBox) findViewById(R.id.checkBoxDurian);

 durianCheckBox.setOnClickListener(new View.OnClickListener() {
 @Override
 public void onClick(View view) {
 //user touch the durian?
 if (durianCheckBox.isChecked()) {
 Toast.makeText(MainActivityCheckBox.this, "I'm very thorny! Don't touch!", Toast.LENGTH_LONG).show();
 }
 }
 });
 }

 public void addListenerOnButton() {

 final CheckBox durianCheckBox = (CheckBox)  findViewById(R.id.checkBoxDurian);
 final CheckBox rambutanCheckBox = (CheckBox)  findViewById(R.id.checkBoxRambutan);
 final CheckBox mangoCheckBox = (CheckBox)  findViewById(R.id.checkBoxMango);
 Button button = (Button) findViewById(R.id.buttonGetCheckBoxStates);

 button.setOnClickListener(new View.OnClickListener() {

 @Override
 public void onClick(View arg0) {

 StringBuilder states = new StringBuilder();
 states.append("Mango [").append(mangoCheckBox.isChecked()).append("]\n");
 states.append("Rambutan [").append(rambutanCheckBox.isChecked()).append("]\n");
 states.append("Durian [").append(durianCheckBox.isChecked()).append("]\n");


 Toast.makeText(MainActivityCheckBox.this, states.toString(), Toast.LENGTH_LONG).show();
 }

 });
 }
 }

Save all the files and hit the Run button and you should be able to see the application running on your selected Android Virtual Device. Here is an image of the application for the checkboxes running in the emulator.

checkbox app running in Android Virtual Device

Happy Android-ing!

References:

https://developer.android.com/guide/topics/ui/controls/checkbox.html

https://developer.android.com/reference/android/widget/CheckBox.html

https://socketloop.com/tutorials/android-studio-alertdialog-to-get-user-attention-example

  See also : Android Studio : Image button and button example





By Adam Ng

IF you gain some knowledge or the information here solved your programming problem. Please consider donating to the less fortunate or some charities that you like. Apart from donation, planting trees, volunteering or reducing your carbon footprint will be great too.


Advertisement