doc-burger

Radio Button

A component for selecting a single option from a set of mutually exclusive choices

A radio button is a user interface element that allows users to select a single option from a set of mutually exclusive choices, providing options for controlling its behavior and appearance.

radio-button

Key Features

Radio buttons offer the following key features:

  • Value: Radio buttons have a "Value" property, which is typically a boolean value that indicates whether the radio button is selected (true) or not selected (false).

  • Label: The label is the text displayed next to the radio button, providing context for the user.

  • Disabled: When switched on, the "Disabled" property makes the radio button unchangeable, preventing user interaction.

  • Styles: Customize the initial styles of the radio button to align with your application's design.

How to Use Radio Buttons

To use radio buttons in your application, follow these steps:

  1. Value: Utilize the "Value" property to set or retrieve the selected state of the radio button. A boolean value indicates whether the radio button is selected or not.

  2. Label: Add a descriptive label next to the radio button to provide context for the user.

  3. Disabled State: Use the "Disabled" property to make the radio button unchangeable when necessary.

Use Cases

Radio buttons are commonly used in various scenarios, including:

  • Single selection: Use radio buttons when you want users to select a single option from a set of mutually exclusive choices, such as gender selection.

  • Form inputs: Include radio buttons in forms when you require users to choose a single option among several available options.

Radio buttons simplify user interactions by providing an intuitive way to select a single option from a set of choices, improving the usability of your application.