Skip to content

Radio

Radio is one option in a group where the user can choose only one. Most of the time you should use RadioGroup, which looks after the group for you.

Usage

Call Components.Radio with a scope and a table of properties:

local choice = scope:Value("a")

C.Radio(scope, {
    Label = "Option A",
    Checked = scope:Computed(function(use)
        return use(choice) == "a"
    end),
    OnActivated = function()
        choice:set("a")
    end,
})

Properties

Name Type Required Default Description
Theme ThemeRef ❌ The contextual theme Theme to use for this component instead of the one from Theme.Provide.
LayoutOrder UsedAs<number> ❌ 0 Position in a parent UIListLayout or UIGridLayout.
Size UsedAs<UDim2> ❌ - Size of the component.
Checked UsedAs<boolean> ✅ - Whether the option is chosen. It follows the state you pass.
Label UsedAs<string> ❌ - Text next to the button.
Disabled UsedAs<boolean> ❌ false Stops the button reacting to input. The component reads this once, when it creates the button.

Callbacks

Name Description
OnActivated: () -> () Runs when the user presses the button. The component does not choose itself, so update the state you pass to Checked.

See also