Обработка SafeArea в ReactNative на iPhone X - PullRequest
Новая
       84

Обработка SafeArea в ReactNative на iPhone X

5 голосов
/ 21 июня 2020

В моем приложении ReactNative я использую SafeAreaView, чтобы ограничить мой контент в видимой области. Мое приложение работает в ландшафтном режиме. Посмотрите на изображение образ


В моем приложении есть FlatList с 2 отображенными элементами. Если вы заметили FlatList (зеленого цвета), слева он имеет отступ в 20 пикселей, а справа - выемку (хотя он имеет отступ в 20 пикселей до границы). Из-за выемки справа мой FlatList не отцентрирован.
Есть ли способ управлять размером содержимого с учетом области надреза?

Ответы [ 2 ]

0 голосов
/ 28 июня 2020

Для iOS вы можете использовать этот пакет: https://www.npmjs.com/package/react-native-iphone-x-helper

getBottomSpace() и getStatusBarHeight()

0 голосов
/ 25 июня 2020

попробуйте обернуть ваши Flatlists внутренним представлением между Flatlists и SafeAreaView и добавить отступы внутреннего View, например, 

<SafeAreaView style={{flex: 1}}>
  <View style={{flex: 1, padding: 24, justifyContent: 'center', alignItems: 'center'}}>
    {/* your flatlists here */}
  </View>
</SafeAreaView>

, это должно сделать его более естественным.

...