Swiftui 阿基特项目+；迅捷+；不同布局预览/模拟器

我无法理解为什么模拟器中的布局与xcode/preview中显示的布局不同

struct ContentView : View {
    var body: some View {
        ZStack(alignment: .bottom) {
            ARViewContainer()
            Text("hello")
        }
    }
}

以下是截图：

---

TLDR；我不知道为什么你的模拟器和预览不匹配，但我知道为什么它在设备上出现的方式。调试过程中是否出现错误

SwiftUI中的任何容器视图只会占用它们所需的空间。它们还将根据您的设置进行分发。例如，您有一个包含底部对齐的ZStack。您还有一个ARViewContainter（），它占据了堆栈的一部分。它们在

Z

轴上相互对齐，文本在前面，另一个容器在后面。一个快速的方法来证明这一点，并测试它是包括一个背景形状背后的一切，例如

var body: some View {
    ZStack {
        Rectangle().edgesIgnoringSafeArea(.all)
                   .foregroundColor(Color.red)
        //Your Views 
    }
}

这将迫使ZStack占用所有可用空间，然后其他视图应按预期对齐。基本上，您的

文本

与您的

ARViewContainer（）

进一步阅读和理解

• 除非另有规定，否则视图仅占用其中所需的空间

• zstack在

  Z

  轴上向前/向后运行

在本例中，您有一个名为ARViewContainer（）的视图，它具有设置的大小，占据屏幕的宽度和高度的一部分。因为它是您拥有的最大视图，所以ZStack继承了该大小

您的文本比ZStack小，因此ZStack不会继承大小。但是，您确实有一个

.bottom

分配。因此，您的文本位于

ARViewContainer（）

上方，并与该容器的

.bottom

边缘对齐

最后，ZStack在剩余的可用空间中居中，给人的感觉是你的

.bottom

没有做任何事情，而实际上它是

复制问题 下面是一段代码片段，它再现了您的问题，使它更清晰、更容易理解

var body: some View {
    ZStack(alignment: .bottom) {
        Rectangle().foregroundColor(Color.yellow).frame(width: 100, height: 100, alignment: .center)
        Text("Test")
    }
}