背景：

用户(老年人、视障人士)在系统设置中开启“旁白”模式后，用户触摸到App页面控件后就会语音播报出对应的内容。可打开设置-辅助功能-旁白体验相关功能。

IOS：适配VoiceOver服务；Android：适配TalkBack(盲人模式)服务；H5：适配W3C WAI 规范。

国内也出台了政策要求适配老年版、盲人版App：

在国内，国务院、工信部、中国残联等各级部门陆续出台了多项法规、政策、标准等要求适配无障碍。
在国外，许多国家和地区对信息无障碍均有相关立法，要进入当地市场，必须要符合信息无障碍相关的法律法规。
目前，中国有8500多万残障人士，2亿多60岁以上的老年人，都是目标群体，潜在用户量很大。

一、UIAccessibility：

辅助功能属性有4种，系统播报的顺序为：（默认情况下，标准的UIKit控件和视图已经实现了UIAccessibility功能）

accessibilityLabel：描述内容“是什么”，例如 “产品名称”
accessibilityValue：描述“值是多少”，例如“年化利率5%”
accessibilityTraits：描述"特性、状态、行为、用法"。控件的特性可以是按钮(Button)，控件的状态可以是已选中(Selected)
accessibilityHint：描述行动“做什么”，例如“点击两下可跳转购买页面”

1、Label、Value、Hint配置的字符串，会以语音的形式念出来，配置什么，念什么。

2、配置的Traits各个类型，也会以语音的形式念出。例如：UIAccessibilityTraitSelected、UIAccessibilityTraitImage、UIAccessibilityTraitButton分别播报"已选定”、”图片”、”按钮”。

Traits类型：

按钮(Button)
链接(Link)
搜索域(Search Field)
键盘按键(Keyboard Key)
静态文本(Static Text)
图像(Image)
播放声音(Plays Sound)
已选中(Selected)
总结元素(Summary Element)
常态更新(Updates Frequently)
不可用(Not Enabled)
空(None)

二、示例：

给控件添加如下属性，就可以按照你预期的文案去播报了：

button.accessibilityLabel = @"交易明细";
//button.accessibilityValue = @"年化利率5%";
button.accessibilityTraits = UIAccessibilityTraitButton;
button.accessibilityHint = @"点击两下可跳转交易明细页面";
button.isAccessibilityElement = YES;

小技巧：

1、在界面上单指左右扫动可以切换焦点，可以通过这种方式查看整个页面有哪些焦点、也可以查看各个焦点的顺序。
2、三只手指双击屏幕，可以开启、关闭语音。
3、四只手指侧滑屏幕可以切换到上一个app。

三：遇到的问题：

1、当整个View作为VoiceOver的访问元素，View中的子控件都会变为不可访问，那如何使父控件、子控件都支持VoiceOver？

处理：
改变他们的层级关系（把子控件移到上一个层级），且都开启isAccessibilityElement = YES。

2、cell是默认可整块选中的，设置过isAccessibilityElement = YES的子控件只有选中当前控件才会播报；其他控件在选中cell的时候会全部依次播报。如何使cell不可选中？（即使cell设置了isAccessibilityElement = NO 也没用）

处理：
cell中的所有控件都设置isAccessibilityElement = YES 或 NO后，点击cell无法选中且没有播报内容了。

3、我给cell加了一个字符串变量：@property (nonatomic, copy) NSString *account: 结果选中整个cell的时候会播报account的值。

处理：
我改成NSInteger来处理就没有播报了。。。

4、手势登录播报：我给9个按钮依次做了1-9的编号，点击按钮的时候会播报对应的数字，但是连不起来。

处理：
点击按钮两次，点第二次的时候长按两秒钟，这时候就可以滑动手指来录入手势了。

5、弹出自定义弹窗后，可以浏览到底层元素的bug。

处理：

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

6、调整页面焦点顺序：

view.shouldGroupAccessibilityChildren = YES; //借助层级关系调整 \
self.accessibilityElements = @[label1, label2]; // 调整返回顺序，数组前面的对象优先级最高（如果数组中的对象为nil，会导致闪退）

注意：
调整层级时不要漏掉控件，否则旁白模式下这个被遗漏的控件会无法选中也无法播报

7、banner图是做的无限轮播图，如果用普通右滑操作切换到下一个焦点，旁白模式下会出现一直在轮播图内循环的现象

处理：

// 在旁白开启状态下禁用滚屏 
if (UIAccessibilityIsVoiceOverRunning()) { 
    // 禁用滚屏 
}

8、检测是否开启了无障碍：

 UIAccessibilityIsVoiceOverRunning()

9、播报完一段语音的通知：（处理频繁播报时一句语音未播完就马上播下一条的问题）

[[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(announcementFinished:) name:UIAccessibilityAnnouncementDidFinishNotification object:nil];

10、如何在全键盘中用中文播报数字？（选择了英文的全键盘）
使用中文键盘就会自动播报中文，使用英文键盘就会播报英文

11、一段文案中有两个跳转事件：点击隐私政策，只会跳转第一个，第二个一直跳转无效

处理：
a、双击会响应第一个跳转事件，重按会响应第二个跳转事件
b、改成两个控件，每个控件一个点击事件

12、如何取消编辑模式？
点击页面其他控件、点击键盘完成按钮

13、主动播报：

UIAccessibilityPostNotification(UIAccessibilityAnnouncementNotification, @“播报内容”);

14、没有开启旁白模式的情况下语音播报：(这个是用的另外一个播报方式，与“旁白”不相关)

AVSpeechSynthesizer *avSpeaker = [[AVSpeechSynthesizer alloc] init];//(遇到一个bug：iPhoneX上运行release包在这一行会闪退，其他场景都正常)
avSpeaker.delegate = self;
AVSpeechUtterance *utterance = [[AVSpeechUtterance alloc] initWithString:text];
utterance.rate = 0.5;//语速
utterance.pitchMultiplier = 1;//音高 0.5-2
utterance.volume = 1;//音量0-1
utterance.preUtteranceDelay = 0.5;//停顿
utterance.postUtteranceDelay = 0.5;
utterance.voice = [AVSpeechSynthesisVoice voiceWithLanguage:@"zh-CN"];
[avSpeaker speakUtterance:utterance];

15、数字连读处理，比如播报验证码1234的时候，系统会自动播报成“一千两百三十四”。

处理：
在中间加分隔符 1:2:3:4，这样就会一个数字一个数字的读了

16、对比度适配
适配无障碍时，还要求页面样式达到相应的对比度，就是文字和背景颜色不能太相近导致不容易识别。
对比度的要求是，18dp/pt以下的文字，要求4.5:1；18dp/pt以上的文字，要求3:1。

对比度检查网站（输入RGB十六进制格式的前景色和背景色进行对比）

四、拓展

1、UIAccessibilityContainer Protocol：

一些非标准控件或者非UIView子类、通过draw方法画出来的区域，以上两种情况都不能实现无障碍播报，这种情况需要UIAccessibilityContainer Protocol来实现无障碍播报:

@interface TestView ()
@property (nonatomic, strong) NSMutableArray *accessibleElements;
@property (nonatomic, strong) UIImageView *img1;
@end

@implementation TestView
- (NSArray *)accessibleElements {
   if (_accessibleElements) {
      return _accessibleElements;
   }
   _accessibleElements = [[NSMutableArray alloc] init];

   UIAccessibilityElement *element1 = [[UIAccessibilityElement alloc] initWithAccessibilityContainer:self];
   element1.isAccessibilityElement = YES;
   element1.accessibilityFrame = [self convertRect:self.img1.frame toView:nil];
   element1.accessibilityLabel = @"游戏中心";
   element1.accessibilityTraits = UIAccessibilityTraitImage;
   [_accessibleElements addObject:element1];

   return _accessibleElements;
}

// 这个TestView不支持Accessibility
- (BOOL)isAccessibilityElement {
   return NO;
}


// UIAccessibilityContainer协议方法
- (NSInteger)accessibilityElementCount {//容器中控件数量
   return [[self accessibleElements] count];
}

- (id)accessibilityElementAtIndex:(NSInteger)index {//下标对应的控件
   return [[self accessibleElements] objectAtIndex:index];
}

- (NSInteger)indexOfAccessibilityElement:(id)element {//控件对应的下标
   return [[self accessibleElements] indexOfObject:element];
}

@end

2、Accessibility Inspector：

可访问性查看器(Accessibility Inspector)：提供了一种访问重要信息的方法，在当前页通过可访问性树的辅助技术可以使重要信息显示出来，从而允许你去检查丢失的或者需要注意的信息。

使用：
Xcode -> Open Developer Tool -> Accessibility Inspector

参考：

Bring accessibility to charts in your app
Deliver an Exceptional Accessibility Experience
Accessibility in SwiftUI
Accessibility Programming Guide for iOS
官方样例代码

iOS Accessibility: Getting Started
iOS Accessibility(辅助功能)超详细讲解
 iOS Accessibility指南
 带你认识—iOS Accessibility
iOS手机无障碍编程总结
 语义化与无障碍树(前端资料)

信息无障碍研究会
 信息无障碍产品联盟

如果觉得本文有用，可以在下方点个赞。如果发现有遗漏或不对的地方，请在下方留言~

iOS UIAccessibility旁白、无障碍

背景：