第 13 章：可访问性与国际化

为图表添加 VoiceOver 支持

概述

在 iOS 开发中，可访问性（Accessibility）是确保所有用户（包括视障用户）能够使用应用的关键功能。VoiceOver 是 Apple 的屏幕阅读技术，允许用户通过听觉导航界面。为图表添加 VoiceOver 支持，意味着视障用户也能理解图表中的数据趋势和关键信息。

核心实现步骤

1. 为图表元素添加可访问性标签

Chart(data) { item in
    BarMark(
        x: .value("Category", item.category),
        y: .value("Value", item.value)
    )
    .accessibilityLabel("\(item.category): \(item.value)")
}

2. 提供汇总描述

Chart(data) { /* ... */ }
    .accessibilityElement(children: .combine)
    .accessibilityLabel("销售数据图表")
    .accessibilityValue("总计 \(totalValue) 单位")

3. 自定义 VoiceOver 提示

.accessibilityHint("上下滑动可听取详细数据点")

4. 动态数据更新支持

@State private var selectedIndex: Int?
//...
.accessibilityAddTraits(selectedIndex != nil ? .isSelected : [])

高级技巧

  1. 多层级描述
    对复杂图表（如堆叠柱状图）提供层级化描述：

    .accessibilityRepresentation {
    VStack {
        Text("2023年销售数据")
        ForEach(data) { item in
            Text("\(item.month): \(item.value)")
        }
    }
}

  2. 自定义手势支持
    添加双击手势触发关键操作：

    .accessibilityAction(.magicTap) {
    speakChartSummary()
}

  3. 音效反馈
    结合 AVFoundation 在数据变化时播放区别音效：

    .onChange(of: selectedIndex) { _ in
    UIAccessibility.post(notification: .announcement, 
                        argument: "已选择\(data[newValue].category)")
}

测试验证

  1. 在模拟器中启用 VoiceOver（Cmd + F5）
  2. 检查：
    • 所有数据点是否可遍历
    • 汇总信息是否准确
    • 动态更新是否触发提示
  3. 使用 Accessibility Inspector 审核元素

实际案例：股票走势图

LineMark(/* ... */)
    .accessibilityLabel("\(stock.date.formatted()): \(stock.price)")
    .accessibilityValue("\(stock.change > 0 ? "上涨" : "下跌") \(abs(stock.change))%")
    .accessibilityCustomContent("成交量", "\(stock.volume)万股")

最佳实践：始终在真机上测试 VoiceOver 体验，确保手势操作流畅且描述自然符合听觉逻辑。

Last Updated::