SwiftUI - 由于填充中的负值，ScrollView 不会滚动到底部

Question

我不知道滚动视图内容大小或偏移量有问题。

当我尝试滚动视图时，它会返回并停留在顶部，但正如您所见，我在屏幕底部有按钮，并且想要滚动到视图底部以查看整个 NEXT 按钮。

看起来内容大小有误：

这是我的代码https://github.com/matrosovDev/swiftui的回购

有一个 WelcomeView 组件，其中包含所有代码，但我也会将其复制粘贴在这里，可能使用负值填充或偏移会导致此滚动视图内容大小或偏移问题：

struct WelcomeView: View {

    @State private var password = ""
    @State var showWelcomeView = false
    @State var showActivityIndicator = false

    @EnvironmentObject var userService: UserService

    var body: some View {

        ZStack {
            Color.customLightGray
            if self.showActivityIndicator {
                VStack {
                    HStack {
                        Spacer()
                        LottieView(named: "19451-blue-preloader",
                                   loop: self.showActivityIndicator,
                                   size: 200
                        )
                        Spacer()
                    }
                }
            } else {

                ScrollView {

                    VStack {
                        Image("MountainWelcomBackground").resizable().frame(height: 300)

                        CircleImage(image: userService.user.image)
                            .padding(.top, -150)
                            .frame(height: 140)
                            .frame(width: 140)

                        VStack(alignment: .leading) {
                            HStack(alignment: .top) {
                                Spacer()
                                Text(userService.user.username)
                                    .font(.headline)
                                Spacer()
                            }
                        }
                        .padding(.top, -70)

                        VStack (alignment: .leading, spacing: 10) {

                            Text("Password:")
                                .font(.headline)

                            TextField("Enter your password", text: $password)
                                .padding(.all)
                                .font(Font.system(size: 18, weight: .medium, design: .rounded))
                                .overlay(RoundedRectangle(cornerRadius: 8).stroke(Color.customCorporateBlue, lineWidth: 1))
                                .foregroundColor(Color.customCorporateBlue)
                                .keyboardType(.emailAddress)
                                .autocapitalization(.none)

                            Button(action: {
                            }) {
                                Text("Forgot password?")
                                    .fontWeight(.bold)
                                    .font(.headline)
                                    .padding(EdgeInsets(top: 20, leading: 10, bottom: 20, trailing: 0))
                                    .foregroundColor(.customCorporateBlue)
                            }

                            HStack {
                                Button(action: {
                                }) {
                                    Text("Create account")
                                        .fontWeight(.bold)
                                        .font(.subheadline)
                                        .padding()
                                        .foregroundColor(.customCorporateBlue)
                                }

                                Spacer()

                                Button(action: {
                                    //self.showActivityIndicator.toggle()
                                    //self.fetchUser(with: self.email)
                                }) {
                                    Text("Next")
                                        .fontWeight(.bold)
                                        .font(.title)
                                        .padding(EdgeInsets(top: 20, leading: 40, bottom: 20, trailing: 40))
                                        .background(Color.customCorporateBlue)
                                        .cornerRadius(8)
                                        .foregroundColor(.white)
                                }

                                //NavigationLink(destination: WelcomeView(), isActive: $showWelcomeView) { EmptyView() }
                            }

                        }.padding(.horizontal, 30)
                            .modifier(AdaptsToKeyboard())
                            .padding(.top, -20)

                        Spacer()
                    }

                }.edgesIgnoringSafeArea(.top)
            }
        }
    }
}

Answer 1

这是由于许多硬编码会影响不同手机的布局。对于这个特定的用例，我会推荐以下简单的解决方案。

使用部分复制的代码进行测试（Xcode 11.4 / iOS 13.4 / iPhone8 / 11 Max）

// make height of top image relative to available screen space
VStack {
    Image("MountainWelcomBackground")
       .resizable()
       .frame(height: UIScreen.main.bounds.size.height / 3.0)