swiftui - 将视图固定到屏幕底部并忽略底部安全区域

Question

布局问题 - 如何设置视图块以扩展底部安全区域？我查看了 ignoresSafeAreas() 的各种来源，但无法达到我想要的结果。稍后，我希望能够向上扩展此视图，但要简短。如果这是有道理的。

    var body: some View {
    VStack{
        Spacer()
            HStack(alignment: .center) {
                Text ("Expand to fill bottom safe area ...?")
                    .foregroundColor(.white)
            }

        .frame(minWidth: 100, maxWidth: .infinity, minHeight: 50, maxHeight: 100)
        .background(Color.red)
        .ignoresSafeArea()
    }
}

标签： swiftui

Answer 1

选项1

放在ignoresSafeArea里面background。这将使红色延伸到设备边缘，但HStack' 的位置将保持不变。

struct ContentView: View {
    var body: some View {
        VStack{
            Spacer()
            
            HStack(alignment: .center) {
                Text ("Expand to fill bottom safe area ...?")
                    .foregroundColor(.white)
            }
            
            .frame(minWidth: 100, maxWidth: .infinity, minHeight: 50, maxHeight: 100)
            .background(Color.red.ignoresSafeArea()) /// inside `background`
        }
    }
}

选项 2

穿上ignoresSafeArea，VStack一切都会忽略安全区域。

struct ContentView: View {
    var body: some View {
        VStack{
            Spacer()
            
            HStack(alignment: .center) {
                Text ("Expand to fill bottom safe area ...?")
                    .foregroundColor(.white)
            }
            
            .frame(minWidth: 100, maxWidth: .infinity, minHeight: 50, maxHeight: 100)
            .background(Color.red)
        }
        .ignoresSafeArea() /// attached to `VStack`
    }
}

结果：

选项1	选项 2