如何在 SwiftUI 中创建粘性底部？

Question

我正在尝试在 swiftUI 中创建粘性页脚，其中屏幕的其他部分是可滚动的，但在页脚中有一个带有按钮的视图和其他应该修复的元素。

谢谢你的帮助。

Answer 1

如果我理解正确的话，你想做的是垂直堆叠（VStack）

1. 滚动视图
2. 另一个 VStack（带有切换按钮和按钮），在底部对齐：

VStack {
        ScrollView {...} // 1
        VStack {         // 2
             Toggle(...)
             Button(...)
        }
        .frame(alignment: .bottom)
}

以你的例子为例：

struct SwiftUIView: View {
    @State private var checked: Bool = false
    let text = String(repeating: "blabla ", count: 20)
    
    var body: some View {
        VStack {
            ScrollView {
                ForEach((1...100), id: \.self) {_ in
                    Text(text)
                }
            }
            
            VStack {
                Toggle(isOn: $checked, label: {
                    Text("I have read...")
                })
                Button("Enter") {
                    // action
                }
                .frame(maxWidth: .infinity)
                .padding(.vertical)
                .background(Color.red)
            }
            .padding()
            .border(Color.black)
            .frame(alignment: .bottom)
        }
    }
}