How to remove React Native StackNavigator inner shadow when using safeAreaView together

I use the import { SafeAreaView } from 'react-native';iPhone X for the new development, but I get a boring shadow inside the area. How to remove it?

Image here

// Code

import { SafeAreaView } from 'react-native';

<SafeAreaView style={styles.safeArea}>
 ...
</SafeAreaView>


// Style
safeArea: {
  flex: 1,
  backgroundColor: colors.background,
},

UPDATE: I found out that there was probably some conflict with StackNavigator (with headerMode: "none"). When I don't have safeAreaView code in my code, the stacks hide the title correctly.

UPDATE 2: @ Julius Malidge, this is what I am. Tks enter image description here

+4
source share
1 answer

I solved the problem using the React Navigation property:

cardStyle: {shadowColor: 'transparent'}

const Routes = StackNavigator({
  Identify: { screen: IdentifyRoutes },
}, {
  headerMode: 'none',
  cardStyle: { shadowColor: 'transparent' },
});
+6
source

Source: https://habr.com/ru/post/1692470/


All Articles