How to Add Radio Buttons in an Android Application?
Android radio button is a widget that can have more than one option to choose from. The user can choose only one option at a time. Each option here refers to a radio button and all the options for the topic are together referred to as Radio Group. Hence, Radio Buttons are used inside a RadioGroup.
For Example:
This image shows 4 options of the subjects for a question. In this, each mentioned subject is a Radio Button and all the 4 subjects together are enclosed in a Radio Group.
How to Create an Android App to Use Radio Buttons?
This example will help in developing an Android App that creates Radio Buttons according to the above example:
Step 1: First create a new Android Application. This will create an XML file "activity_main.xml" and a Java File "MainActivity.Java". Please refer the pre-requisites to learn more about this step.
Step 2: Open the "activity_main.xml" file and add the following widgets in aRelative Layout:
- A TextView to display the question message
- A RadioGroup to hold the option Radio Buttons which are the possible answers
- 4 RadioButtons to hold an answer each.
- A Submit and a Clear button to store the response.
Also, Assign the ID to each of the components along with other attributes as shown in the given image and the code below. The assigned ID on a component helps that component to be easily found and used in the Java files.
Syntax:
android:id="@+id/id_name"
Here the given IDs are as follows:
- RadioGroup: groupradio
- RadioButton1: radia_id1
- RadioButton2: radia_id2
- RadioButton3: radia_id3
- RadioButton4: radia_id4
- Submit Button: submit
- Clear Button: clear
activity_main.xml: (Using Constraint Layout)
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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=".MainActivity">
<TextView
android:id="@+id/text_view1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Select your Subject ?"
android:textSize="20sp"
android:textStyle="bold"
android:layout_marginTop="40sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"/>
<RadioGroup
android:id="@+id/groupradio"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
android:orientation="vertical"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/text_view1">
<RadioButton
android:id="@+id/radia_id1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="DBMS"
android:textSize="20sp" />
<RadioButton
android:id="@+id/radia_id2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="C/C++ Programming"
android:textSize="20sp" />
<RadioButton
android:id="@+id/radia_id3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Data Structure"
android:textSize="20sp" />
<RadioButton
android:id="@+id/radia_id4"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Algorithms"
android:textSize="20sp" />
</RadioGroup>
<Button
android:id="@+id/submit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="32dp"
android:text="Submit"
android:textSize="20sp"
android:textStyle="bold"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="@+id/clear"
app:layout_constraintTop_toBottomOf="@+id/groupradio" />
<Button
android:id="@+id/clear"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="32dp"
android:text="Clear"
android:textSize="20sp"
android:textStyle="bold"
app:layout_constraintEnd_toStartOf="@+id/submit"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/groupradio" />
</androidx.constraintlayout.widget.ConstraintLayout>
Layout:
Step 3: Now, after the UI, this step will create the Backend of Application.
For this, open the "MainActivity.java" file and instantiate the components made in the XML file (RadioGroup, TextView, Clear, and Submit Button) using findViewById() method. This method binds the created object to the UI Components with the help of the assigned ID.
Syntax: General
ComponentType object = (ComponentType)findViewById(R.id.IdOfTheComponent);
Syntax: Components used
Button submit = findViewById(R.id.submit);
Button clear = findViewById(R.id.clear);
RadioGroup radioGroup = findViewById(R.id.groupradio);
Step 4: This step involves setting up the operations on the RadioGroup, RadioButtons, and the Submit and Clear Buttons. These operations are as follows:
- Unset all the Radio Buttons initially as the default value. This is done by the following command:
radioGroup.clearCheck();
- Add the Listener on the RadioGroup. This will help to know whenever the user clicks on any Radio Button, and the further operation will be performed. The listener can be added as follows:
radioGroup.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener(){}
- Define the operations to be done when a radio button is clicked. This involves getting the specific radio button that has been clicked, using its id. Then this radio button gets set and the rest of the radio button is reset.
- Add the listener on Submit button and clear button. This will be used to check when the user clicks on the button. This is done as follows:
submit.setOnClickListener(new View.OnClickListener() {}
clear.setOnClickListener(new View.OnClickListener() {}
- In the Submit Button Listener, set the operations to be performed. This involves displaying the marked answer in the form of Toast.
- In the Clear Button Listener, set the operations to be performed. This involves resetting all the radio buttons.
MainActivity.Java:
package com.gfg.radio_buttons;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.RadioButton;
import android.widget.RadioGroup;
import android.widget.Toast;
import androidx.appcompat.app.AppCompatActivity;
public class MainActivity extends AppCompatActivity {
// Define the object for Radio Group,
// Submit andClear buttons
private RadioGroup radioGroup;
Button submit, clear;
@Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
submit = findViewById(R.id.submit);
clear = findViewById(R.id.clear);
radioGroup = findViewById(R.id.groupradio);
// Uncheck or reset theradio buttons initially
radioGroup.clearCheck();
// Add the Listener to the RadioGroup
radioGroup.setOnCheckedChangeListener(
(group, checkedId) -> {
// Get the selected Radio Button
RadioButton radioButton = group.findViewById(checkedId);
// You can add logic here to handle the selected radio button
});
submit.setOnClickListener(v -> {
int selectedId = radioGroup.getCheckedRadioButtonId();
if (selectedId == -1) {
Toast.makeText(MainActivity.this, "No answer has been selected",
Toast.LENGTH_SHORT).show();
} else {
RadioButton radioButton = findViewById(selectedId);
// Now display the value of selected item
// by the Toast message
Toast.makeText(MainActivity.this, radioButton.getText(),
Toast.LENGTH_SHORT).show();
}
});
// Add the Listener to the Submit Button
clear.setOnClickListener(v -> {
radioGroup.clearCheck();
});
}
}
Output:
Step 5: Now run the app and operate as follows:
- When the app is opened, it displays a question with 4 answers and a clear and submit button.
- When any answer is clicked, that radio button gets set.
- Clicking on any other radio button sets that one and resets the others.
- Clicking on Submit button displays the currently marked answer as a Toast.
- Clicking on Clear button resets all the radio buttons to their default state.