iOS 上的 React 导航标题填充问题 – 堆栈和选项卡导航中标题顶部的额外空间

Question

在 React Native 中，我使用以下依赖项：

"react-native": "^0.74.0",
"@react-navigation/bottom-tabs": "^6.6.1",
"@react-navigation/drawer": "^6.7.2",
"@react-navigation/native": "^6.0.8",
"@react-navigation/stack": "^6.3.21"
"@rneui/base": "^4.0.0-rc.8",
"@rneui/themed": "^4.0.0-rc.8",
"react-native-safe-area-context": "^4.10.5",
"react-native-screens": "^3.34.0",

在堆栈和选项卡导航中，当我设置标题时，它会在标题栏的顶部创建一个空白区域（如 paddingTop）。可能出什么问题了？有人遇到过类似问题吗

Answer 1

在 iOS 的 React Native 中，我们使用 SafeAreaView 组件来调整视图。

SafeAreaView 渲染嵌套内容并自动应用填充来反映视图中未被导航栏、选项卡栏、工具栏和其他祖先视图覆盖的部分。