仅在活动场景上执行本机可访问性标识符

Question

TalkBack能够从我之前导航过的非活动场景中检测我的React Native 0.35.0安卓应用中的可访问性标识符。如何防止这种情况，以便在识别可访问性标识符时仅使用当前场景？

例如，我的应用程序的第一页呈现了项目的ListView。这些工作按预期使用可访问性标识符，可以选择任何项目。

问题是当导航到下一页时，只有一行文字的页面，在查看新场景时仍然可以访问上一场景中的所有ListView项目！

我正在使用NavigationExperimental，特别是NavigationCardStack进行导航。我知道NavigationCardStack将渲染堆栈中的每个访问过的场景，但我希望找到一种方式，这样只有活动场景才可以选择。

到目前为止，我已尝试实现仅渲染活动场景的NavigationExperimental版本。虽然它解决了这个问题，但导航动画已经毁了，通过应用程序导航必须重新创建每个场景，这在我看来会造成一种低迷和不可接受的体验。

虽然我不喜欢这个解决方案，但我认为在第一页的每个组件上设置accessible = {false}都可行。不幸的是，即使这样仍然可以访问Text组件。如果它有效，我可以设置为NavigationExperimental的属性scene.isActive。

Answer 1

我能够解决这个问题。在React Native中，Android可以设置一个名为importantForAccessibility的属性。它比我更喜欢的更加密集，但我实现了自己的NavigationCardStack和NavigationCard（扩展的React Native＆＃39; s版本在渲染中添加我自己的逻辑）。

基本上在迭代NavigationCardStack中的每个场景时，我传递了一个新属性isActiveScreen，我通过检查当前索引仅在活动场景上设置为true。

然后在NavigationCard中，我通过添加

来利用importantForAccessibility

importantForAccessibility={this.props.isActiveScreen ? 'yes' : 'no-hide-descendants'}

这样在android上只有我当前可见的场景启用了辅助功能，而堆栈中的所有其他场景都设置了无隐藏后代。

Answer 2

我使用react-navigation库时遇到了同样的问题。我能够修改react-navigation/src/views/CardStack/Card.js以便修复这个，这里可以找到，我只是修改了渲染方法（无法获取格式的代码:(）

Card.js @ Github

以下是我对此的修改：

// Fixes an issue on Android whereby talkback/voiceover will pick up elements on a child view that is not active in the stack navigator
if(this.props.scene.isActive) {
  importantForAccessibility='yes';
} else {
  importantForAccessibility='no-hide-descendants';
}

return (
  <Animated.View
    pointerEvents={pointerEvents}
    ref={this.props.onComponentRef}
    style={[styles.main, style]}
    importantForAccessibility={importantForAccessibility}
  >
    {children}
  </Animated.View>
);

此修复程序也已在github＆amp;如果有人需要，则发布到NPM如下： https://github.com/awseeley/react-navigation

https://www.npmjs.com/package/react-navigation-awseeley