Day 7

Multilingual labels with speech attributes

25 May 2022

With attributed accessibility labels, your app could now, for example, greet your users in different languages. Note that it will change to the voice of the corresponding language you are switching to.

Two examples of a fictional app to teach you new languages. It is showing the user how to greet in the morning in two different languages: “Buenos días” in Spanish and “Buongiorno” in Italian. In code, it sets an accessibilityAttributeLabel to the view with the string and a dictionary containing the accessibilitySpeechLanguage attribute key and the “es-Es” value for Spanish or the “it-IT” value for Italian. The label ends up with the text “Means: good morning”. The language is only applied to the first bit that is not in English.

Example code in the image:

let greetingLessonView = UIView()
let bcp47LanguageCode = "es-Es"
let translatedPhrase = "¡Buenos días! "

let attributedLabel = NSMutableAttributedString(string: translatedPhrase,attributes: [.accessibilitySpeechLanguage: bcp47LanguageCode])

attributedLabel.append(NSAttributedString(string: "Means: good morning!"))

greetingLessonView.accessibilityAttributedLabel = attributedLabel

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

Buttons with a title, use it as its default accessibility label. Most cases, that's just perfect. But there's a few times that you might want to tweak it. Maybe the image is part of what the button does, or the text in the title is not very clear.

Sometimes, buttons change meaning, for example when toggled. An example is a play button, tap it and it becomes a pause button. In such case, updating its accessibility label will be clearer than trying to convey the change with traits or values.

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". Example code in the image: ```swift 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!) ```


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