Реагировать на переопределенный ящик навигации safeareaview

Question

Как я могу переопределить / настроить значение по умолчанию SafeAreaView, предоставляемое с react-navigation / react-navigation-drawer.

Источник: https://reactnavigation.org/docs/en/handling-iphonex.html

Я пытаюсь переопределите, включив <SafeAreaView></SafeAreaView>, как указано в компоненте / представлении, но вместо этого он получит дубликат SafeAreaView UI. Это означает, что он добавляет еще один SafeAreaView вместо переопределения встроенного SafeAreaView по умолчанию react-navigation.

<SafeAreaView
  style={{flex: 1}}
  forceInset={{ bottom: 'never' }}>
  ...
</SafeAreaView>

Answer 1

Вам нужно создать пользовательский contentComponent для своего ящика:

const DrawerNavigatorConfig = {
  contentComponent: props => <Menu {...props} />
};
createDrawerNavigator(RouteConfigs, DrawerNavigatorConfig);

Вам нужно будет реализовать этот Menu компонент ... который может выглядеть следующим образом:

const Menu = () => {
  return (
    <SafeAreaView
        forceInset={{ top: 'always', bottom: 'never' }}
         style={{flex: 1}}
    >
        ...
    </SafeAreaView>
  );
};