首页 > 解决方案 > 带有灵活 Spacer 的 SwiftUI VStack

问题描述

我有一个简单VStack的顶部视图和底部多行文本。文本可以更新其内容,因此它会根据它的行数调整大小。发生这种情况时,顶部的视图也会调整其位置 - 向上或向下移动。

我希望顶视图保持固定的垂直位置,独立于VStack. 在我看来,这就是Spacer目的,因为它们很灵活。然而,这并不是诀窍。

struct ContentView: View {
    var body: some View {
        VStack {
            HStack("Some Icons")
            Spacer()
            Text("Multiline Text")
        }
    }
}

标签: swiftuivstack

解决方案


您可以将其包装在ZStack

struct ContentView: View {
    var body: some View {
        ZStack {
            VStack {
                Text("top view")
                Spacer()
            }
            VStack {
                Spacer()
                Text("bottom view")
            }
        }
    }
}

这样,第一个中的所有内容VStack都不会相对于第二个移动VStack


或者,您可以继续使用 aVStack但将其子视图包装在单独VStack的 s 中:

struct ContentView: View {
    var body: some View {
        VStack {
            VStack {
                Text("top view")
                Spacer()
            }
            VStack {
                Spacer()
                Text("bottom view")
            }
        }
    }
}

推荐阅读