RadioButton View and CheckBox View in Android

When you are creating a form to accept user inputs in your android application, and you have to list down a few options for the user to choose from, check boxes and radio boxes comes in handy.

So the functional difference between, radio box and check box is that we use radio box when out of multiple options only one can be chosen by the user, and if multiple selection is allowed then check box should be used.

CheckBox View in Android

Checkbox is used when you have to show multiple options to the user and the user is allowed to choose as many options as they want, by tapping on them. You can set its default check status as true or false and other properties are same as TextView.

<CheckBox
    android:id="@+id/myCheckbox"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Studytonight"
    android:checked="true"
    android:textColor="@android:color/black"
    android:layout_marginLeft="30dp"/>

• android:checked="true"

  This attribute checks i.e places the tick mark in the checkbox by default.

This covers how we can display a CheckBox view on the app screen. How it works is something that we will learn very soon.

Output Screen

RadioButton View in Android

RadioButton is used when you have to allow selection of only one option among the list of multiple options. It is used under its parent view – RadioGroup so that we can get one selected value out of all the listed radio buttons.

<RadioGroup
    android:id="@+id/rg_gender"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="10dp"
    android:layout_marginLeft="20dp">

    <RadioButton
        android:id="@+id/rb_male"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Male"
        android:textColor="@android:color/black"/>

    <RadioButton
        android:id="@+id/rb_female"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textColor="@android:color/black"
        android:text="Female"/>

</RadioGroup>

We can also use a Spinner View for showing a list of options out of which only one can be selected. But in a Spinner, not all the options are shown to the user at once, its more like a dropdown.

Also RadioGroup is a subclass of LinearLayout and arranges the radio button vertically because it has vertical orientation by default. But you can change that by adding the attribute android:orientation="horizontal" to your RadioGroup in the layout XML file.

Output Screen

Checking the Current state of RadioButton or CheckBox View

To check whether a radio button or a checkbox is selected or not, we can write a simple code in our Java code file.

// initiate the radio button
RadioButton maleRadioButton = (RadioButton) findViewById(R.id.rb_male); 
// check current state of the radio button (true or false)
Boolean RadioButtonState = maleRadioButton.isChecked();

The first line of the code, uses the id specified for the RadioButton View in the layout XML to create an instance of that view. This code remains same for all types of views.

Similarly, we can check the same for check box too,

// initiate the check box
CheckBox myCheckbox = (CheckBox) findViewById(R.id.myCheckbox); 
// check current state of the check box (true or false)
Boolean CheckBoxState = myCheckbox.isChecked();

Commonly used attributes

Here we have some commonly used attributes, which you can use to style your RadioButton and CheckBox view.

• android:textColor: To change the color of the text.
• android:textSize: To adjust the size of the text.
• android:textStyle: To style the text, possible values are Bold or Italic etc.
• android:background: To give a background color to your Radio button.
• We can also use an Image alongside the text in a radio button. To add an image, we can use android:drawableTop, android:drawableBottom, android:drawableRight and android:drawableLeft, to set the image at the top, bottom, right or left side of the text respectively.

  android:drawableRight="@drawable/any_picture"