Swift ScrollView goes on top again

Question

I have a simple screen in which content are going on bottom so I use ScrollView on it issue is when I release scroll its going to top again. I need to replace scrollview to something Because I try with with List but that's not working properly with background image so I use Scrollview

struct signupView: View {
    @StateObject var signUpViewModel = signupViewModel()
    
    var body: some View {
        ZStack{
            GeometryReader { geo in
                ScrollView {
                    VStack{
                        VStack{
                            Image("Untitled-2")
                                .resizable()
                                .frame(width: geo.size.width * 0.45, height: geo.size.width * 0.45)
                            
                        }
                        .padding(.top, geo.size.height * 0.03)
                        
                        
                        HStack(spacing: 0){
                            VStack{
                                Text("Student")
                                    .foregroundColor(signUpViewModel.isStudent ? Color("secondarycolor") : Color("authColorText"))
                                Rectangle()
                                    .fill(signUpViewModel.isStudent ? Color("secondarycolor") : Color("authColorText"))
                                    .frame(width: geo.size.width * 0.4, height: 2)
                                
                            }
                            .onTapGesture {
                                signUpViewModel.isStudent = true
                            }
                            
                            VStack{
                                Text("Facilitator")
                                    .foregroundColor(!signUpViewModel.isStudent ? Color("secondarycolor") : Color("authColorText"))
                                
                                Rectangle()
                                    .fill(!signUpViewModel.isStudent ? Color("secondarycolor") : Color("authColorText"))
                                    .frame(width: geo.size.width * 0.4, height: 2)
                                
                            }
                            .onTapGesture {
                                signUpViewModel.isStudent = false
                            }
                        }
                        
                        VStack{
                            VStack{
                                Spacer().frame(height: geo.size.height * 0.7)
                                
                                TextField("", text: $signUpViewModel.nameField)
                                
                                    .modifier(PlaceholderStyle(showPlaceHolder: signUpViewModel.nameField.isEmpty,
                                                               placeholder: "Name"))
                                
                                    .padding()
                                    .background(RoundedRectangle(cornerRadius: 50).fill(Color("primarycolorwithopacity")))
                                    .foregroundColor(Color("authColorText"))
                                    .foregroundColor(Color("authColorText")).font(Font.headline.weight(.medium))
                                    .padding(.bottom, 10)
                                
                                TextField("", text: $signUpViewModel.emailField)
                                
                                    .modifier(PlaceholderStyle(showPlaceHolder: signUpViewModel.emailField.isEmpty,
                                                               placeholder: "Email"))
                                
                                    .padding()
                                    .background(RoundedRectangle(cornerRadius: 50).fill(Color("primarycolorwithopacity")))
                                    .foregroundColor(Color("authColorText"))
                                    .foregroundColor(Color("authColorText")).font(Font.headline.weight(.medium))
                                    .padding(.bottom, 10)
                                
                                SecureField("", text: $signUpViewModel.passwordField)
                                
                                    .modifier(PlaceholderStyle(showPlaceHolder: signUpViewModel.passwordField.isEmpty,
                                                               placeholder: "Password"))
                                
                                    .padding()
                                    .background(RoundedRectangle(cornerRadius: 50).fill(Color("primarycolorwithopacity")))
                                    .foregroundColor(Color("authColorText"))
                                    .foregroundColor(Color("authColorText")).font(Font.headline.weight(.medium))
                                    .padding(.bottom, 10)
                                
                                SecureField("", text: $signUpViewModel.passwordRepeatField)
                                
                                    .modifier(PlaceholderStyle(showPlaceHolder: signUpViewModel.passwordRepeatField.isEmpty,
                                                               placeholder: "Repeat Password"))
                                
                                    .padding()
                                    .background(RoundedRectangle(cornerRadius: 50).fill(Color("primarycolorwithopacity")))
                                    .foregroundColor(Color("authColorText"))
                                    .foregroundColor(Color("authColorText")).font(Font.headline.weight(.medium))
                                    .padding(.bottom, 10)
                                
                                
                                TextField("", text: $signUpViewModel.countryField)
                                
                                    .modifier(PlaceholderStyle(showPlaceHolder: signUpViewModel.countryField.isEmpty,
                                                               placeholder: "Select Country"))
                                    .padding()
                                    .background(RoundedRectangle(cornerRadius: 50).fill(Color.black))
                                    .foregroundColor(Color("authColorText"))
                                    .foregroundColor(Color("authColorText")).font(Font.headline.weight(.medium))
                                    .padding(.bottom, 10)
                                    .overlay(
                                        
                                        ZStack{if signUpViewModel.hasOptions {
                                            Spacer().frame(height: 70)
                                            
                                            VStack(alignment: .center) {
                                                
                                                ForEach(signUpViewModel.countryoptions, id: \.self) {d in
                                                    Text(d).frame(maxWidth: .infinity).padding(8).onTapGesture {
                                                        signUpViewModel.countryField = d
                                                        signUpViewModel.hasOptions = false
                                                    }
                                                    Divider()
                                                }
                                                
                                            }.frame(maxWidth: .infinity).background(RoundedRectangle(cornerRadius: 6).foregroundColor(.white).shadow(radius: 4))
                                        }
                                            
                                            
                                            
                                        }.offset(y: 50)
                                        
                                        , alignment: .topLeading)
                                    .overlay(
                                        
                                        Image("Untitled-42")
                                            .resizable()
                                            .foregroundColor(.white)
                                            .frame(width: 15, height: 10).padding().padding(.bottom,2).onTapGesture {
                                                
                                                signUpViewModel.hasOptions = !signUpViewModel.hasOptions
                                                
                                            }
                                        
                                        , alignment: .trailing).zIndex(1)
                                
                                SecureField("", text: $signUpViewModel.passwordRepeatField)
                                
                                    .modifier(PlaceholderStyle(showPlaceHolder: signUpViewModel.passwordRepeatField.isEmpty,
                                                               placeholder: "Repeat Password"))
                                
                                    .padding()
                                    .background(RoundedRectangle(cornerRadius: 50).fill(Color("primarycolorwithopacity")))
                                    .foregroundColor(Color("authColorText"))
                                    .foregroundColor(Color("authColorText")).font(Font.headline.weight(.medium))
                                    .padding(.bottom, 10)
                                
                                
                            }.padding([.top, .leading, .trailing], 8).frame(height: 45)
                            
                            
                        }
                        
                    }
                    .padding()
                }
                
            }
            
        }.background(Image("Untitled-7").resizable()).edgesIgnoringSafeArea(.all)
    }
    
    
}

When I release its going back to top. Don't get it why its happening on this. Or I need to use something else

Answer 1

One way of doing it is with introspect package, you can add the package here https://github.com/siteline/SwiftUI-Introspect.git

scrollView.bounces = false

Here's how I would do it with Introspect:

struct ContentView: View {
var body: some View {
    ScrollView {
        VStack {
            Image(systemName: "globe")
                .imageScale(.large)
                .foregroundColor(.accentColor)
            Text("Hello, world!")
        }
        .padding()
    }.introspectScrollView { scrollView in
        scrollView.bounces = false
    }
}

}

also don't forget the imports

import Introspect