如何设置将本机TextInput作为手机号码输入被屏幕阅读器读取

Question

我正在尝试为我的TextInputin react native 添加辅助功能,以便将其读作手机号而不是数字,如下所示.

<TextInput
    style={{height: 40, borderColor: 'gray', borderWidth: 1}}
    editable={false}
    accessibilityLabel={'26726855243'}
    value={'26726855243'}
  />

这是由Android TalkBack和iOS VoiceOver读取的数字.我试过在数字之间添加空格但仍然无效,accessibilityLabel={'26726855243'.split('').join(' ')}

Answer 1

CSS3语音模块支持此行为:https://www.w3.org/TR/css3-speech/

对于您的具体示例,您可以创建"phone"类,如下所示:

<style>
  .phone {speak: digits;}
</style>

请注意,此行为目前仅由VoiceOver支持,而不是由TalkBack支持.

对于Talkback和大多数其他屏幕阅读器,插入逗号而不是空格将起作用(屏幕阅读器通常暂停逗号,句号,分号,感叹号和问号,但不是空格):

accessibilityLabel={'26726855243'.split('').join(',')}

然而!我鼓励您考虑不要以这种方式管理屏幕阅读器行为.请记住,现代屏幕阅读器具有各种用户设置,用于处理数字和首字母缩略词的发音.通过尝试在开发人员端将其发音管理到此级别,您可能会对用户造成意外行为.