Merge pull request #50 from blyscuit/feature/#6-login-ui

[#6] [iOS] [UI] As a user, I can see Sign In screen

iosApp/.swiftlint.yml

@@ -14,7 +14,6 @@ opt_in_rules:
   - anyobject_protocol
   - array_init
   - attributes
-  - closure_body_length
   - closure_end_indentation
   - closure_spacing
   - collection_alignment
@@ -116,5 +115,5 @@ custom_rules:
   multiline_arguments_one_per_line:
     name: 'Multiline Arguments One Per Line'
     message: 'Arguments should be either on the same line, or one per line.'
-    regex: '[^\n\r]\(\n([^\(])*([^\n\r],([^\n\r])*[\w]+)([^\)])*\n(\s)*\)'
+    regex: '[^\n\r]\(\n([^\(<])*([^\n\r],([^\n\r])*[\w]+)([^\)])*\n(\s)*\)'
     severity: warning

iosApp/Survey/Configurations/Plists/Info.plist

@@ -20,6 +20,11 @@
 	<string>$(CURRENT_PROJECT_VERSION)</string>
 	<key>LSRequiresIPhoneOS</key>
 	<true/>
+	<key>UIAppFonts</key>
+	<array>
+		<string>NeuzeitSLTStd-Book.otf</string>
+		<string>NeuzeitSLTStd-BookHeavy.otf</string>
+	</array>
 	<key>UILaunchStoryboardName</key>
 	<string>LaunchScreen</string>
 	<key>UIRequiredDeviceCapabilities</key>

iosApp/Survey/Resources/Assets/Assets.xcassets/Background Blur.imageset/Contents.json

@@ -0,0 +1,15 @@
+{
+  "images" : [
+    {
+      "filename" : "Background Blur.pdf",
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  },
+  "properties" : {
+    "preserves-vector-representation" : true
+  }
+}

iosApp/Survey/Resources/Assets/Assets.xcassets/Background.imageset/Contents.json

@@ -0,0 +1,15 @@
+{
+  "images" : [
+    {
+      "filename" : "Background.pdf",
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  },
+  "properties" : {
+    "preserves-vector-representation" : true
+  }
+}

iosApp/Survey/Resources/Assets/Assets.xcassets/Logo White.imageset/Contents.json

@@ -0,0 +1,15 @@
+{
+  "images" : [
+    {
+      "filename" : "Logo White.pdf",
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  },
+  "properties" : {
+    "preserves-vector-representation" : true
+  }
+}

iosApp/Survey/Resources/Localizations/en.lproj/Localizable.strings

@@ -0,0 +1,12 @@
+/* 
+  Localizable.strings
+  Survey
+
+  Created by Bliss on 16/9/22.
+  Copyright © 2022 Nimble. All rights reserved.
+*/
+
+"login.fields.email" = "Email";
+"login.fields.password" = "Password";
+"login.button.login" = "Log in";
+"login.button.forgot" = "Forgot?";

iosApp/Survey/Sources/Application/IOSApp.swift

@@ -11,9 +11,11 @@ import SwiftUI
 
 @main
 struct IOSApp: App {
+
     var body: some Scene {
         WindowGroup {
-            ContentView()
+            LoginView()
+                .preferredColorScheme(.dark)
         }
     }
 }

iosApp/Survey/Sources/Presentation/Modules/Login/LoginView.swift

@@ -0,0 +1,101 @@
+//
+//  ContentView.swift
+//  Survey
+//
+//  Created by Bliss on 14/9/22.
+//  Copyright © 2022 Nimble. All rights reserved.
+//
+
+import SwiftUI
+
+struct LoginView: View {
+
+    @State private var email: String = ""
+    @State private var password: String = ""
+
+    var body: some View {
+        ZStack {
+            Assets.backgroundBlur
+                .image
+                .resizable()
+                .aspectRatio(contentMode: .fill)
+                .ignoresSafeArea()
+                .frame(maxWidth: .infinity, maxHeight: .infinity)
+            VStack(
+                alignment: .center,
+                spacing: 20.0
+            ) {
+                Assets.logoWhite.image
+
+                Spacer().frame(maxHeight: 70.0)
+
+                loginField
+                createPasswordField()
+                loginButton
+            }
+            .padding(.horizontal, 24.0)
+        }
+        .onTapGesture {
+            hideKeyboard()
+        }
+        .accessibilityElement(children: .contain)
+        .accessibility(.login(.view))
+    }
+
+    var loginField: some View {
+        TextField(Localize.loginFieldsEmail(), text: $email)
+            .keyboardType(.emailAddress)
+            .primaryTextField()
+            .accessibility(.login(.emailField))
+    }
+
+    var passwordField: some View {
+        HStack {
+            SecureField(Localize.loginFieldsPassword(), text: $password)
+                .accessibility(.login(.passwordField))
+            if password.isEmpty {
+                Button(Localize.loginButtonForgot()) {
+                    // TODO: Add action then press `forgot`
+                }
+                .overlayButton()
+                .accessibility(.login(.forgotButton))
+            }
+        }
+        .primaryTextField()
+        .frame(maxHeight: 56.0)
+    }
+
+    var loginButton: some View {
+        Button {
+            // TODO: Add action when press `login`
+        } label: {
+            Text(Localize.loginButtonLogin())
+                .frame(maxWidth: .infinity)
+                .primaryButton()
+                .accessibility(.login(.loginButton))
+        }
+    }
+
+    func createPasswordField() -> AnyView {
+        if #available(iOS 15.0, *) {
+            return AnyView(
+                passwordField
+                    .onSubmit {
+                        // TODO: Add action when press `return`
+                    }
+            )
+        } else {
+            return AnyView(
+                passwordField
+                    .primaryTextField()
+            )
+        }
+    }
+}
+
+struct LoginView_Previews: PreviewProvider {
+
+    static var previews: some View {
+        LoginView()
+    }
+}

iosApp/Survey/Sources/Presentation/ViewId/ViewId+General.swift

@@ -0,0 +1,15 @@
+//
+//  ViewId+General.swift
+//  Survey
+//
+//  Created by Bliss on 19/9/22.
+//  Copyright © 2022 Nimble. All rights reserved.
+//
+
+extension ViewId {
+
+    enum General: String {
+
+        case keyboard = "general.keyboard"
+    }
+}

iosApp/Survey/Sources/Presentation/ViewId/ViewId+Login.swift

@@ -0,0 +1,19 @@
+//
+//  ViewID+Login.swift
+//  Survey
+//
+//  Created by Bliss on 19/9/22.
+//  Copyright © 2022 Nimble. All rights reserved.
+//
+
+extension ViewId {
+
+    enum Login: String {
+
+        case view = "login.view"
+        case emailField = "login.email.textfield"
+        case passwordField = "login.password.textfield"
+        case forgotButton = "login.forgot.button"
+        case loginButton = "login.login.button"
+    }
+}

iosApp/Survey/Sources/Presentation/ViewId/ViewId.swift

@@ -0,0 +1,31 @@
+//
+//  ViewId.swift
+//  Survey
+//
+//  Created by Bliss on 19/9/22.
+//  Copyright © 2022 Nimble. All rights reserved.
+//
+
+import SwiftUI
+
+protocol Viewable {}
+
+enum ViewId {
+
+    case login(Login)
+    case general(General)
+
+    func callAsFunction() -> String {
+        switch self {
+        case let .login(login): return login.rawValue
+        case let .general(general): return general.rawValue
+        }
+    }
+}
+
+extension View {
+
+    func accessibility(_ viewId: ViewId) -> some View {
+        accessibilityIdentifier(viewId())
+    }
+}

iosApp/Survey/Sources/Presentation/ViewModifiers/OverlayButton.swift

@@ -0,0 +1,26 @@
+//
+//  OverlayButton.swift
+//  Survey
+//
+//  Created by Bliss on 16/9/22.
+//  Copyright © 2022 Nimble. All rights reserved.
+//
+
+import SwiftUI
+
+struct OverlayButton: ViewModifier {
+
+    func body(content: Content) -> some View {
+        content
+            .font(.regularSmall)
+            .foregroundColor(Color.white)
+            .opacity(0.5)
+    }
+}
+
+extension View {
+
+    func overlayButton() -> some View {
+        modifier(OverlayButton())
+    }
+}

iosApp/Survey/Sources/Presentation/ViewModifiers/PrimaryButton.swift

@@ -0,0 +1,28 @@
+//
+//  PrimaryButton.swift
+//  Survey
+//
+//  Created by Bliss on 16/9/22.
+//  Copyright © 2022 Nimble. All rights reserved.
+//
+
+import SwiftUI
+
+struct PrimaryButton: ViewModifier {
+
+    func body(content: Content) -> some View {
+        content
+            .font(.boldBody)
+            .padding()
+            .background(Color.white)
+            .foregroundColor(Color.black)
+            .cornerRadius(10.0)
+    }
+}
+
+extension View {
+
+    func primaryButton() -> some View {
+        modifier(PrimaryButton())
+    }
+}

iosApp/Survey/Sources/Presentation/ViewModifiers/PrimaryTextField.swift

@@ -0,0 +1,28 @@
+//
+//  PrimaryTextField.swift
+//  Survey
+//
+//  Created by Bliss on 16/9/22.
+//  Copyright © 2022 Nimble. All rights reserved.
+//
+
+import SwiftUI
+
+struct PrimaryTextField: ViewModifier {
+
+    func body(content: Content) -> some View {
+        content
+            .font(.regularBody)
+            .accentColor(Color.white)
+            .padding()
+            .background(Color.white.opacity(0.18))
+            .cornerRadius(10.0)
+    }
+}
+
+extension View {
+
+    func primaryTextField() -> some View {
+        modifier(PrimaryTextField())
+    }
+}