Components
Radio Button
Buttons are used to select only one of a limited number of choices
Component Status Details
Status component contains a list of checks and completeness that has been tested and owned by each component
We don't use color as the only visual tool to convey information.
The component’s structure and properties include relevant options such as variant, style, size, orientation, optional iconography, decorations, selection, error state, etc. The title is the component name that uses the frame base component template. The base component name contains: .Base & "Component Name" if there is more than one. All component properties use the Legion foundation.
We can change all the parts that are connected to the component base. The inside of the base component remains connected to the master component. All variant options are not damaged when we change from one to another. Overriding changes to components will not reset other variants.
Component's already has component specs documentation.
Usage
Radio buttons allow the user to select one option from a dataset.
Variants
Single
Single radio button used for single option value.
var isSelected by remember { mutableStateOf(false) }LgnRadioButton(text = "Radio Button1",selected = isSelected,onClick = {isSelected = !isSelected})
Here is customization of LgnRadioButton parameters at the LgnRadioButton
function:
Parameter | Description | Default Value |
---|---|---|
text | The text to be displayed on the radio button. | N/A |
selected | A boolean indicating whether the radio button is selected. | N/A |
onClick | The callback that is invoked when the radio button is clicked. | N/A |
modifier | The Modifier to be applied to the radio button. | Modifier |
enabled | A boolean indicating whether the radio button is enabled. | true |
size | The size of the radio button. | LgnRadioButtonDefaults.size |
colors | The colors to be used for the radio button. | LgnRadioButtonDefaults.colors() |
interactionSource | The source of interactions for the radio button. | remember { MutableInteractionSource() } |
Group
Radio button group used for show multiple option value.
Example usage :
var selectedRbGroupValue by remember { mutableStateOf("")}LgnRadioButtonGroup(selectedValue = selectedRbGroupValue,onSelectionChange = {it -> handleOnClickRRBGroup(it)},value = listOfRadioButton,title = "Radio Button Group")
Here is customization of LgnRadioButton parameters at LgnRadioButtonGroup
function:
Parameter | Description | Default Value |
---|---|---|
selectedValue | The currently selected value in the radio button group. | N/A |
title | The title of the radio button group. | N/A |
onSelectionChange | The callback that is invoked when the selection changes in the radio button group. | N/A |
value | The set of values for the radio buttons in the group. | N/A |