Android RadioButton


Download android RadioButton customization & usage sample

Android RadioButton allows us to select one option from a set of options. In radio button we show mutually exclusive options that means we can't select more than 1 option at the same time.

A Radio button can be defined in xml layout as follows:

But, radio button defiend in above example is still not mutually exclusive. A user can select both male and female option at the same time.

RadioGroup

RadioGroup is used to group set of options to 1 group so that user can select only one option at a time.

In simple word, the radio buttons that we want to behave mutually exclusive way must be wraped inside a RadioGroup.

So, above example should be used as followed:

android:orientation attribute of the RadioGroup used to specify whether RadioButton will be displayed vertically or horizontally.

Text decoration in android


Android provides several text decorating attributes like Typeface, font family, text style, text size, text color, text shadow etc. that can be applied to RadioButton. To learn more on text styling visit below given link:

How to decorate text in android

Xml attributes of Android RadioButton


Here are some commonly used xml attributes which we use very frequently:

Xml attribute Description
android:background We can use this attribute to set color or drawable background
android:paddingLeft Can be used to assigned padding between radio button and text
android:onClick This is the name of the method in this View's context to invoke when the view is clicked.
android:checked If attribute has a value "true" then by default it will be displayed as checked. For "false" value it will be displayed as unchecked
android:visibility it controls the initial visibility of the view
android:drawableLeft Used to show a drawable at left side of RadioButton
android:drawableRight Used to show a drawable at right side of RadioButton
android:drawableTop Used to show a drawable at the top of RadioButton
android:drawableBottom Used to show a drawable at the bottom of RadioButton

How to check or uncheck a Radio button programatically?


Sometimes we need to check or uncheck a radio button on runtime. We can check or uncheck a radio button as follows:

Customization of Android RadioButton using button selector?


Here are simple steps to create a button selector to customize a radio button:

Step 1: Add 2 images in drawable folder, one for checked state of radio button and second one is for uncheck state of button. I used 2 images for this purpose named radiobutton_checked.png and radiobutton_unchecked.png

Step 2: Create a file under res -> drawable and named it radiobutton_selector.xml

Step 3: Replace your res ->drawable ->radiobutton_selector.xml with below given code of my radiobutton_selector.xml

Step 3: Set the android:button attribute of radio button where you want this custom look & feel as follows:

Customization of Android RadioButton using color selector?


Here are simple steps to create a color selector to customize a radio button:

Step 1: Define 2 colors that you want to use for checked and unchecked state of radio button

Step 2: Craete an xml file under res -> drawable and named it radiobutton_color_selector.xml

Step 3: Open your res -> drawable -> radiobutton_color_selector.xml and replace it's code with below given code:

Step 4: Assign android:textColor of radio button to this drawable color selector as given below:

How to handle click event of radio button?


There are 4 different way to handle click event of a view. In this example we are going to explain only one way to handle click event of radio button. To learn more, what are other ways to handle click event of a view you can visit below given link.

Android button - Customization & Usage

A simple way to handle click event of a button is to define onClick attribute of RadioButton as follows:

Now create a method named radioButtonClickHandler inside Activity class that hold the radio button layout. This method must be public, Return void and accept View as a parameter as follows:

How to get checked radio button ?


Sometimes we need to know checked radio button on some event say on a button click. Here is a simple way to get RadioButton that is checked in a RadioGroup.

Example of Android RadioButton


Let's quickly implement a sample for Android RadioButton, which demonstrate everything we discussed about Android RadioButton.

Result

Android button

Step 1: Create a new project in Android Studio and name it Android RadioButton.

Step 2: Open res -> layout -> activity_main.xml and add following code

activity_main.xml

Step 3: Open res -> drawable and place 2 different images for different states of radio button. Images of my sample is radiobutton_checked.png, radiobutton_unchecked.png

Step 4: Create res -> drawable -> radiobutton_selector.xml and add following code

radiobutton_selector.xml

Step 5: Open res -> values -> styles.xml and replace its code with below given code of styles.xml

styles.xml

Step 6: Open res -> values -> colors.xml and replace its code with below given code of colors.xml

colors.xml

Step 7: Open res -> values -> strings.xml and replace its code with below given code of strings.xml

strings.xml

Step 8: Create a file radiobutton_color_selector.xml under res -> drawable, and add below given code to your newly created file:

radiobutton_color_selector.xml

Step 9: Add below given code to your MainActivity.java

MainActivity.java

Step 10: Clean and run the project to see the result.


Share & Like

Tutorial topics

About ApnaTutorials.com

ApnaTutorials.com is for Java, J2ee, Html5 and android developers. All tutorials are well explained and are easy to understand. We have tested every tutorials on our developement environment before posting it in public domain.