✅[CHORE] 2차 과제 UI 구성 완료(#4)

29th-WE-SOPT-iOS-Part · Oct 12, 2021 · 6dab4ff · 6dab4ff
1 parent daaed8c
commit 6dab4ff
Show file tree

Hide file tree

Showing 6 changed files with 246 additions and 137 deletions.
diff --git a/29th-iOS-Assignment/29th-iOS-Assignment/Assets.xcassets/Google.imageset/Contents.json b/29th-iOS-Assignment/29th-iOS-Assignment/Assets.xcassets/Google.imageset/Contents.json
@@ -0,0 +1,21 @@
+{
+  "images" : [
+    {
+      "filename" : "Google.png",
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}
diff --git a/29th-iOS-Assignment/29th-iOS-Assignment/Assets.xcassets/Google.imageset/Google.png b/29th-iOS-Assignment/29th-iOS-Assignment/Assets.xcassets/Google.imageset/Google.png
diff --git a/29th-iOS-Assignment/29th-iOS-Assignment/Storyboards/Base.lproj/Main.storyboard b/29th-iOS-Assignment/29th-iOS-Assignment/Storyboards/Base.lproj/Main.storyboard
diff --git a/29th-iOS-Assignment/29th-iOS-Assignment/ViewControllers/LoginViewController.swift b/29th-iOS-Assignment/29th-iOS-Assignment/ViewControllers/LoginViewController.swift
@@ -7,36 +7,96 @@
 
 import UIKit
 
+import SnapKit
+
 class LoginViewController: UIViewController {
 
     // MARK: - Properties
+    @IBOutlet weak var logoImageView: UIImageView!
+    @IBOutlet weak var titleLabel: UILabel!
+    @IBOutlet weak var subLabel: UILabel!
     @IBOutlet weak var nameTextField: UITextField!
     @IBOutlet weak var emailTextField: UITextField!
     @IBOutlet weak var pwTextField: UITextField!
+    @IBOutlet weak var signUpButton: UIButton!
     @IBOutlet weak var nextButton: UIButton!
 
     // MARK: - Life Cycle
     override func viewDidLoad() {
         super.viewDidLoad()
 
         configUI()
+        setupLayout()
         setupAddTarget()
         hideKeyboardWhenTappedAround()
     }
 
     // MARK: - Custom Method
+    func configUI() {
+        /// 초기 다음버튼 비활성화
+        nextButton.isEnabled = false
+
+        logoImageView.image = UIImage(named: "Google")
+
+        subLabel.text = "Youtube도 이동하면서 계속하세요.\n앱 및 safari에서도 Google 서비스에 로그인됩니다."
+    }
+
+    func setupLayout() {
+        logoImageView.snp.makeConstraints { make in
+            make.top.equalToSuperview().offset(100)
+            make.centerX.equalToSuperview()
+            make.width.equalTo(117)
+            make.height.equalTo(40)
+        }
+
+        titleLabel.snp.makeConstraints { make in
+            make.top.equalTo(logoImageView.snp.bottom).offset(14)
+            make.centerX.equalToSuperview()
+        }
+
+        subLabel.snp.makeConstraints { make in
+            make.top.equalTo(titleLabel.snp.bottom).offset(14)
+            make.centerX.equalToSuperview()
+        }
+
+        nameTextField.snp.makeConstraints { make in
+            make.top.equalTo(subLabel.snp.bottom).offset(68)
+            make.leading.trailing.equalToSuperview().inset(22)
+            make.height.equalTo(50)
+        }
+
+        emailTextField.snp.makeConstraints { make in
+            make.top.equalTo(nameTextField.snp.bottom).offset(17)
+            make.leading.trailing.equalToSuperview().inset(22)
+            make.height.equalTo(50)
+        }
+
+        pwTextField.snp.makeConstraints { make in
+            make.top.equalTo(emailTextField.snp.bottom).offset(17)
+            make.leading.trailing.equalToSuperview().inset(22)
+            make.height.equalTo(50)
+        }
+
+        signUpButton.snp.makeConstraints { make in
+            make.top.equalTo(pwTextField.snp.bottom).offset(73)
+            make.leading.equalToSuperview().inset(22)
+        }
+
+        nextButton.snp.makeConstraints { make in
+            make.centerY.equalTo(signUpButton.snp.centerY)
+            make.trailing.equalToSuperview().inset(22)
+            make.width.equalTo(74)
+            make.height.equalTo(50)
+        }
+    }
+
     func setupAddTarget() {
         /// 요소에 따라 정의해둔 함수를 실행
         nameTextField.addTarget(self, action: #selector(textFieldDidChange(textField:)), for: UIControl.Event.editingChanged)
         emailTextField.addTarget(self, action: #selector(textFieldDidChange(textField:)), for: UIControl.Event.editingChanged)
         pwTextField.addTarget(self, action: #selector(textFieldDidChange(textField:)), for: UIControl.Event.editingChanged)
     }
 
-    func configUI() {
-        /// 초기 다음버튼 비활성화
-        nextButton.isEnabled = false
-    }
-
     // MARK: - @IBAction
     @IBAction func touchUpToSuccess(_ sender: Any) {
         guard let nextVC = self.storyboard?.instantiateViewController(withIdentifier: "SuccessViewController") as? SuccessViewController else {return}

diff --git a/29th-iOS-Assignment/29th-iOS-Assignment/ViewControllers/SignupViewController.swift b/29th-iOS-Assignment/29th-iOS-Assignment/ViewControllers/SignupViewController.swift
@@ -7,25 +7,87 @@
 
 import UIKit
 
+import SnapKit
+
 class SignupViewController: UIViewController {
 
     // MARK: - Properties
+    @IBOutlet weak var logoImageView: UIImageView!
+    @IBOutlet weak var titleLabel: UILabel!
     @IBOutlet weak var nameTextField: UITextField!
     @IBOutlet weak var emailTextField: UITextField!
     @IBOutlet weak var pwTextField: UITextField!
     @IBOutlet weak var showPwButton: UIButton!
+    @IBOutlet weak var showPwLabel: UILabel!
     @IBOutlet weak var nextButton: UIButton!
 
     // MARK: - Life Cycle
     override func viewDidLoad() {
         super.viewDidLoad()
 
         configUI()
+        setupLayout()
         setupAddTarget()
         hideKeyboardWhenTappedAround()
     }
 
     // MARK: - Custom Method
+    func configUI() {
+        /// 초기 다음버튼 비활성화
+        nextButton.isEnabled = false
+        logoImageView.image = UIImage(named: "Google")
+
+    }
+
+    func setupLayout() {
+        logoImageView.snp.makeConstraints { make in
+            make.top.equalToSuperview().offset(100)
+            make.centerX.equalToSuperview()
+            make.width.equalTo(117)
+            make.height.equalTo(40)
+        }
+
+        titleLabel.snp.makeConstraints { make in
+            make.top.equalTo(logoImageView.snp.bottom).offset(14)
+            make.centerX.equalToSuperview()
+        }
+
+        nameTextField.snp.makeConstraints { make in
+            make.top.equalTo(titleLabel.snp.bottom).offset(128)
+            make.leading.trailing.equalToSuperview().inset(22)
+            make.height.equalTo(50)
+        }
+
+        emailTextField.snp.makeConstraints { make in
+            make.top.equalTo(nameTextField.snp.bottom).offset(17)
+            make.leading.trailing.equalToSuperview().inset(22)
+            make.height.equalTo(50)
+        }
+
+        pwTextField.snp.makeConstraints { make in
+            make.top.equalTo(emailTextField.snp.bottom).offset(17)
+            make.leading.trailing.equalToSuperview().inset(22)
+            make.height.equalTo(50)
+        }
+
+        showPwButton.snp.makeConstraints { make in
+            make.top.equalTo(pwTextField.snp.bottom).offset(17)
+            make.leading.equalToSuperview().inset(21)
+            make.width.height.equalTo(18)
+        }
+
+        showPwLabel.snp.makeConstraints { make in
+            make.centerY.equalTo(showPwButton.snp.centerY)
+            make.leading.equalTo(showPwButton.snp.trailing).offset(11)
+        }
+
+        nextButton.snp.makeConstraints { make in
+            make.top.equalTo(showPwButton.snp.bottom).offset(31)
+            make.leading.trailing.equalToSuperview().inset(22)
+            make.height.equalTo(50)
+        }
+    }
+
     func setupAddTarget() {
         /// 요소에 따라 정의해둔 함수를 실행
         nameTextField.addTarget(self, action: #selector(textFieldDidChange(textField:)), for: UIControl.Event.editingChanged)
@@ -34,11 +96,6 @@ class SignupViewController: UIViewController {
         showPwButton.addTarget(self, action: #selector(showPwButtonClicked(button:)), for: .touchUpInside)
     }
 
-    func configUI() {
-        /// 초기 다음버튼 비활성화
-        nextButton.isEnabled = false
-    }
-
     // MARK: - @IBAction
     @IBAction func touchUpToSuccess(_ sender: Any) {
         guard let nextVC = self.storyboard?.instantiateViewController(withIdentifier: "SuccessViewController") as? SuccessViewController else {return}

diff --git a/29th-iOS-Assignment/29th-iOS-Assignment/ViewControllers/SuccessViewController.swift b/29th-iOS-Assignment/29th-iOS-Assignment/ViewControllers/SuccessViewController.swift
@@ -10,17 +10,52 @@ import UIKit
 class SuccessViewController: UIViewController {
 
     // MARK: - Properties
+    @IBOutlet weak var logoImageView: UIImageView!
     @IBOutlet weak var nameLabel: UILabel!
+    @IBOutlet weak var okayButton: UIButton!
+    @IBOutlet weak var anotherAccountButton: UIButton!
     var message: String?
 
     // MARK: - Life Cycle
     override func viewDidLoad() {
         super.viewDidLoad()
 
+        setupLayout()
+        configUI()
         setNameLabel()
     }
 
     // MARK: - Custom Method
+    func configUI() {
+        anotherAccountButton.setTitle("다른 계정으로 로그인하기", for: .normal)
+        logoImageView.image = UIImage(named: "Google")
+    }
+
+    func setupLayout() {
+        logoImageView.snp.makeConstraints { make in
+            make.top.equalToSuperview().offset(207)
+            make.centerX.equalToSuperview()
+            make.width.equalTo(117)
+            make.height.equalTo(40)
+        }
+
+        nameLabel.snp.makeConstraints { make in
+            make.top.equalTo(logoImageView.snp.bottom).offset(14)
+            make.centerX.equalToSuperview()
+        }
+
+        okayButton.snp.makeConstraints { make in
+            make.top.equalTo(nameLabel.snp.bottom).offset(53)
+            make.leading.trailing.equalToSuperview().inset(22)
+            make.height.equalTo(50)
+        }
+
+        anotherAccountButton.snp.makeConstraints { make in
+            make.top.equalTo(okayButton.snp.bottom).offset(23)
+            make.centerX.equalToSuperview()
+        }
+    }
+
     /// 받아온 이름 넣는 함수
     func setNameLabel() {
         if let name = message {