react-native - 如何处理 safeAreaView + React Navigation？

Question

第一个屏幕截图没有应用SafeAreaView，第二个屏幕截图正在应用SafeAreaView

清楚地表明，Stack header与以前相比，这似乎很笨重。无论如何，我们可以SafeAreaView只申请底部吗？

标签： react-nativereact-navigationiphone-x

Answer 1

而不是使用SafeAreaViewfrom React-Native，使用SafeAreaViewfromreact-navigation如下：

import { SafeAreaView } from 'react-navigation';

然后您可以使用 propforceInset自定义填充，在您的情况下，

<SafeAreaView style={styles.safeArea} forceInset={{ top: 'never' }}>

有关更多信息，请查看 react-navigation 对 iPhone X 的支持