The Radio Button List UI element consists of a group of radio buttons, each representing a single choice, allowing users to make a selection by clicking on the radio button corresponding to their preferred option.
To configure Radio Button List:
- Select the current condition of the element from the State dropdown on the right-side Properly Panel:
- Normal: The default state of Radio Button List when it is not being interacted with.
- Hover: The state of Radio Button List when the user hovers over it with the mouse cursor.
2. Expand General:
- Indicate the gap between the radio button list options.
- Select how Radio Button List is displayed: Vertical or Horizontal.
3. Make the necessary configuration of principal styling features (see Global Styles).
4. Click the element Radio item:
- Select the current condition of the Radio item from the State dropdown on the right-side Properly Panel: Normal, Hover, Focus, Active.
- Select how it behaves based on certain conditions or user interactions from the Mode dropdown:
- Normal: The default state of the Radio item when it is not being interacted.
- Checked: The state where the Radio item is selected or "checked" by the user.
- Error: The state where there is an issue associated with the selection made by the user. This state might occur when the user's choice doesn't meet certain criteria.
- Make the necessary configuration of principal styling features (see Global Styles).
5. Click the element Label to modify the styling features and text inside the UI element (see Global Styles).
💡 If you have questions or concerns, contact us directly via the Live Chat box in the lower right corner. Our Support Team will provide you with top-notch quality support 24/7.