RadioButton Example

Radio buttons allow the user to select one option from a set. You should use radio buttons for optional sets that are mutually exclusive.

Now we will create an app which displays a question in a TextView and four answer options in four different RadioButton in a RadioGroup. When user selects one of the options and clicks a button, the app tells if the answer is correct or not.

Step 1: Create a new project with name radiogroup and package name com.myexample.radio. Select File -> New -> New Project. Fill the forms and click “Finish” button.

Step 2: Open res -> layout -> xml (or) main.xml and add the code given below. Here we will create a TextView to display question, 4 RadioButtons in a RadioGroup to display options, a Button, and another TextView to display result, in a LinearLayout.

<LinearLayout
	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"
	android:orientation="vertical">
	<LinearLayout
		android:id="@+id/linear1"
		android:layout_width="match_parent"
		android:layout_height="match_parent"
		android:padding="8dp"
		android:background="#FFFFFF"
		android:orientation="vertical">
		<TextView
			android:id="@+id/textview1"
			android:layout_width="wrap_content"
			android:layout_height="wrap_content"
			android:padding="8dp"
			android:text="Which is the nearest star to planet Earth\?"
			android:textSize="25sp"
			android:textColor="#E91E63"/>
		<RadioGroup
			android:id="@+id/radioGroup"
			android:layout_width="wrap_content"
			android:layout_height="wrap_content"
			android:layout_centerVertical="true"
			android:layout_centerHorizontal="true">

			<RadioButton
				android:id="@+id/radioButton1"
				android:layout_width="wrap_content"
				android:layout_height="wrap_content"
				android:text="Moon"/>

			<RadioButton
				android:id="@+id/radioButton2"
				android:layout_width="wrap_content"
				android:layout_height="wrap_content"
				android:text="Mars"/>

			<RadioButton
				android:id="@+id/radioButton3"
				android:layout_width="wrap_content"
				android:layout_height="wrap_content"
				android:text="Sun"/>

			<RadioButton
				android:id="@+id/radioButton4"
				android:layout_width="wrap_content"
				android:layout_height="wrap_content"
				android:text="Orion"/>

		</RadioGroup>
		<Button
			android:id="@+id/button1"
			android:layout_width="wrap_content"
			android:layout_height="wrap_content"
			android:padding="8dp"
			android:background="#03A9F4"
			android:text="Submit"
			android:textSize="20sp"
			android:textColor="#FFFFFF"/>
		<TextView
			android:id="@+id/textview2"
			android:layout_width="wrap_content"
			android:layout_height="wrap_content"
			android:padding="8dp"
			android:textSize="18sp"
			android:textColor="#000000"/>
	</LinearLayout>
</LinearLayout>

Step 3: Open app -> java -> package and open MainActivity.java. Add following code in it. Here when a RadioButton is selected, we will set a String variable to a text which is to be displayed in that case and when the Button is clicked, we will display the String.

package com.myexample.radio;

import android.graphics.Color; 
import android.app.Activity;
import android.os.Bundle; 
import android.widget.RadioGroup; 
import android.widget.TextView;
import android.view.View;
import android.widget.Button;
	 
public class MainActivity extends Activity {
	
	// Declare the RadioGroup
	RadioGroup radioGroup;
	TextView textview2;
	Button button1;
	String answer;
		 
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.main);
		
		// Find RadioGroup from it's id
		radioGroup = (RadioGroup) findViewById(R.id.radioGroup);
		textview2 = (TextView) findViewById(R.id.textview2);
		button1 = (Button) findViewById(R.id.button1);
		
		// Set onCheckedChangedListener for the RadioGroup
		radioGroup.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
			@Override
			public void onCheckedChanged(RadioGroup group, int checkedId) {
				// Create a switch with id of checked RadioButton as case
				switch(checkedId){
					// When any of the RadioButton is checked
					// set the String answer to the text you want to display
					// when that RadioButton is checked.
					case R.id.radioButton1:
						answer = "Sorry! Your answer is incorrect.";
					break; 
								 
				    case R.id.radioButton2:
						answer = "Sorry! incorrect answer.";
					break;
					
					case R.id.radioButton3:
						answer = "Correct! Sun is the nearest star to Earth.";
						break;
						 
					case R.id.radioButton4:
						answer = "Incorrect answer. Try again.";
					break;
				} 
			} 
		});
		
		button1.setOnClickListener(new View.OnClickListener(){
			@Override
			public void onClick(View v){
				// On Button Click display the String answer in TextView
				textview2.setText(answer);
			}
		});
	} 
		 
}

Output:

Now run the app. You will see the app display a question and four options in four different RadioButtons. When you select one of the options and click the button, the app displays whether you selected the correct answer or not.

Leave a Reply