iOS: How to switch views from Login to Main Content SwiftUi

Viewed 1865

firstly I am really new to iOS development and Swift (2 weeks coming here from PHP :))

I am build a simple application, when the user Logs (Is confirmed) the view switched to the main content.

So currently I have a LoginView() and that is what loads first. I am wondering how when I click the Login button in LoginView() then the view switches to the MainContentView()

Any help would be appreciated. Thanks

LoginView() '''

import SwiftUI

struct LoginView: View {
    @State private var email: String = ""
    @State private var password: String = ""
    let verticalPaddingForForm = 40
    @State private var willMoveToNextScreen = true

    
    var body: some View {
        
        ZStack {
            Color(red: 20/225.0 ,green: 22/225.0 , blue: 25/225.0)
            
            VStack(alignment: .leading, spacing: 0) {
                Image("logo")
                    .resizable()
                    .scaledToFit()
                    .padding(.top, 150)
                    .padding()
            }
            .frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: .infinity, alignment: .topLeading)
            .ignoresSafeArea(.all)
            
            VStack(spacing: CGFloat(verticalPaddingForForm)) {
                                
                VStack {
                        TextField("Email", text: $email)
                            .padding(.horizontal, 15).padding(.top, 50)
                        Divider()
                            .padding(.horizontal, 15)
                        SecureField("Password", text: $password)
                            .padding(.horizontal, 15).padding(.top, 20)
                        Divider()
                            .padding(.horizontal, 15)

                }
                .background(Color(.white))
                
                
                Link("Forgotten Password",
                      destination: URL(string: "https://www.google.co.uk")!)
                    .foregroundColor(.blue)
                    .font(.system(size: 15))
                
                
                Button(action: {
                    
                    //Do login stuff here and if true switch view to to MainContentView
                    
                    
                }) {
                    Text("Login")
                        .padding()
                        .font(.system(size: 20))
                    
                }
                .background(Color.black)
                .foregroundColor(Color.white)
                .cornerRadius(10)
                .padding(.top, 0)
                .padding(.bottom, 20)
                
            }
            .padding(.horizontal, CGFloat(verticalPaddingForForm))
            .background(Color(.white))
            
            VStack{
                Spacer()
                Button(action: /*@START_MENU_TOKEN@*/{}/*@END_MENU_TOKEN@*/) {
                    Text("Register")
                        .padding()
                        .font(.system(size: 40))

                    
                }
                .background(Color(red: 20/225.0 ,green: 22/225.0 , blue: 25/225.0))
                .foregroundColor(Color.white)
                .cornerRadius(10)
                .padding()
            }
        }.ignoresSafeArea()
        

    };
}

'''

Below is the content view, the LoginView loads firsts and when the login button is click from above then should switch to the MainContentView() which is commented out below

ContentView: '''

import SwiftUI


struct ContentView: View {

    var body: some View {
        LoginView()
        
        //After login is confirmed in the login view, then switch from
        // LoginView to
        //MainContentView()
        
        
    }
    
}

'''

1 Answers

You can have a State in the ContentView, which decides wheather your User is logged in.

struct ContentView: View {
    @State var isLoggedIn: Bool = false

    var body: some View {
        if !isLoggedIn {
            LoginView(isLoggedIn: $isLoggedIn)
        } else {
            MainContentView()
        }
    }    
}

Then in the logging View add a Binding, and when the users successfully logged in, change that binding.

struct LoginView: View {
    @State private var email: String = ""
    @State private var password: String = ""
    let verticalPaddingForForm = 40 
    @Binding var isLoggedIn: Bool // here is the Binding

Then in the Action, toggle that Binding

Button(action: {        
    //Do login stuff here and if true switch view to to MainContentView
    isLoggedIn = true            

You could also think using some kind of Navigation Pattern and pushing to the next view.

The code above is not tested, just out of my mind

Related