Structure
OUDSRadio
Radio button is a UI element that allows to select a single option from a set of mutually exclusive choices. Radio button that does not show icon or text, provides greater flexibility when creating other components that require a Radio button to be displayed.
- iOS 15.0+
- macOS 13.0+
- tvOS 16.0+
- visionOS 1.0+
- watchOS 11.0+
@MainActor struct OUDSRadio
Mentioned In
Particular cases
An OUDSRadio can be related to an error situation, for example troubles for a formular. A dedicated look-and-feel is implemented for that if the isError flag is risen.
Accessibility considerations
Note also the component must be instanciated with a string parameter used as accessibility label. It is a good pratice (at least) to define a label for a component without text for accessibility reasons. This label will be vocalized by Voice Over. The vocalization tool will also use, after the label, a description of the component (if disabled, if error context), and a fake trait for radio. No accessibility identifier is defined in OUDS side as this value remains in the users hands.
Cases forbidden by design
The design system does not allow to have both an error or read only situation and a disabled component.
Code samples
// Supposing we have an unselected state
@Published var selection: Bool = false
// A simple radio, no error, not in read only mode
OUDSRadio(isOn: $selection, accessibilityLabel: "The cake is a lie")
// A simple radio, but is an error context
OUDSRadio(isOn: $selection, accessibilityLabel: "The cake is a lie", isError: true)
// Never disable an error-related radio button as it will crash
// This is forbidden by design!
OUDSRadio(isOn: $selection, accessibilityLabel: "The cake is a lie", isError: true).disabled(true) // fatal error
Design documentation
unified-design-system.orange.com
Themes rendering
Orange

Orange Compact

Sosh

Wireframe

Version
1.4.0 (Figma component design version)
Since
0.12.0
Topics
Initializers
Instance Properties