Radio

This component is basically a radio component as you might know it from other frameworks.

Examples

Basic selected radio

The radio component uses the value and groupValue properties to know whether it should be checked or not. The value property holds the value of the radio component and the groupValue property holds the current selected radio value for a group of radios.

{
    "type": "radio",
    "value": "a",
    "groupValue": "a",
}

Group of radios

To group many radio, you just set the same groupValue like in this example :

{
    "type": "flex",
    "children": [
        {
            "type": "radio",
            // This radio will be selected because the groupValue matches the value
            "value": "a",
            "groupValue": "a",
        },
        {
            "type": "radio",
            // This radio will not be selected because the groupValue does not match the value
            "value": "b",
            "groupValue": "a",
        },
    ]
}

Properties

Attribute	Description	Type
_type	The type of the element	radio
groupValue	The value group of the radio	string
value	The value of the radio	string
autofocus	Whether the radio will be selected initially.	boolean
materialTapTargetSize	Configures the minimum size of the tap target.	string shrinkWrap padded
name	The name that will be used in the form.	string
onPressed		Listener
style	Element of type RadioStyle	Radio Style
toggleable	Whether the radio is allowed to go from checked to unchecked when clicking on it.	boolean