原文地址: iOS 无障碍化(适老化)适配总结

VoiceOver 和 Accessibility

iOS 开发中主要讨论的是 UIAccessibility 的 API 在 VoiceOver 上的运用.

旁白使用手册-在 iPhone 上学习旁白手势

检测当前是否开启无障碍模式

系统通知：UIAccessibilityVoiceOverStatusDidChangeNotification

系统方法：UIAccessibilityIsVoiceOverRunning()

iOS代码适配示例

UILabel *titleLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 100, 100)];
// 描述控件是什么 第一个播放
titleLabel.accessibilityLabel = @"标签";
// 元素的特征 如按钮、链接等 第二个播放
titleLabel.accessibilityTraits = UIAccessibilityTraitStaticText;
// 附加说明 第三个播放, 只在真机播放, 且有一秒延迟
titleLabel.accessibilityHint = @"提示";
// 元素的frame(基于屏幕坐标系, 一般不用填设置), 当系统聚焦到当前元素时, 会有一个黑色的外框, 该值就是聚焦框的大小. 当元素过小时可以通过设置该 frame 使得容易点击, 这个不会改变 app 的 UI. 默认为 CGRectZero.
titleLabel.accessibilityFrame = CGRectMake(0, 0, 100, 100);
// 元素的值 用在UISlider,UITextField等组件上 用来描述元素的值
titleLabel.accessibilityValue = @"60%";
// VoiceOver会把这几个属性连接起来, 朗读顺序为label→value(可选)→traits→hint.

需要适配的场景

由于系统控件是默认处理好的,而且VoiceOver的默认阅读顺序通常也没什么大问题,因此需要开发者专门去兼容的场景有如下

自定义 View 组件无障碍化

当子元素需要配置成 accessible, 而你的视图容器不需要配置成 accessible, 下面两个方法可以解决

1. 直接设置 accessibilityElements 属性 (iOS8+), 使用在代码里搜下吧, 很简单.
2. (很老的 API 了, 不推荐使用)视图需要实现 UIAccessibilityContainer.

只有背景图片无文字的控件

需要给出描述和对应控件的属性, 例如返回按钮/关闭按钮

self.backButton.accessibilityLabel = @"返回";
self.closeButton.accessibilityLabel = @"关闭";
self.closeButton.accessibilityTraits = UIAccessibilityTraitButton;

读取时间的无障碍

24 小时制的时刻系统无障碍会按字符一个个读出,需要转化成 12 小时制的写法,才会正常读取时间,例如 22:58 要写成 10.58PM.

某些控件的无障碍元素默认是关闭的, 需要开启

UIView/UIImageViewisAccessibilityElement 默认为 NO
而 UILabel/UIButton/UISwitch/UICollectionViewCell/UITableViewCell/UIPageControl 等组件默认为 YES.
其中 UILabel 比较离谱, 偶现 setText, 然后 po isAccessibilityElement 为 YES, 但是不响应的情况, 最好都显式设置 isAccessibilityElement = YES 吧.

父 View 如果为 AccessibilityElement, 子 element 将不响应 VoiceOver

self.bottomView.isAccessibilityElement = YES;
self.bottomView.accessibilityLabel = @"XXX";

比如一个View中有多个Label,那么每一个下面的Label单独访问可能意义不大,那么就可以将这个View设置成可以访问的,然后将其accessibilityLabel设置为所有子Label的 accessibilityLabel的合并值.

无障碍控件点击区域过小

类似下图：图片和文字搭配, 需要扩大无障碍点击范围:设置accessibilityFrame,通过CGRectUnion(frame1,frame2);
需要注意的是 accessibilityFrame 是相对屏幕的坐标系的, 使用 [UIView convertRect:toView:] 来转一次才能设置, 如果用了自动布局会很麻烦.

UI 组件实际功能不符合时

使用 button 只做点击作用的时候(不需要选中态),需要设置对应的控件属性 accessibilityTraits

// 1. 不需要播报"已选中"
button.accessibilityTraits &= ~UIAccessibilityTraitSelected;
// 2. 纯文本
button.accessibilityTraits = UIAccessibilityTraitStaticText;

使用 laber / view / imageView, 实现自定义响应事件时,设置对应控件属性 accessibilityTraits 为 UIAccessibilityTraitButton.

hidden 元素

有时把某个 view 设成 hidden 的时候, UI 上已经不展示了, 但是VoiceOver仍然可以读到.
此时可以使用

UIAccessibilityPostNotification(UIAccessibilityLayoutChangedNotification, nil)

强制更新VoiceOver的表现.

主动播报

toast 弹出或者刷新成功等场景需要主动播报, 如下:

UIAccessibilityPostNotification(UIAccessibilityAnnouncementNotification, voiceText);

弹窗

弹窗后屏蔽弹窗下面的元素

popupView.accessibilityViewIsModal = YES;//当前view才能响应无障碍播报
UIAccessibilityPostNotification(UIAccessibilityScreenChangedNotification, popupView.accessibilityElements.firstObject);

焦点乱跳

焦点乱跳有两个可能

1. UICollectionView/UITableView reloadData 时候焦点会跳到最后一个 Cell, 解决办法为自行实现 cell 的更新, 减少直接 reloadData 调用; 如果这个 Cell 是满屏的, 可以设置当前 Cell 的 accessibilityViewIsModal 简单解决.
2. 某个 UI 元素被加入到 accessibilityElements 但是又被标记为不可用 isAccessibilityElement = NO, 在手指左划时会出现焦点乱跳(但是右划正常)

UICollectionViewDelegate 异常

在无障碍开启时, UICollectionViewDelegate 部分回调异常, 表现为 Cell 提前预加载了, 不在这些方法中执行关键逻辑即可, 目前已知下面两个回调会有异常

- (void)collectionView:(UICollectionView *)collectionView willDisplayCell:(UICollectionViewCell *)cell forItemAtIndexPath:(NSIndexPath *)indexPath;

- (void)collectionView:(UICollectionView *)collectionView didEndDisplayingCell:(UICollectionViewCell *)cell forItemAtIndexPath:(NSIndexPath *)indexPath;

Cell 横划删除 在无障碍下无法使用

使用自定义操作来代替

UIAccessibilityCustomAction * action = [[UIAccessibilityCustomAction alloc] initWithName:@"测试" target:self selector:@selector(testToast)];
UIAccessibilityCustomAction * action1 = [[UIAccessibilityCustomAction alloc] initWithName:@"测试1" target:self selector:@selector(testToast1)];
UIAccessibilityCustomAction * action2 = [[UIAccessibilityCustomAction alloc] initWithName:@"测试2" target:self selector:@selector(testToast2)];

self.accessibilityCustomActions = @[action, action1, action2];

触发方法:

1. 单击选中该 UI 元素
2. 单指上下划, 第一次播报 "测试", 再单指上下划第二次播报 "测试2", 继续划会有第三次播报 "测试3", 第四次播报"激活" (初始状态).
3. 然后在某一次播报后单指双击, 就可以触发对应的 selector

需要播报"已选中"

// 设置"已选中"播报
view.accessibilityTraits |= UIAccessibilityTraitSelected;
// 移除"已选中"播报
view.accessibilityTraits &= ~UIAccessibilityTraitSelected;