Skip to main content
Give us your valuable feedback

It will help us understand how we can serve you better

Give feedback

Components

Radio Button

Buttons are used to select only one of a limited number of choices

banner-Radio Button
Component Status Details

Status component contains a list of checks and completeness that has been tested and owned by each component

check-list-icon We don't use color as the only visual tool to convey information.
check-list-icon The component’s structure and properties include relevant options such as variant, style, size, orientation, optional iconography, decorations, selection, error state, etc.check-list-icon The title is the component name that uses the frame base component template.check-list-icon The base component name contains: .Base & "Component Name" if there is more than one.check-list-icon All component properties use the Legion foundation.
check-list-icon We can change all the parts that are connected to the component base.check-list-icon The inside of the base component remains connected to the master component.check-list-icon All variant options are not damaged when we change from one to another.check-list-icon Overriding changes to components will not reset other variants.
check-list-icon Component's already has component specs documentation.

Status

Resources

Usage

Radio buttons allow the user to select one option from a dataset.



android radio button

Variant

Themes

There are 2 themes of the radio button. There are Primary and Secondary.

radio button themes

Base Components

Single radio button used for single option value.

Primary Radio Button

Example usage :

Static in xml

<com.telkom.legion.component.radio.LgnPrimaryRadioButton
android:id="@+id/rbprimary"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Radio Button Primary"
android:layout_marginHorizontal="@dimen/dimen_16dp"
android:layout_marginTop="@dimen/dimen_16dp"/>

Dynamic using Kotlin*

...
with(binding) {
rbprimary.setText("Primary Radio Button from kotlin")
rbprimary.isChecked
}
...

Secondary Radio Button

Example usage :

Static in xml

<com.telkom.legion.component.radio.LgnSecondaryRadioButton
android:id="@+id/rbsecondary"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Radio Button Secondary"
android:layout_marginHorizontal="@dimen/dimen_16dp"
android:layout_marginTop="@dimen/dimen_16dp"/>

Dynamic using Kotlin*

...
with(binding) {
rbsecondary.setText("Secondary Radio Button from kotlin")
rbsecondary.disable()
}
...

Attributes

Attribute NameXml AttrsRelated method(s)Description
Idandroid:idtextTo set id component
Textandroid:texttextTo set Text value directly via xml
Enable Statusandroid:enabledisEnableTo set enable or disable radio button value directly via xml
basic radio button

Radio Button Group

Radio button group used for show multiple option value.

Example usage :

Static in xml

<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Radio Button Example"
android:layout_marginHorizontal="@dimen/dimen_16dp"
android:layout_marginTop="@dimen/dimen_16dp"
android:textAppearance="?attr/bodyLargeMedium"/>
<TextView

Dynamic using Kotlin*

...
...
with(binding) {
rgSamplePrimary.addAll(
listOf(
"Sick",
"Not Fit",
"Healthy"
),

Attributes

Attribute NameXml AttrsRelated method(s)Description
Idandroid:idtextTo set id component
Textandroid:texttextTo set Text value directly via xml
Enable Statusandroid:enabledisEnableTo set enable or disable radio button value directly via xml
Show Dividersandroid:showDividersshowDividersTo show devider between radio button value
example radio button

Radio Button Container

Radio group container contains radio button group, hits ( label), helper , and error text.

Example usage :

Static in xml

<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Radio Button Container"
android:layout_marginHorizontal="@dimen/dimen_16dp"
android:layout_marginTop="@dimen/dimen_16dp"
android:textAppearance="?attr/bodyLargeMedium"/>
<com.telkom.legion.component.radio.LgnPrimaryRadioContainer

Dynamic using Kotlin*

...
...
with(binding) {
rcPrimary.addAll(
listOf(
"Sample 1",
"Sample 2",
"Sample 3",
"Sample 4",

Attributes

Attribute NameXml AttrsRelated method(s)Description
Helper Text in Containerapp:helperTexthelperTextTo set helper text below radio button container
Hintandroid:hinthintTo set label for radio button container
Orientationandroid:orientationorientationTo set orientation dataset for radio button container
Scroll Containerandroid:isScrollContainerisScrollContainerTo set enable or disable scroll dataset for radio button container
radio button container