如何在忽略它的同时处理 SwiftUI 中的安全区域空间答案

【问题标题】：How to Handle Safe Area Space in SwiftUI While Ignoring It如何在忽略它的同时处理 SwiftUI 中的安全区域空间
【发布时间】：2021-01-30 09:09:57
【问题描述】：

我想为我的应用程序的背景完全着色，同时将内容定位在顶部，以便它离状态栏足够远，并且在那些拥有它的设备上处于一流水平。

如果我这样做：

@main
struct SampleApp: App {
    var body: some Scene {
        WindowGroup {
            VStack {
                Text("Top of my view")
                Spacer()
            }
            .frame(maxWidth: .infinity, maxHeight: .infinity)
            .background(Color.yellow)
        }
    }
}

这会在安全区域下方的内容顶部显示文本。但只有内容区域是黄色的。安全区域为白色。

所以我在.background 修饰符下面添加.edgesIgnoringSafeAreas(.all)。

现在我的文字在缺口下方（或在屏幕顶部的状态栏文字下方）并且不可见。

我不想随意猜测顶部填充，因为这在有凹槽的手机上可能没问题，但在没有通知的手机或 iPad 上看起来就错了。

如果我将 VStack 放在 GeometryReader 内，则在忽略顶部安全区域时，reader.safeAreaInsets.top 为零 (0)。

我希望这是一个足够清楚的问题。有没有人遇到过这个问题并有解决方案？

【问题讨论】：

@vacawama background 将被限制为 VStack 宽度，因此在这种情况下可能需要 frame。

标签： swiftui safearealayoutguide

【解决方案1】：

您只需将edgesIgnoringSafeArea 修饰符应用于Color.yellow。

一个可能的解决方案是使用ZStack:

@main
struct SampleApp: App {
    var body: some Scene {
        WindowGroup {
            ZStack {
                Color.yellow
                    .edgesIgnoringSafeArea(.all)
                VStack {
                    Text("Top of my view")
                    Spacer()
                }
            }
        }
    }
}

【讨论】：

有效。我从来没有想过这样做。谢谢。
@P.Ent 不客气 :) 如果您认为我们的回答有助于解决您的问题，您可以接受其中之一，这样其他人就知道您的问题已解决。

【解决方案2】：

修复它的一种方法是将.edgesIgnoringSafeArea(.all) 仅应用于.background() 内部的Color.yellow：

@main
struct SampleApp: App {
    var body: some Scene {
        WindowGroup {
            VStack {
                Text("Top of my view")
                Spacer()
            }
            .frame(maxWidth: .infinity, maxHeight: .infinity)
            .background(Color.yellow.edgesIgnoringSafeArea(.all))
        }
    }
}

【讨论】：

这也有效。也从未想过这样做。