Блог

Я разрабатываю приложение react native для iOS. Включен компонент SafeAreaView с цветом фона, но в верхней части iPhone X остается незаполненное пространство с белым фоном.

Я удалил SafeAreaView, и я все еще вижу белую область у верхнего края, на которую не влияет заполнение фоновым цветом, за исключением случаев, когда я загружаю фоновое изображение. Не уверен, почему SafeAreaView не покрывает всю безопасную область в верхней части телефона; это занимает всего 50% пути.

  <Fragment>

      <SafeAreaView style={{ flex: 0, backgroundColor: '#006600' }}  />
      <SafeAreaView style={{ flex: 1, backgroundColor: '#006600' }} > 
      <StatusBar barStyle='light-content' />
      <View style={styles.container}>
        <Header 
          headerText={'My Naija Calculator'} 
          backgroundColor = {'#006600'}
          color = { '#fff'}
          />
  

Вы используете SafeAreaView неправильно

SafeAreaView действует как View . Вам просто нужно обернуть его один раз вокруг всех дочерних элементов

 <SafeAreaView>
   <Component1 />
   <Component2 />
</SafeAreaView>
  

ссылка: https://facebook.github.io/react-native/docs/safeareaview

  <SafeAreaView style={{backgroundColor:'green'}}>
       <Text>hello</Text>
     </SafeAreaView>
  

вы можете попробовать это

Извините, я виноват. У меня было заполнение 20, застрявшее в каком-то забытом ограничивающем компоненте представления. Я удалил его, и все работает, как ожидалось.