SrollView 顶部的空间 | SwiftUI

Question

我的NavigationView 中有一个ScrollView，由于某种原因，我的视图顶部有一些空白，我无法删除它

我的代码：

struct SignUpView: View {
    
    @State var username: String = ""
    @State var email: String = ""
    @State var password: String = ""
    @State var confrim_password = ""
    
    var body: some View {
        
        NavigationView {
            
            ScrollView {
                
                VStack {
                    
                    Image("logo_transparent").resizable().scaledToFit()
                        .frame(width: 200, height: 200, alignment: .top)
                    
                    Text("Sign up") 
                        .bold()
                        .font(.system(size: 40))
                    
                    TextField("Usename", text: $username)
                        .frame(height: 45)
                        .textFieldStyle(PlainTextFieldStyle())
                        .padding([.horizontal], 4)
                        .cornerRadius(16)
                        .overlay(RoundedRectangle(cornerRadius: 16).stroke(Color.gray))
                        .padding([.horizontal], 24)
                    
                    
                    TextField("Email", text: $email)
                        .frame(height: 45)
                        .textFieldStyle(PlainTextFieldStyle())
                        .padding([.horizontal], 4)
                        .cornerRadius(16)
                        .overlay(RoundedRectangle(cornerRadius: 16).stroke(Color.gray))
                        .padding([.horizontal], 24)
                        .padding(.top, 13)
                    
                    
                    SecureField("Password", text: $password)
                        .frame(height: 45)
                        .textFieldStyle(PlainTextFieldStyle())
                        .padding([.horizontal], 4)
                        .cornerRadius(16)
                        .overlay(RoundedRectangle(cornerRadius: 16).stroke(Color.gray))
                        .padding([.horizontal], 24)
                        .padding(.top, 13)
                    
                    
                    SecureField("Confirm Password", text: $confrim_password)
                        .frame(height: 45)
                        .textFieldStyle(PlainTextFieldStyle())
                        .padding([.horizontal], 4)
                        .cornerRadius(16)
                        .overlay(RoundedRectangle(cornerRadius: 16).stroke(Color.gray))
                        .padding([.horizontal], 24)
                        .padding(.top, 13)
                        .padding(.bottom, 25)
                    
                    
                    Text("Sign up")
                        .bold()
                        .font(.system(size: 25))
                        .foregroundColor(.white)
                        .padding()
                        .frame(width: 220, height: 50)
                        .background(Color.blue)
                        .cornerRadius(40)
                    
                    
                    NavigationLink(destination:
                        LoginView().navigationBarHidden(true)) {
                        Text("Already have an account? Sing in")
                            .bold()
                            .font(.system(size: 20))
                            .padding(.bottom, 300)
                    }
                    .padding(.top, 20)
                }
                
            }
            
        }
    }
}

struct SignUpView_Previews: PreviewProvider {
    static var previews: some View {
        SignUpView()
    }
}

Answer 1

基本上是的，这是因为您的导航。尝试像这样修改您的代码。

struct SignUpView: View {
    
    @State var username: String = ""
    @State var email: String = ""
    @State var password: String = ""
    @State var confrim_password = ""
    
    var body: some View {
        
        NavigationView {
            
            ScrollView {
                
                VStack {
                    
                    Image("logo_transparent").resizable().scaledToFit()
                        .frame(width: 200, height: 200, alignment: .top)
                    
                    Text("Sign up") 
                        .bold()
                        .font(.system(size: 40))
                    
                    TextField("Usename", text: $username)
                        .frame(height: 45)
                        .textFieldStyle(PlainTextFieldStyle())
                        .padding([.horizontal], 4)
                        .cornerRadius(16)
                        .overlay(RoundedRectangle(cornerRadius: 16).stroke(Color.gray))
                        .padding([.horizontal], 24)
                    
                    
                    TextField("Email", text: $email)
                        .frame(height: 45)
                        .textFieldStyle(PlainTextFieldStyle())
                        .padding([.horizontal], 4)
                        .cornerRadius(16)
                        .overlay(RoundedRectangle(cornerRadius: 16).stroke(Color.gray))
                        .padding([.horizontal], 24)
                        .padding(.top, 13)
                    
                    
                    SecureField("Password", text: $password)
                        .frame(height: 45)
                        .textFieldStyle(PlainTextFieldStyle())
                        .padding([.horizontal], 4)
                        .cornerRadius(16)
                        .overlay(RoundedRectangle(cornerRadius: 16).stroke(Color.gray))
                        .padding([.horizontal], 24)
                        .padding(.top, 13)
                    
                    
                    SecureField("Confirm Password", text: $confrim_password)
                        .frame(height: 45)
                        .textFieldStyle(PlainTextFieldStyle())
                        .padding([.horizontal], 4)
                        .cornerRadius(16)
                        .overlay(RoundedRectangle(cornerRadius: 16).stroke(Color.gray))
                        .padding([.horizontal], 24)
                        .padding(.top, 13)
                        .padding(.bottom, 25)
                    
                    
                    Text("Sign up")
                        .bold()
                        .font(.system(size: 25))
                        .foregroundColor(.white)
                        .padding()
                        .frame(width: 220, height: 50)
                        .background(Color.blue)
                        .cornerRadius(40)
                    
                    
                    NavigationLink(destination:
                        LoginView().navigationBarHidden(true)) {
                        Text("Already have an account? Sing in")
                            .bold()
                            .font(.system(size: 20))
                            .padding(.bottom, 300)
                    }
                    .padding(.top, 20)
                }
                
            }
            
        } 

//我建议在下面包含这段代码。

.navigationBarHidden(true)

//如果仍然没有帮助，我建议将下面的代码与上面的代码一起使用，所以在结果中，它将是这样的。

.navigationBarHidden(true)
    .edgesIgnoringSafeArea(all)

    }
}

struct SignUpView_Previews: PreviewProvider {
    static var previews: some View {
        SignUpView()
    }
}

如果这些选项都不起作用，请尝试减少导航链接填充它可能会起作用。

Answer 2

这是因为你的 NavigationView 请尝试

.navigationBarHidden(true)

Answer 3

您遇到此问题是因为您的导航栏没有隐藏。

SwiftUI 要求您还设置.navigationBarTitle 以使.navigationBarHidden 正常工作。

所以，就用这个吧，

struct SignUpView: View {
   
    var body: some View {

       NavigationView {
           //your rest of the code
        .navigationBarTitle("")
        .navigationBarHidden(true)
       }

    }
}