Day 62

isAccessibilityElement hides child elements

19 Jul 2022

When setting isAccessibilityElement to true, assistive tech like VoiceOver will stop looking for other accessible elements in that view hierarchy. So if we make a view accessible, its subviews, including buttons and labels won't be accessible.

A tweet is composed by several UIKit elements: A UIImage for the profile picture; maybe 3 UILabels for name, username and date; a UIButton for more options; probably a UITextView for the text of the tweet; 4 more UIButtons for comments, retweets, likes and share, etc. Just with this elements (because all of them have the isAccessibilityElement configured to true by default), VoiceOver would focus in 9 or so UI elements. If we configure isAccessibilityElement to true for the container view, VoiceOver will see the whole thing as a single accessibility element, and everything else inside the view, will be ignored.

Some of you have asked me how you can support what I do. This would really help, and would be hugely appreciated:

  • Find these posts useful? Share them at work, on social media, or with anyone that might find them interesting. Let's spread the word!

  • Check out any of my apps or games: Xarra!, RetroRapid!, or Mestre!.

    • A download and a review go a long way. They're free by default. On the App Store, ratings and reviews really help more people discover them.

    • Finding any of them useful? If so, and if you can afford it, purchasing lifetime access to all features or subscribing lets me buy the coffee that keeps me caffeinated. Caffeine keeps me going to maintain the apps, bring in new features that I hope you'll love, and keep writing.

You may also find interesting...

If you need for a view (and all its subviews) not to be focusable by assistive tech like VoiceOver, you can set its accessibilityElementsHidden property to true. This isn't needed very often, but it can be useful for certain custom experiences.

If an image does not convey additional information, maybe it's just used to make the UI look more attractive, it makes sense for VoiceOver to skip it. UIKit: set isAccessibilityElement to false. SwiftUI: create a decorative image explicitly.

What is the difference between isAccessibilityElement and accessibilityElementsHidden? The first one makes the view not accessible, but its subviews can still be accessible. The second one hides the view and all its subviews from assistive tech.


Content © Daniel Devesa Derksen-Staats on Accessibility up to 11! is licensed under CC BY 4.0. License details