Accessibility框架详细解析(三) —— Supporting VoiceOver in Your App(一)

版本记录

版本号 时间
V1.0 2022.08.16 星期二

前言

AccessibilityiOS 14.0 +开始支持的一个全新的框架,它让所有使用 Apple 设备的人都能访问您的应用程序,不管您的App是使用的是UIKit还是AppKit。感兴趣的可以看下面几篇文章。
1. Accessibility框架详细解析(一) —— 基本概览(一)
2. Accessibility框架详细解析(二) —— Accessibility for UIKit(一)

Overview

添加 VoiceOver 支持,让盲人或视力不佳的用户更容易访问您的 iOS 应用程序。

VoiceOver 是一种基于手势的屏幕阅读器,使人们无需查看屏幕即可体验其设备上的界面。 盲人在使用 iOS 设备时依靠 VoiceOver 提供听觉反馈,但 VoiceOver 并非专为盲人或视力低下的用户提供。 例如,容易晕车的人可能会选择在行驶的车辆中打开 VoiceOverVoiceOver 可为所有类型的人提供帮助,但盲人在使用设备时依赖 VoiceOver

只需几个步骤,您就可以让您的应用 VoiceOver 可在 Xcode 中或以编程方式访问。 通过增加可访问性,您可以向更广泛的受众开放您的应用程序,并使每个人都更容易使用。


Audit Your App with VoiceOver On

要测试您的应用程序的可访问性,请打开 VoiceOver 并在界面中导航。 通过打开 VoiceOver 使用您的应用程序,您可以建立其可访问性的基线。 要开始auditing,请选择Settings > Accessibility > VoiceOver,然后启用VoiceOver。 然后,在您想要测试 VoiceOver时打开您的应用并使用指定的操作。

Auditing会显示 VoiceOver 可以访问哪些元素,哪些元素不能访问,并显示 VoiceOver 导航是否清晰且合乎逻辑。 跟踪哪些元素不可访问,并创建改进列表以添加更好的VoiceOver支持。


Navigate with VoiceOver On

要在 VoiceOver 开启的情况下audit您的应用程序,您可以使用 VoiceOver 的一组独特手势来导航您的应用程序。 对于测试,您可以使用五个关键手势:

  • 向左或向右滑动以导航到下一个或上一个 UI 元素。
  • 单指双击以激活所选元素。
  • 两指轻按可停止并继续讲话。
  • 用两根手指向上滑动即可阅读屏幕上的所有内容。
  • 三指连按三次以打开和关闭Screen Curtain

要了解更多信息,请参阅 iPhone User Guide中的Learn VoiceOver gestures on iPhone

要复制完全依赖 VoiceOver 的用户的体验,请使用 Screen Curtain 测试您的应用程序。 顾名思义,Screen Curtain 使整个屏幕变黑。 您仍然可以使用 VoiceOver 手势进行导航,但看不到屏幕上的元素。


Identify Common Accessibility Issues

audit您的应用程序,请检查您是否可以访问每个元素以及这些元素的顺序是否符合您的预期。记下 VoiceOver 可以访问或不能访问的元素。此外,当您发现难以执行任务时要注意,因为您认为它依赖于视觉效果。例如,当您导航回应用程序的初始视图,或与其他应用程序或用户共享内容时,如何使用 VoiceOver 使其可访问?在auditing您的应用程序时,需要寻找以下一些常见问题:

  • Add accessibility information for your app's elementsVoiceOver 默认不识别自定义 UI 元素。您需要向这些元素添加额外的可访问性信息。
  • Group elements so that VoiceOver navigates through them in the correct orderVoiceOver 从前端读取到后端。如果您希望 VoiceOver 以不同的顺序阅读您的元素,请使用组来促进对您的应用有意义的导航。
  • Include descriptive text for VoiceOver to read。依赖视觉提示的 UI 可能看起来不错,但对于 VoiceOver 用户来说可能无法使用。例如,当用户选择确认按钮时,VoiceOver 不会检测到它是否从灰色变为绿色。 VoiceOver 可能只描述元素而不是它的当前状态。确保 VoiceOver 说明按钮是否处于选中状态。

当您知道哪些方面需要改进时,开始为您的应用添加更强大的 VoiceOver 支持。


Update Your App’s Accessibility

对于 VoiceOver 无法访问的元素,首先要改进其可访问性标签和提示。当用户选择一个元素时,accessibilityLabel 属性提供了 VoiceOver 读取的描述性文本,accessibilityHint 属性为所选元素提供了额外的上下文(或操作)。

辅助功能标签(Accessibility labels)非常重要,因为它们提供 VoiceOver 读取的文本。一个好的可访问性标签简短且内容丰富。重要的是要注意 UILabelaccessibilityLabel 是不同的东西。默认情况下,VoiceOver 会读取标准 UIKit 控件的文本,例如 UILabelUIButton。但是,这些控件也可以具有相应的 accessibilityLabel 属性,以添加有关标签或按钮的更多详细信息。

根据上下文,提示并不总是必要的。在某些情况下,标签提供了足够的上下文。如果您觉得自己在accessibility label中说得太多,请考虑将该文本移至提示中。

为确保用户理解您界面的意图,您可能需要手动设置一些可访问性标签。您可以在 Xcode 的Identity inspector中或以编程方式设置可访问性标签和提示。


Add Accessibility Labels and Hints Using the Identity Inspector

使用标准 UIKit 控件时,使用Identity inspectorAccessibility窗格在 Xcode 中分配辅助功能标签和提示。 为了提高accessibility,您可以通过选择 Accessibility Enabled 选项使元素可访问。 例如,音乐应用中的播放按钮可能包含以下标签和提示:


Add Accessibility Labels and Hints Programmatically

有时在 Xcode 中添加辅助功能标签和提示是不够的,例如当您使用 VoiceOver 无法自动识别的自定义 UI 元素时,或者如果您将变量用作accessibility标签的一部分。 在这些情况下,您需要以编程方式设置accessibility标签或提示。 您指定一个元素是可访问性元素,然后创建相应的可访问性标签和提示。
要让 VoiceOver 以编程方式访问您的元素,请将其定义为可访问性元素。

score.isAccessibilityElement = true

一个元素的标签在你的应用程序的整个生命周期中可能不会保持不变。 例如,对于在您玩游戏时记录分数的计数器,您希望在分数变化时更改标签。 通过设置可访问性标签和提示以编程方式执行此操作。

score.accessibilityLabel = "score: \(currentScore)"
score.accessibilityHint = "Your current score" 

Simplify Your Accessibility Information

VoiceOver 会按照设备语言的方向朗读。 例如,VoiceOver 从左到右读取英语,从右到左读取阿拉伯语和波斯语。 如果您在 UI 中垂直堆叠标签,或在表格中显示文本,VoiceOver 可能无法以正确的顺序读取标签。 您可以以编程方式对辅助功能元素进行分组,以确保 VoiceOver 按您的意图读取它们。 例如,如果您正在创建一个应用程序,该应用程序堆叠了一个标题和一个值以显示一个人的姓名和电子邮件地址,这取决于他们在界面中的顺序,VoiceOver 可能不会一起读取这些元素。 将元素分组以确保您创建了清晰的上下文。

在上图中,VoiceOver 从前边到后边读取左侧有四个标签,在本例中为从左到右。 尽管 VoiceOver 可以访问每个元素,但这并不能提供最佳的用户体验。 在右侧,VoiceOver 按预期顺序读取分组标签,从而实现清晰的导航。

要对标签进行分组,请创建一个 UIAccessibilityElement 并添加要组合在一起的信息。

var elements = [UIAccessibilityElement]()
let groupedElement = UIAccessibilityElement(accessibilityContainer: self)
groupedElement.accessibilityLabel = "\(nameTitle.text!), \(nameValue.text!)"
groupedElement.accessibilityFrameInContainerSpace = nameTitle.frame.union(nameValue.frame)
elements.append(groupedElement)

包括每个元素的可访问性标签和分组元素允许依赖 VoiceOver 的人导航他们的设备并使用您的应用程序。

后记

本篇主要讲述了Supporting VoiceOver in Your App,感兴趣的给个赞或者关注~~~

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 159,835评论 4 364
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,598评论 1 295
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 109,569评论 0 244
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 44,159评论 0 213
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,533评论 3 287
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,710评论 1 222
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,923评论 2 313
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,674评论 0 203
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,421评论 1 246
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,622评论 2 245
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,115评论 1 260
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,428评论 2 254
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 33,114评论 3 238
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,097评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,875评论 0 197
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,753评论 2 276
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,649评论 2 271

推荐阅读更多精彩内容