Skip to main content Skip to site Map

iOS Segmented control

How to test a segmented control

Gherkin Condensed

Given that I am on a screen with a segmented control

1 Keyboard

WHEN I use the arrow keys or ctrl + tab to move focus to a segmented control I SEE focus is visually indicated (strongly if high contrast enabled)
Then when I use the arrow keys I SEE the focus moves through the buttons
Then when I use the spacebar I SEE the selection changes

2 VoiceOver screenreader

WHEN I use a screenreader AND I swipe to focus on a segmented control
- I HEAR purpose is clear and matches visible label
- I HEAR identifies as a button
- I HEAR visible label (if any) is grouped or associated with the button in a single swipe
- I HEAR expresses its state (selected/disabled/dimmed)
Then when I doubletap with a button in focus I HEAR the selection is changed

3 Device settings

When I use Text resize I SEE this element is exempt from text resizing requirements
When I use Increase contrast I SEE focus outline becomes high contrast

1 Keyboard actions

When I use	I see/hear
Ctrl + tab	Focus visibly moves to the button
Arrow keys	Navigate through group
Spacebar	Activates the button

2 Mobile screenreader gestures

When I use	I hear
Swipe	Focus moves to the element, expresses its state, if applicable
Doubletap	Activates the button

3 Screenreader output

Reads	I hear
Name	Purpose is clear and matches visible label
Role	Identifies as a button
Group	Visible label (if any) is grouped or associated with the button in a single swipe
State	Expresses its state (selected/disabled/dimmed)

4 Device settings

When I use	I see
Text resize	This element is exempt from text resizing requirements
Increase contrast	Focus outline becomes high contrast

What is it?

A segmented control is a linear set of two or more segments, each of which functions as a button.
Use a segmented control to provide closely related choices that affect an object, state, or view.

What it’s not

A segmented control is not radio buttons or tabs, though it may act similarly

HIG

Apple HIG overview

How it is used

Single choice: Select only one option, like left, center or right aligned text
Multiple choice: Select multiple options, like bold, italic and underlined text
Switch between views: Change views within a current screen, like seeing all or just recent missed calls