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

作者: 浮华丶
发布时间: 2025-01-05 04:21:42 (1月前)
转自：

3 条回复

0#
回复此人
圈圈红 | 2019-08-31 10-32

<div class =“post-text”itemprop =“text”> <P> 我能够解决这个问题。在React Native中，Android可以设置一个名为的属性 <a href="https://facebook.github.io/react-native/docs/accessibility.html#importantforaccessibility-android" rel="nofollow"> importantForAccessibility </A> 。它比我更喜欢它，但我实现了自己的NavigationCardStack和NavigationCard（扩展了React Native的版本以在渲染中添加我自己的逻辑）。 </p> <P> 基本上迭代每个场景 <a href="https://github.com/facebook/react-native/blob/6ea26c01de74e088c486286ffdeb03177c5b3099/Libraries/CustomComponents/NavigationExperimental/NavigationCardStack.js#L222" rel="nofollow"> NavigationCardStack </A> 我通过一个新的财产， <code> isActiveScreen </code> 我通过检查当前索引仅在活动场景上设置为true。 </p> <P> 然后进去 <a href="https://github.com/facebook/react-native/blob/9db8910e36d610977ac473fcc326f68ff3cb03a5/Libraries/CustomComponents/NavigationExperimental/NavigationCard.js#L99"rel="nofollow"> NavigationCard </A> 我通过添加来利用importantForAccessibility </p> <pre> <code> importantForAccessibility={this.props.isActiveScreen ? 'yes' : 'no-hide-descendants'} </code> </pre> <P> 以这种方式在android上只有我当前可见的场景启用了辅助功能，而堆栈中的所有其他场景都设置了无隐藏后代。 </p> </DIV>

编辑
1#
回复此人
不想吃东西 | 2019-08-31 10-32

<div class =“post-text”itemprop =“text”> <P> 我有同样的问题使用 <a href="https://github.com/react-navigation/react-navigation" rel="nofollow noreferrer"> 反应导航 </A> 图书馆。我能够修改 <code> react-navigation/src/views/CardStack/Card.js </code> 为了解决这里可以找到的问题，我只修改了渲染方法（无法获取格式化代码:(） </p> <P> <a href="https://github.com/awseeley/react-navigation/blob/master/src/views/CardStack/Card.js" rel="nofollow noreferrer"> Card.js @ Github </A> </p> <P> 以下是我对此的修改： </p> <pre> <code> // 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> ); </code> </pre> <P> 这个修复程序也在github＆amp;如果有人需要，则发布到NPM如下： <a href =“http：//％20fix％20has％20also％20been％20forked％20on％20github％20＆amp;％20published％20to％20NPM％20if％20anyone％20needs％20it％20as％20follow：％20https：/ /github.com/awseeley/react-navigation%20https://www.npmjs.com/package/react-navigation-awseeley“rel =”nofollow noreferrer“> https://github.com/awseeley/react-navigation </A> </p> <P> <a href="https://www.npmjs.com/package/react-navigation-awseeley" rel="nofollow noreferrer"> https://www.npmjs.com/package/react-navigation-awseeley </A> </p> </DIV>

编辑

登录后才能参与评论