Try to make the composables in your app more accessible. The following steps can improve your composable's accessibility:
- Describe your composable
- Add interactions
- Handle complex UIs
Describe your composable
To describe a composable, declare its semantic properties (such as its role,
label, state, or actions) using Modifier.semantics. Accessibility
services can read these semantic properties and use the information to interact
with and announce the UI.
The Role property is especially important because it provides the necessary
context for accessibility services to announce a component's purpose and
expected interactions. For example, consider a custom icon that behaves like a
clickable button. By setting its role to Role.button, you can make sure that
screen readers announce it as an interactive element, not a static image.
For more information, see Semantics.
Add interactions
To add interactions to your composable, use the clickable or
toggleable modifiers. These modifiers come with built-in semantic
properties that accessibility services can read. To make complex touchscreen
gestures more accessible, use CustomAccessibilityAction.
For more information, see Custom actions.
Handle complex UIs
Although Compose supports many accessibility features by default, a more complex UI might require more customized behavior. You can make complex UIs more accessible by logically structuring the UI hierarchy and providing a logical reading order for accessibility services to traverse.
Structure the UI hierarchy logically: If a parent composable consists of multiple child elements, you can explicitly specify how those elements are grouped or override them entirely. For more information, see Merging and clearing.
Control the traversal order: If Compose's default reading order is insufficient, you can manually control how screen readers navigate your UI elements. For more information, see Modify traversal order.
Control focus: For keyboard and D-pad navigation, you can manually override the focus traversal order. For more information, see Change focus behavior and Change focus traversal order.
Additional resources
For more information about making your UI accessible, see the following additional resources: