SwiftUI-ScrollView不会因为填充中的负值而滚动到底部

时间:2020-05-26 16:13:33

标签: uiscrollview swiftui

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

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

看起来内容大小是错误的:

enter image description here

这里是我的代码为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)
            }
        }
    }
}

1 个答案:

答案 0 :(得分:2)

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

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

demo1 demo2

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