SwiftUI - 在 Scrollview 的底部设置视图

问题描述 投票:0回答:1

我需要在滚动视图的底部设置页脚:

        VStack(spacing: dimensions.spacing300) {
            header
                .environment(\.mbContextTheme, .lightAlternative)
                .onTapGesture {
                    UIApplication.shared.sendAction(#selector(UIResponder.resignFirstResponder), to: nil, from: nil, for: nil)
                }
                .background(colors.neutralBg50
                    .edgesIgnoringSafeArea(.top))
            ScrollView {
                list
                Spacer()
                footer
                    .frame(height: .infinity, alignment: .bottom)
                    .onTapGesture {
                        UIApplication.shared.sendAction(#selector(UIResponder.resignFirstResponder),
                                                        to: nil,
                                                        from: nil,
                                                        for: nil)
                    }
            }
            .frame(alignment: .bottom)
        }

我尝试过使用 spacer()、geometryreader...使用 Geometry reader,页脚到达底部,但 spacer 变得太高。我需要页脚保持在屏幕的底部边框。

谢谢!!!

ios swift swiftui scrollview footer
1个回答
0
投票

为什么不将页脚放在ScrollView

之后
,位于同一个父级
VStack
内?

let loremIpsum = "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."

var body: some View {
    VStack(spacing: 0) {
        Text("header")
            .padding()
            .frame(maxWidth: .infinity)
            .background(.yellow)
        ScrollView {
            VStack {
                Text(loremIpsum).font(.title2)
                Text(loremIpsum).font(.title2)
                Text(loremIpsum).font(.title2)
                Text(loremIpsum).font(.title2)
            }
            .padding(.vertical)
        }
        Text("footer")
            .padding()
            .frame(maxWidth: .infinity)
            .background(.orange)
    }
}

Screenshot

© www.soinside.com 2019 - 2024. All rights reserved.