Monday, October 18, 2021

Hide shadow or margin under react native header

 In old <5 react native you could just hide using shadowOpacity (iOS) or elevation (Android). This is not anymore valid in React >= 6.

For this you need to use headerShadowVisible for both iOS and Android.


An example is below:

<Stack.Navigator screenOptions={{
        headerStyle: {
            backgroundColor: Colors.light.tint,
            
        },
        headerShadowVisible: false,
        headerTintColor: Colors.light.background,
        headerTitleAlign: "left",
        headerTitleStyle: {
            fontWeight: 'bold',
        }
    }}>

No comments:

Post a Comment