Перекрытие заголовка навигации React в приложении react native

#android #ios #react-native #react-navigation

#Android #iOS #react-native #react-навигация

Вопрос:

Я работаю в приложении react native, для своей навигации я использовал react-navigation 4, на одном из экранов я хочу перекрыть заголовок react-navigation компонентом card, на Android он работает нормально, но на iOS я не могу заставить его работать, хотя я установилукажите zIndex на большое число, оно всегда скрыто заголовком react-navigation. вот код для моего компонента :

 <View style={global.container}>
                <View style={styles.info}>
                    <View style={styles.card}>
                        <Image style={styles.image} source={app.appLogo} />
                    </View>
                </View>
<View>
  

и это CSS :

 card:{
    padding:0,
    borderRadius: 30,
    backgroundColor:"#fff",
    position: 'absolute',
    top: -70,
    zIndex:99,
    elevation:5
 
  },
  

Отображение на Android:

введите описание изображения здесь

Отображение на iOS:

введите описание изображения здесь

Ответ №1:

Пожалуйста, добавьте zIndex в родительский вид. В iOS zIndex не работает для вложенного parentView. Вам нужно сделать так, чтобы parentView имел высокий zIndex, а затем снова настроить Target View.

 .container {
   zIndex:101
}
.info {
   zIndex:100
}