SwiftUI How to build a Login Screen

SwiftUI How to build a Login Screen

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88

// //  ContentView.swift //  Testapp // //  Created by Cairocoders //   import SwiftUI   struct ContentView: View {           @State private var email = ""     @State private var password = ""           var body: some View {         VStack() {             Text("Login")                 .font(.largeTitle).foregroundColor(Color.white)                 .padding([.top, .bottom], 40)                 .shadow(radius: 10.0, x: 20, y: 10)                           Image("login")                 .resizable()                 .frame(width: 250, height: 250)                 .clipShape(Circle())                 .overlay(Circle().stroke(Color.white, lineWidth: 4))                 .shadow(radius: 10.0, x: 20, y: 10)                 .padding(.bottom, 50)                           VStack(alignment: .leading, spacing: 15) {                 TextField("Email", text: self.$email)                     .padding()                     .background(Color.themeTextField)                     .cornerRadius(10.0)                     .shadow(radius: 10.0, x: 20, y: 10)                                   SecureField("Password", text: self.$password)                     .padding()                     .background(Color.themeTextField)                     .cornerRadius(10.0)                     .shadow(radius: 10.0, x: 20, y: 10)             }.padding([.leading, .trailing], 27.5)                           Button(action: Submit) {                 Text("Sign In")                     .font(.headline)                     .foregroundColor(.white)                     .padding()                     .frame(width: 300, height: 50)                     .background(Color.blue)                     .cornerRadius(15.0)                     .shadow(radius: 10.0, x: 20, y: 10)             }.padding(.top, 50)                                         Spacer()             HStack(spacing: 0) {                 Text("Don't have an account? ")                 Button(action: {}) {                     Text("Sign Up")                         .foregroundColor(.black)                 }             }         }         .background(             LinearGradient(gradient: Gradient(colors: [.yellow, .orange]), startPoint: .top, endPoint: .bottom)                 .edgesIgnoringSafeArea(.all))               }           func Submit() {         print("Successfully Login")         print(self.$email)         print(self.$password)     } }   struct ContentView_Previews: PreviewProvider {     static var previews: some View {         ContentView()     } }   extension Color {     static var themeTextField: Color {         return Color(red: 220.0/255.0, green: 230.0/255.0, blue: 230.0/255.0, opacity: 1.0)     } }