Swift UI：如何让带Overlay的Z-Stack自适应子视图高度？

问题出在Color.clear上——SwiftUI中Color类型的视图默认会尽可能占据父视图的可用空间，哪怕是透明的clear也不例外。这就导致你的ZStack被拉伸到了屏幕高度。

要实现ZStack仅包裹子视图高度的效果，直接移除Color.clear，给每个Text添加frame(maxWidth: .infinity)来让它们在固定宽度的ZStack内分别对齐左右：

ZStack {
    Text("Hello1")
        .frame(maxWidth: .infinity, alignment: .trailing)
    Text("Hello2")
        .frame(maxWidth: .infinity, alignment: .leading)
}
.frame(width: 300)
.background(.red)

原理说明 #

• frame(maxWidth: .infinity)让每个Text占据ZStack的全部宽度，同时通过alignment参数指定文本的对齐方向。
• ZStack的高度会自动取两个Text的最大高度（此处两个文本高度一致），实现了“包裹子视图”的效果。
• 固定宽度300保留了你原本的需求，背景红色也只会覆盖ZStack的实际尺寸。

内容的提问来源于stack exchange，提问作者Sarthak Mishra