fix: hide inactive pages from screen reader in tabs (#148)

react-navigation · Oct 30, 2019 · 58f7115 · 58f7115
1 parent 3a77107
commit 58f7115
Showing 1 changed file with 12 additions and 1 deletion.
diff --git a/packages/bottom-tabs/src/views/BottomTabView.tsx b/packages/bottom-tabs/src/views/BottomTabView.tsx
@@ -216,7 +216,15 @@ export default class BottomTabView extends React.Component<Props, State> {
                   style={StyleSheet.absoluteFill}
                   isVisible={isFocused}
                 >
-                  {descriptors[route.key].render()}
+                  <View
+                    accessibilityElementsHidden={!isFocused}
+                    importantForAccessibility={
+                      isFocused ? 'auto' : 'no-hide-descendants'
+                    }
+                    style={styles.content}
+                  >
+                    {descriptors[route.key].render()}
+                  </View>
                 </ResourceSavingScene>
               );
             })}
@@ -236,4 +244,7 @@ const styles = StyleSheet.create({
   pages: {
     flex: 1,
   },
+  content: {
+    flex: 1,
+  },
 });