SwiftUI vertical ScrollView 弹回并且不显示其中的所有视图

Question

我正在处理一个布局与此类似的项目，我在 VStack 中堆叠了一些视图，在底部有一个按钮，所有这些都嵌入在滚动视图中。正如您在图片中看到的那样，滚动视图弹回并且不显示按钮。

var body: some View {
    VStack {
        Rectangle()
            .fill(Color.green)
            .frame(height: 300)
        Spacer()
        ScrollView {
            RectanglesView()
            Button(action: /*@START_MENU_TOKEN@*/{}/*@END_MENU_TOKEN@*/) {
                Text("Click me")
            }
            .offset(y: 50)
            .frame(width: 300)
            
        }
    }.edgesIgnoringSafeArea(.all)
}

我认为问题是由于按钮的偏移引起的，因为如果我将其移除它会正常运行，但我不想丢失按钮的位置。

Answer 1

像这样在 VStack 中添加填充而不是偏移（下面稍微修改了代码）

    var body: some View {
    ZStack{
        VStack {
            Rectangle()
                .fill(Color.green)
                .frame(height: 300)
            Spacer()
            ScrollView {
                VStack{
                Rectangle()
                    .fill(Color.red)
                    .frame(height: 300)
                Rectangle()
                    .fill(Color.yellow)
                    .frame(height: 300)
                Button(action: /*@START_MENU_TOKEN@*/{}/*@END_MENU_TOKEN@*/) {
                    Text("Click me")
                    }.padding() //instead of offset
                .frame(width: 300)
                }.frame(alignment: .leading)
                
            }
        }.edgesIgnoringSafeArea(.all)
    }
}

Answer 2

您尝试过将 Button 移出 ScrollView() 吗？

看起来是这样的：

struct ContentView: View {
   var body: some View {
        VStack {
            Rectangle()
                .fill(Color.green)
                .frame(height: 300)
            Spacer()
            ScrollView(.vertical) {
                Rectangle().fill(Color.red).frame(width: 400, height: 200)
                Rectangle().fill(Color.blue).frame(width: 400, height: 200)
                Rectangle().fill(Color.yellow).frame(width: 400, height: 200)
                 Rectangle().fill(Color.green).frame(width: 400, height: 200)
            }
            
            
            Button(action: /*@START_MENU_TOKEN@*/{}/*@END_MENU_TOKEN@*/) {
                Text("Click me")
                    .font(.headline)
                           }
        }.edgesIgnoringSafeArea(.all)
    }

}

SwiftUI vertical ScrollView 弹回并且不显示其中的所有视图

SwiftUI vertical ScrollView springs back up and doesn't show all the views within it

iphone

scrollview

ios

swift

swiftui