Intro
A switch form cell is used to toggle two mutually exclusive states: on and off.
It is used to control the availability of related UI elements on the current screen and should always be used in a table cell.
Switch control toggled off (left) and on (right)
Behavior and Interaction
To change the state of a switch form cell, a user can tap on the toggle button.
Variations
Switch States
A switch form cell in a disabled or read-only state is non-interactive.
A read-only switch form cell uses a text label in place of the visual switch, which should be contextually customized to the scenario. Consider using the optional helper text to indicate that it is a read-only field or to provide additional contextual information.
Switch states (top to bottom): disabled, read-only, read-only with helper text
Switch with Further Selection
Avoid adding text to describe the value of a switch form cell. If the switch form cell requires further definition, add a cell row through which a user can drill down for additional information. For example, the additional cell row may be a date picker or a list picker.
Switch with further selection (date picker)