Material Chip 按钮的语义

为了可访问性，Flutter 现在将 button 的语义标签应用于所有交互式 Material Chip。

交互式 Material Chip（即 ActionChip、ChoiceChip、FilterChip 和 InputChip）现在在语义上被标记为按钮。然而，非交互式的信息 Chip 则不是。

将 Chip 标记为按钮有助于可访问性工具、搜索引擎和其他语义分析软件理解应用的含义。例如，它允许屏幕阅读器（如 Android 上的 TalkBack 和 iOS 上的 VoiceOver）将可点击的 Chip 宣布为“按钮”，这可以帮助用户导航您的应用。在此更改之前，可访问性工具的用户可能体验不佳，除非您通过手动为应用中的 Chip widget 添加缺失的语义来实施了变通方案。

包裹所有 Chip 类以描述其语义属性的最外层 Semantics widget 已被修改。

以下更改适用于 ActionChip、ChoiceChip、FilterChip 和 InputChip

button 属性设置为 true。
enabled 属性反映了 Chip *当前*是否可点击（通过设置回调函数）。

这些属性更改使交互式 Chip 的语义行为与其它 Material 按钮保持一致。

对于非交互式的信息 Chip

button 属性设置为 false。
enabled 属性设置为 null。

**您可能不需要执行任何迁移。**此更改仅在您之前通过将 Chip 的 label 字段中的 widget 用标记为 button: true 的 Semantics widget 包裹来解决 Material Chip 缺少 button 语义的问题时才会影响您。**在这种情况下，内部和外部的 button 语义会发生冲突，导致在此更改引入后按钮的可点击区域缩小到标签的大小。**解决此问题的方法是，要么删除该 Semantics widget 并将其替换为其子 widget，要么如果仍需将其他语义属性应用于 Chip 的 label widget，则移除 button: true 属性。

以下代码片段使用 InputChip 作为示例，但相同的过程也适用于 ActionChip、ChoiceChip 和 FilterChip。

情况 1：移除 Semantics widget。

迁移前的代码

dartWidget myInputChip = InputChip(
  onPressed: () {},
  label: Semantics(
    button: true,
    child: Text('My Input Chip'),
  ),
);

迁移后的代码

dartWidget myInputChip = InputChip(
  onPressed: () {},
  label: Text('My Input Chip'),
);

情况 2：从 Semantics widget 中移除 button:true。

迁移前的代码

dartWidget myInputChip = InputChip(
  onPressed: () {},
  label: Semantics(
    button: true,
    hint: 'Example Hint',
    child: Text('My Input Chip'),
  ),
);

迁移后的代码

dartWidget myInputChip = InputChip(
  onPressed: () {},
  label: Semantics(
    hint: 'Example Hint',
    child: Text('My Input Chip'),
  ),
);

发布版本：1.23.0-7.0.pre
稳定版本：2.0.0

API 文档

Material Chip 按钮的语义

概述

背景

变更说明

迁移指南

时间线

参考资料