UI 设计与样式

要创建无障碍应用，请在设计 UI 时考虑无障碍。本页介绍无障碍 UI 设计与样式的关键方面。

Android 和 iOS 都提供系统设置，用于配置应用使用的字体大小。Flutter 文本 widget 在确定字体大小时会遵循该操作系统设置。

Flutter 会根据操作系统设置自动计算字体大小。不过，作为开发者，你应确保在字体变大时，布局仍有足够空间渲染全部内容。例如，可在配置为最大字体的小屏设备上测试应用的各个部分。

调整字体大小：在 iOS 上，前往设置 > 无障碍 > 显示与文字大小；在 Android 上，前往设置 > 字体大小。

以下两张截图分别展示：使用 iOS 默认字体设置渲染的标准 Flutter 应用模板，以及在 iOS 无障碍设置中选择最大字体后的渲染效果。

足够的颜色对比度让文字和图片更易阅读。除了惠及各类视障用户，在强光直射或屏幕亮度较低等极端光照条件下查看界面时，足够对比度也有助于所有用户。

W3C 建议：

• At least 4.5:1 for small text (below 18 point regular or 14 point bold)

• At least 3.0:1 for large text (18 point and above regular or 14 point and above bold)

• 小号文字（低于 18 磅常规或 14 磅粗体）至少 4.5:1

• 大号文字（18 磅及以上常规或 14 磅及以上粗体）至少 3.0:1

你可以使用 Flutter 的 Accessibility Guideline API 测试对比度。有关测试的更多详情，请参阅无障碍测试页面。

过小的控件对许多人来说难以操作和选中。请确保交互元素具有足够大的点击目标，便于用户按压。

Android 和 iOS 分别建议最小点击目标为 48x48 dp 和 44x44 pt。

W3C 建议最小目标尺寸为 44×44 CSS 像素。

你可以使用 Flutter 的 Accessibility Guideline API 测试点击目标尺寸。有关测试的更多详情，请参阅无障碍测试页面。

你可以查看 AccessibilityFeatures 类，了解平台可能启用的其他无障碍功能，例如粗体文字、高对比度和反色。