If a screen shows more than one interactive item in the same location, it can be difficult for a user to interact with the app. It also becomes difficult for some accessibility services, such as Switch Access, to clearly represent the actionable items to the user.
Implementation
ViewWhen you implement OnClickListeners and OnLongClickListeners, check if the clickable View has an ancestor or descendant that's clickable and shares the same on-screen location. In a well-implemented user interface, clickable items appear separately.
Consider the following when implementing clickable Views:
- Certain
Viewtypes, likeButton, are denoted as clickable by default. In your app, if theViewis not clickable, or does not perform an action when clicked, remove itsOnClickListeneror setandroid:clickable="false". In this way, you tell accessibility services to consider theViewnot clickable. - In more complex user interfaces, multiple clickable
Viewsmay have parent/child relationships in the view hierarchy. In cases of nested clickableViews, implement click handling so that only oneViewhandles clicks for any single action.
When you implement the onClick or onLongClick properties of Modifier.clickable or Modifier.combinedClickable, check if the composable has an ancestor or descendant that's clickable and shares the same on-screen location. In a well-implemented user interface, clickable items appear separately.
- Certain low-level composables, like
Button, have clickable semantics by default. In your app, if the composable isn’t clickable, or doesn’t perform an action when clicked, remove its clickable semantics withModifier.clearAndSetSemantics. - In more complex user interfaces, multiple clickable composables may have parent or child relationships in the view hierarchy.
- In cases of nested clickable composables, implement click handling so that only one composable in a parent or child relationship handles clicks for any single action.
Design
The purpose of each clickable item should be clear, and a user should be able to reasonably anticipate the action that will be performed by clicking or long-clicking an item. These actionable items should also be of an appropriate size for touch targets.
Testing
To manually verify that an app's user interface doesn't contain duplicate clickable items:
- Turn on Switch Access for Android and set up two-switch step scanning.
- Open the app.
- Use the switch assigned to the “Next” action to move switch access focus item-by-item through the interface.
- If any item appears to be focused more than once, the interface may contain duplicate clickable items.
Android's automated testing tools can detect duplicate clickable Views. Consider using Accessibility Scanner for Android for manual testing of your app on-device. For automated tests, turn on accessibility checking in Espresso and Robolectric.