一起使用safeAreaView时如何去除React Native StackNavigator的内部阴影答案

【问题标题】：How to remove internal shadow of React Native StackNavigator when using safeAreaView together一起使用safeAreaView时如何去除React Native StackNavigator的内部阴影
【发布时间】：2018-01-20 22:51:30
【问题描述】：

我正在使用import { SafeAreaView } from 'react-native'; 进行新的 iPhone X 开发，但我在该区域内得到了一个无聊的阴影。如何删除它？

The image is here

// Code

import { SafeAreaView } from 'react-native';

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


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

更新：我发现这可能与 StackNavigator 存在某种冲突（使用 headerMode: 'none'）。当我的代码中没有 safeAreaView 时，正确堆栈隐藏标题。

更新 2： @Julien Malige，这就是我的重点。 Tks

【问题讨论】：

您是否尝试过在safeArea 样式对象中将shadowOpacity 设置为0？
我会试试的！但我认为我的主要问题是在与那个问题斗争之后，是 stackNavigator...我将它设置为 headerMode: 'none'。当我在没有 safeAreaView 的情况下尝试时，一切正常，但是当 safeAreaView 存在时，headerMode: 'none' 停止隐藏标题。
SafeAreaView 上的 shadowOpacity 没有任何变化
与问题无关：backgroundColor: colors.background, 的事情你是怎么做的？
没关系找到它...github.com/spencercarli/react-native-meteor-boilerplate/blob/…

标签： react-native shadow iphone-x

【解决方案1】：

我使用 React Navigation 属性解决了这个问题：

cardStyle: { shadowColor: '透明' }

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

【讨论】：

非常感谢，这让我困惑了好几天:)！
是的！干净的方式来做到这一点