Question

我正在尝试改善React本机应用程序上的可访问性，并且面临以下问题：当用户打开菜单抽屉时，焦点不会更改为模式抽屉内容。而是向左或向右滑动可聚焦在后台的内容。

我尝试为抽屉和主要内容区域设置动态可访问性道具：

<NavigationMenu
    importantForAccessibility={isNavigationVisible ? 'yes' : 'no-hide-descendants'}
/>
<DashboardContent
    importantForAccessibility={isNavigationVisible ? 'no-hide-descendants' : 'yes'}
/>

isNavigationVisible是一个道具，在打开抽屉时会对其进行更新，但这无效。

有什么方法可以在打开抽屉时强制将焦点更改到抽屉上吗？

Answer 1

这就是我最终使用的：

const setFocus = ({ current: ref }) => {
    const FOCUS_ON_VIEW = 8;
    const reactTag = findNodeHandle(ref);

    Platform.OS === 'android'
        ? UIManager.sendAccessibilityEvent(reactTag, FOCUS_ON_VIEW)
        : AccessibilityInfo.setAccessibilityFocus(reactTag);
}

Answer 2

当前，React-Native没有提供一种开箱即用地遍历视图树并获得第一个可聚焦元素为其设置焦点的方法。

因此，您需要使用AccessibilityInfo.setAccessibilityFocus逐个传递reactTag。

Answer 3

看起来 AccessibilityInfo.setAccessibilityFocus(reactTag) 上有一个错误，它无法始终如一地工作，多次调用它会增加成功的机会。

请参阅此 answer 以了解如何进行两次此调用以专注于视图启动。

有关更多详细信息，请参阅 github 上的 open issue。

在抽屉/模式打开中更改本机应用程序中的可访问性焦点

3 个答案: