无障碍 (a11y)

在 NativeScript 中，有两种主要方法可以在您的应用程序中启用一流的 a11y 支持。

1. 视图属性：accessible="true"

<label text="{N}" accessible="true"></label>

2. CSS 属性：a11y-enabled: true

此选项允许您重用 CSS 类来启用 a11y 功能。

.a11y {
  a11y-enabled: true;
}

<label text="{N}" class="a11y"></label>

这两种选项都提供了在需要为您的应用程序正确启用 a11y 时所需的灵活性。

属性 ​

存在各种属性来进一步控制 a11y。

accessibilityLabel ​

建议在将视图标记为 accessible 时始终使用 accessibilityLabel。设备上的 VoiceOver 使用将朗读此值，以便用户知道选择了哪个元素。

<label
  text="{N}"
  class="a11y"
  accessibilityLabel="The NativeScript logo in textual form"
></label>

accessibilityHint ​

提供更多帮助，以便用户了解他们在对可访问元素执行操作时会发生什么。

<button
  text="Submit"
  class="a11y"
  accessibilityLabel="Button to submit the form"
  accessibilityHint="Submit this form"
></button>

iosAccessibilityAdjustsFontSize（仅限 iOS） ​

启用此选项以允许设备字体缩放影响视图字体大小。Android 默认启用此功能。

iosAccessibilityMinFontScale（仅限 iOS） ​

设置最小无障碍字体缩放比例。

iosAccessibilityMaxFontScale（仅限 iOS） ​

设置最大无障碍字体缩放比例。

accessibilityIgnoresInvertColors（仅限 iOS） ​

当屏幕颜色使用无障碍功能反转时，您通常不希望照片等视图反转。您可以将此设置为忽略反转。

accessibilityLiveRegion（仅限 Android） ​

当组件动态更改时，我们希望 TalkBack 提醒最终用户。

• AccessibilityLiveRegion.None：不应宣布对此视图的更改。
• AccessibilityLiveRegion.Polite：应宣布对此视图的更改。
• AccessibilityLiveRegion.Assertive：应中断正在进行的语音以立即宣布对此视图的更改。

<Switch checked="true" class="a11y" checkedChange="{{checkedChange}}" />
<TextView
  hint="TextView"
  text="{{switchCheckedText}}"
  accessibilityLiveRegion="{{AccessibilityLiveRegions.Assertive}}"
/>

在上面的示例中，方法 checkedChange 更改了 switchCheckedText 变量。一旦最终用户点击 Switch，TalkBack 就会读取文本视图中的文本，因为其 AccessibilityLiveRegions.Assertive 属性。

accessibilityRole ​

向用户传达元素的目的。

它可以设置为以下之一

• AccessibilityRole.Adjustable 可以“调整”的元素（例如滑块）。
• AccessibilityRole.Button 应被视为按钮的元素。
• AccessibilityRole.Checkbox 代表可以选中或取消选中的复选框的元素。
• AccessibilityRole.Header 充当部分标题的元素。
• AccessibilityRole.Image 应被视为图像的元素。
• AccessibilityRole.ImageButton 应被视为按钮，也是图像的元素。
• AccessibilityRole.KeyboardKey 充当键盘键的元素。
• AccessibilityRole.Link 应被视为链接的元素。
• AccessibilityRole.None 元素没有角色。
• AccessibilityRole.PlaysSound 元素在激活时播放自己的声音。
• AccessibilityRole.ProgressBar 指示任务进度的元素。
• AccessibilityRole.RadioButton 元素是单选按钮。
• AccessibilityRole.Search 元素应被视为搜索字段。
• AccessibilityRole.SpinButton 行为类似于 SpinButton 的元素。
• AccessibilityRole.StartsMediaSession 元素在激活时启动媒体会话。
• AccessibilityRole.StaticText 应被视为不可更改的静态文本的元素。
• AccessibilityRole.Summary 在应用程序启动时提供摘要信息的元素。
• AccessibilityRole.Switch 行为类似于开关的元素。

accessibilityState ​

元素的当前状态。

它可以设置为以下之一

• AccessibilityState.Selected 元素当前被选中。
• AccessibilityState.Checked 元素当前被选中。
• AccessibilityState.Unchecked 元素当前未被选中。
• AccessibilityState.Disabled 元素当前处于禁用状态。

accessibilityValue ​

元素的当前值。

accessibilityElementsHidden ​

此无障碍元素中包含的元素是否隐藏。

调试无障碍功能 ​

以下是用于在您的应用程序中调试无障碍功能的平台工具

• iOS：无障碍检查
• Android：测试您的应用程序的无障碍功能