无障碍测试

为确保你的应用具备无障碍能力，请对照 Web Content Accessibility Guidelines (WCAG) 2、EN 301 549 等公开标准进行检查，并使用 Voluntary Product Accessibility Template (VPAT) 等资源对产品进行自评。有关这些法规的更多详情，请参阅主 无障碍页面。

我们建议使用自动化无障碍扫描器测试以下内容：

• 对于 Android：

  1. 为 Android 安装 Accessibility Scanner

  2. 在 Android Settings > Accessibility > Accessibility Scanner > On 中启用 Accessibility Scanner。

  3. 前往 Accessibility Scanner 的「复选框」图标按钮以启动扫描。

• 对于 iOS：

  1. 在 Xcode 中打开 Flutter 应用的 iOS 文件夹。

  2. 选择模拟器作为目标，然后点击 Run 按钮。

  3. 在 Xcode 中选择 Xcode > Open Developer Tools > Accessibility Inspector。

  4. 在 Accessibility Inspector 中选择 Inspection > Enable Point to Inspect，然后在正在运行的 Flutter 应用中点选各种用户界面元素以检查其无障碍属性。

  5. 在 Accessibility Inspector 的工具栏中选择 Audit，然后选择 Run Audit 以获取潜在问题的报告。

• 对于 Web：

  1. 打开 Chrome DevTools（或其他浏览器中的类似工具）。

  2. 检查 semantics host 下的 HTML 树，其中包含 Flutter 生成的 ARIA 属性。

  3. 在 Chrome 中，「Elements」选项卡带有「Accessibility」子选项卡，可用于检查导出到语义树的数据。

使用 Flutter 的 Accessibility Guideline API 测试你的应用。该 API 会检查应用的 UI 是否符合 Flutter 的无障碍建议，涵盖文本对比度、目标尺寸和目标标签等建议。

以下代码片段演示如何在名为 AccessibleApp 的示例 widget 上使用 Guideline API：

import 'package:flutter_test/flutter_test.dart';
import 'package:your_accessible_app/main.dart';
​
void main() {
  testWidgets('Follows a11y guidelines', (tester) async {
    final SemanticsHandle handle = tester.ensureSemantics();
    await tester.pumpWidget(const AccessibleApp());
​
    // Checks that tappable nodes have a minimum size of 48 by 48 pixels
    // for Android.
    await expectLater(tester, meetsGuideline(androidTapTargetGuideline));
​
    // Checks that tappable nodes have a minimum size of 44 by 44 pixels
    // for iOS.
    await expectLater(tester, meetsGuideline(iOSTapTargetGuideline));
​
    // Checks that touch targets with a tap or long press action are labeled.
    await expectLater(tester, meetsGuideline(labeledTapTargetGuideline));
​
    // Checks whether semantic nodes meet the minimum text contrast levels.
    // The recommended text contrast is 3:1 for larger text
    // (18 point and above regular).
    await expectLater(tester, meetsGuideline(textContrastGuideline));
    handle.dispose();
  });
}

要试用这些测试，请在 使用 flutter create 创建的新应用 上运行它们。该应用主屏幕上的每个按钮都是可点击目标，文本以 18 磅字体渲染。

你可以将 Guideline API 测试与其他 widget 测试 放在一起，或放在单独的文件中，例如本示例中的 test/a11y_test.dart。

你可以在 profile 和 release 模式下使用以下命令行标志，通过可视化 Web 应用创建的语义节点来调试无障碍：

flutter run -d chrome --profile --dart-define=FLUTTER_WEB_DEBUG_SHOW_SEMANTICS=true

启用该标志后，语义节点会显示在 widget 上方；你可以验证语义元素是否放置在正确位置。如果语义节点位置不正确，请 提交 bug 报告。