Блог

Главная - Вопросы по программированию - Как удалить пространство сверху в react-drawer

Как удалить пространство сверху в react-drawer

#react-native #react-navigation-drawer

#react-native #react-навигация-ящик

Вопрос:

Я использую его, и я получаю пробел вверху. Может ли кто-нибудь предоставить мне подробную информацию, чтобы удалить это пустое пространство сверху. @react-навигация / ящиквведите описание изображения здесь

Ответ №1:

В DrawerContentScrollView в коде @react-navigation / drawer по умолчанию добавлено заполнение 4, поэтому, чтобы удалить это, просто передайте paddingTop prop в contentContainerStyle.

 const insets = useSafeArea();

<DrawerContentScrollView
    contentContainerStyle={{
       paddingTop: insets.top,
    }}
   {...props}>
</DrawerContentScrollView>

Комментарии:

1. Спасибо, я догадался, что есть какое-то дополнение, но не знал, что есть contentContainerStyle свойство

Ответ №2:

Вы можете использовать это, если строка состояния скрыта:

 <DrawerContentScrollView 
    contentContainerStyle={{ paddingTop: 0 }}>
</DrawerContentScrollView>

Ответ №3:

Просто чтобы добавить, у меня была такая же проблема, и useSafeArea устарела. Мне удалось использовать useSafeAreaInsets.

 import { useSafeAreaInsets } from 'react-native-safe-area-context';

...<DrawerContentScrollView 
  style={styles.container} 
  contentContainerStyle={{
    paddingTop: insets.top,
 }}
>...