Expo React Native的状态栏/安全区问题

ig9co6j1 于 6个月前发布在 React

关注(0)|答案(1)|浏览(108)

我在屏幕上使用SafeAreaView，它表现正常：

安全区域的背景颜色与屏幕的其他部分相同
内容只是简单地填充在安全区域内，就像它应该是。

然后我添加了路由器为我的导航：

一开始还好
但是当我开始使用headers -> 'headerShown：true/false'时，从那以后：
SafeAreaView开始在安全区域的顶部添加额外的插入层（双填充）

safeareaview with additional (double) padding

然后我删除了SafeAreaView，现在它会自动在安全区域内插入
我假设安全区域已集成到路由器中
但是，我现在无法自定义安全区
它们总是白色的，我不能摆脱它们或改变背景的颜色，以很好地与我的内容（我的屏幕的其余部分）合并
我使用的是状态栏，但它确实有助于它的风格无论如何，只要切换状态栏信息是否隐藏或不
safeareaview removed, status bar persists的

这个问题在iOS和Android上都存在。我想强调这个事实，它在iOS和Android上都存在。
请帮帮忙，已经挣扎了一段时间了。

react-native

来源：https://stackoverflow.com/questions/76902587/status-bar-safearea-issue-with-expo-react-native

1条答案

按热度按时间

6xfqseft1#

我在这里遇到了同样的问题，我通过在我的根布局文件（_layout）的screenOptions中将header设置为null而不是将headerShown设置为false来解决它。
以前，它是这样的：<Stack screenOptions={{ headerShown: false }} />和有双填充。现在，它是这样的：<Stack screenOptions={{ header: () => null }} />和额外的填充消失了。
我的根布局文件

import { Stack } from "expo-router";
import { StyleSheet } from "react-native";
import { SafeAreaView } from "react-native-safe-area-context";

export default function RootLayout() {
    return (
        <SafeAreaView style={styles.container}>
            <Stack screenOptions={{ header: () => null }} />
        </SafeAreaView>

    );
}

const styles = StyleSheet.create({
    container: {
        flex: 1
    }
})

字符串
我的根索引文件

import { Redirect } from 'expo-router';

export default function Page() {
    return <Redirect href={"/(drawer)/home"} />;
}

型

赞(0）回复(0）举报 6个月前

我来回答

Expo React Native的状态栏/安全区问题

1条答案

相关问题

热门标签

最新问答