Segmented control
Segmented control is used to pick one choice from a linear set of closely related choices, and immediately apply that selection.
On this page
Description
Use a segmented control to let users select an option from a short list and immediately apply the selection
Accessibility
A SegmentedControl should not be used in a form as a replacement for something like a radio group or select.
See the Accessibility section of the SegmentedControl interface guidelines for more details.
Arguments
| Name | Type | Default | Description |
|---|---|---|---|
hide_labels | Boolean |
| Whether to hide the labels and only show the icons |
full_width | Boolean |
| If the component should be full width |
size | Symbol |
| One of |
system_arguments | Hash | N/A |
Examples
Slots
items
Use to render an item in the segmented control
| Name | Type | Default | Description |
|---|---|---|---|
system_arguments | Hash | N/A |
SegmentedControl::Item
SegmentedControl::Item is a private component that is only used by SegmentedControl It wraps the Button and IconButton components to provide the correct styles
Arguments
| Name | Type | Default | Description |
|---|---|---|---|
label | String | N/A | The label to use |
selected | Boolean |
| Whether the item is selected |
icon | Symbol |
| The icon to use |
hide_labels | Symbol |
| Whether to only show the icon |
Slots
trailing_visual_label
Optional trailing Label
| Name | Type | Default | Description |
|---|---|---|---|
system_arguments | Hash | N/A | The arguments accepted by Button's |
Methods
with_trailing_visual_label(system_arguments: Hash)
Optional trailing label.
Parameters
| Name | Type | Default | Description |
|---|---|---|---|
system_arguments | Hash | N/A | The arguments accepted by Button's |