Day 56

Override labels for NSTextAttachment icons

13 Jul 2022

It is possible to embed icons within text using NSTextAttachment and NSAttributedString. If you do, please remember to override the accessibility label, otherwise VoiceOver will announce it as "Attachment.png File".

If you assign an attributed string to the attributed text property in a label, and the attributed string contains an nstextattachment that is an image, you need to override the accessibility label of the label. In the example, if you don't do it, VoiceOver would say:

Example code in the image:

let magnifyingGlassIcon = UIImage(systemName: "magnifyingglass")!
let searchButton = UIButton()
let searchTutorialLabel = UILabel()
searchButton.accessibilityLabel = "search"

let textAttachment = NSTextAttachment(image: magnifyingGlassIcon)
let string = "Select the  button to find elements in the list"
let attributedString = NSMutableAttributedString(string: string)
let attributedStringIcon = NSAttributedString(attachment: textAttachment)
let iconPlaceholderRange = attributedString.string.range(of: "")!
let iconRange = NSRange(iconPlaceholderRange, in: attributedString.string)

attributedString.replaceCharacters(in: iconRange, with: attributedStringIcon)
searchTutorialLabel.attributedText = attributedString


searchTutorialLabel.accessibilityLabel = string.replacingCharacters(in: iconPlaceholderRange,
                                                                    with: searchButton.accessibilityLabel!)

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...

Day 13

Speak punctuation with accessibilitySpeechPunctuation

With the attribute accessibilitySpeechPunctuation, you can ask VoiceOver to speak any punctuation marks in your attributed accessibility label, if that is what you want. Good for code snippets?

Day 59

Please don't use accessibility labels as UI test IDs

Please, don't use accessibility labels as ids for your UI tests. It can completely ruin the experience for VoiceOver users. There is actually an accessibility identifier property that you can use instead to uniquely identify your UI elements.

VoiceOver accessibility identifier accessibilityIdentifier accessibilityLabel iOS

Day 43

image trait unlocks Image Explorer

Images that convey important information should have the .image accessibility trait and provide an alternative text in the accessibility label. "Image" will be added to VoiceOver's utterance and the user will be able to use Image Explorer. Image Explorer is fairly new, introduced just a couple years ago. But if you were appropriately configuring the image trait, users suddenly got this new functionality for free. Isn't that awesome? With VoiceOver on, open Image Explorer by swiping up in an image and double tapping. It lets users find people (with a basic description and positioning in the photo), objects or text in images, using on-device intelligence. It is very cool!

VoiceOver accessibilityLabel iOS

← Day 57

Day 55 →