swift - 在 ScrollView 中居中并对齐 SwiftUI 元素

Question

我有以下 SwiftUI View :

import SwiftUI

struct MySwiftUIView: View {
    var body: some View {
        VStack {
            HStack {
                Text("top leading text")
                Spacer()
            }
            Spacer()
            HStack {
                Spacer()
                Text("centered text")
                Spacer()
            }
            Spacer()
            HStack {
                Spacer()
                Text("bottom trailing text")
            }
        }
    }
}

运行时看起来像这样:



如果我将 View 嵌入到这样的 ScrollView 中:

import SwiftUI

struct MySwiftUIView: View {
    var body: some View {
        ScrollView {
            VStack {
                HStack {
                    Text("top leading text")
                    Spacer()
                }
                Spacer()
                HStack {
                    Spacer()
                    Text("centered text")
                    Spacer()
                }
                Spacer()
                HStack {
                    Spacer()
                    Text("bottom trailing text")
                }
            }
        }
    }
}

然后运行时看起来像这样:



当它们嵌入 ScrollView 时，如何使居中的文本居中，底部的尾随文本位于底部？

在某种程度上，我想使用 SwiftUI 来复制在 Xcode 的检查器中看到的这种滚动行为，其中文本“Not Applicable”居中且可滚动:

Answer 1

将 ScrollView 包裹在 GeometryReader 中。然后将最小高度应用于等于 geometry.size.height 的滚动 View 。现在你应用的垫片应该按照你想要的方式填充 VStack。试试下面的代码:

GeometryReader { geometry in
    ScrollView(.vertical) {
        VStack {
            HStack {
                Text("top leading text")
                Spacer()
            }
            Spacer()
            HStack {
                Text("centered text")
            }
            Spacer()
            HStack(alignment: .bottom) {
                Spacer()
                Text("bottom trailing text")
            }
         }
         .padding()
         .frame(width: geometry.size.width)
         .frame(minHeight: geometry.size.height)

    }
}

另请查看此帖子以获取有关此问题的更多讨论: SwiftUI - Vertical Centering Content inside Scrollview