Lenra Docs
Register on Lenra
  • Home
  • Getting started
    Open/Close
  • Guides
    Open/Close
  • Features
    Open/Close
  • References
    Open/Close
  • Contribute

    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

    AttributeDescriptionType
    _typeThe type of the element
    • radio
    groupValueThe value group of the radiostring
    valueThe value of the radiostring
    autofocusWhether the radio will be selected initially.boolean
    materialTapTargetSizeConfigures the minimum size of the tap target.string
    • shrinkWrap
    • padded
    nameThe name that will be used in the form.string
    onPressedListener
    styleElement of type RadioStyleRadio Style
    toggleableWhether the radio is allowed to go from checked to unchecked when clicking on it.boolean