[FEAT] 2.0 스플래시 / 로그인 UI (#138)

ACON-iOS/ACON-iOS.xcodeproj/project.pbxproj

@@ -124,7 +124,6 @@
 		743900912DC50926002F91B1 /* UIVisualEffectView+.swift in Sources */ = {isa = PBXBuildFile; fileRef = 743900902DC50918002F91B1 /* UIVisualEffectView+.swift */; };
 		743900932DC75451002F91B1 /* GlassmorphismType.swift in Sources */ = {isa = PBXBuildFile; fileRef = 743900922DC7544C002F91B1 /* GlassmorphismType.swift */; };
 		743900972DC8696A002F91B1 /* GlassButtonType.swift in Sources */ = {isa = PBXBuildFile; fileRef = 743900962DC86966002F91B1 /* GlassButtonType.swift */; };
-		7439FAF22D421A8000864AD0 /* splashLottie.json in Resources */ = {isa = PBXBuildFile; fileRef = 7439FAF12D421A8000864AD0 /* splashLottie.json */; };
 		745000D72D403F0200262CBE /* lodingLottie.json in Resources */ = {isa = PBXBuildFile; fileRef = 745000D62D403F0200262CBE /* lodingLottie.json */; };
 		745000D82D403F0200262CBE /* checkLottie.json in Resources */ = {isa = PBXBuildFile; fileRef = 745000D52D403F0200262CBE /* checkLottie.json */; };
 		745A81CC2D3E429300E28002 /* LocalVerificationViewModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = 745A81CB2D3E428B00E28002 /* LocalVerificationViewModel.swift */; };
@@ -201,6 +200,7 @@
 		748ECA712D31A72A00BBC981 /* LoginViewModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = 748ECA702D31A72500BBC981 /* LoginViewModel.swift */; };
 		7492349A2D687B140025F700 /* AmplitudeManager.swift in Sources */ = {isa = PBXBuildFile; fileRef = 749234992D687B0D0025F700 /* AmplitudeManager.swift */; };
 		749A01032D3A6E0100CD7A90 /* ACDebouncer.swift in Sources */ = {isa = PBXBuildFile; fileRef = 749A01022D3A6DFC00CD7A90 /* ACDebouncer.swift */; };
+		749C90E82DD4D37100455211 /* splashLottie.json in Resources */ = {isa = PBXBuildFile; fileRef = 749C90E72DD4D37100455211 /* splashLottie.json */; };
 		74A13D622DCBB97E007FFFC3 /* OnboardingViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = 74A13D612DCBB978007FFFC3 /* OnboardingViewController.swift */; };
 		74A13D642DCBBAB9007FFFC3 /* OnboardingView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 74A13D632DCBBAB4007FFFC3 /* OnboardingView.swift */; };
 		74A13D672DCBC2BD007FFFC3 /* DislikeFoodCollectionViewCell.swift in Sources */ = {isa = PBXBuildFile; fileRef = 74A13D662DCBC2B0007FFFC3 /* DislikeFoodCollectionViewCell.swift */; };
@@ -235,6 +235,7 @@
 		74DDBA8B2DC45E3B00BF9824 /* ACButtonType.swift in Sources */ = {isa = PBXBuildFile; fileRef = 74DDBA8A2DC45E3400BF9824 /* ACButtonType.swift */; };
 		74DDBA8D2DC45E4500BF9824 /* ACButton.swift in Sources */ = {isa = PBXBuildFile; fileRef = 74DDBA8C2DC45E4300BF9824 /* ACButton.swift */; };
 		74E38D342D69B46F009449D4 /* LocationUtils.swift in Sources */ = {isa = PBXBuildFile; fileRef = 74E38D332D69B468009449D4 /* LocationUtils.swift */; };
+		74FA77842DD43709006846C9 /* SplashBGM.mp3 in Resources */ = {isa = PBXBuildFile; fileRef = 74FA77832DD43709006846C9 /* SplashBGM.mp3 */; };
 		D61917E92D3E4410001BF0EE /* OnboardingTargetType.swift in Sources */ = {isa = PBXBuildFile; fileRef = D61917E82D3E4410001BF0EE /* OnboardingTargetType.swift */; };
 		D61917EC2D3E484A001BF0EE /* OnboardingRequest.swift in Sources */ = {isa = PBXBuildFile; fileRef = D61917EB2D3E484A001BF0EE /* OnboardingRequest.swift */; };
 		D6232C952D3A294C003FF208 /* AlertHandler.swift in Sources */ = {isa = PBXBuildFile; fileRef = D6232C942D3A294C003FF208 /* AlertHandler.swift */; };
@@ -375,7 +376,6 @@
 		743900902DC50918002F91B1 /* UIVisualEffectView+.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = "UIVisualEffectView+.swift"; sourceTree = "<group>"; };
 		743900922DC7544C002F91B1 /* GlassmorphismType.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = GlassmorphismType.swift; sourceTree = "<group>"; };
 		743900962DC86966002F91B1 /* GlassButtonType.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = GlassButtonType.swift; sourceTree = "<group>"; };
-		7439FAF12D421A8000864AD0 /* splashLottie.json */ = {isa = PBXFileReference; lastKnownFileType = text.json; path = splashLottie.json; sourceTree = "<group>"; };
 		745000D52D403F0200262CBE /* checkLottie.json */ = {isa = PBXFileReference; lastKnownFileType = text.json; path = checkLottie.json; sourceTree = "<group>"; };
 		745000D62D403F0200262CBE /* lodingLottie.json */ = {isa = PBXFileReference; lastKnownFileType = text.json; path = lodingLottie.json; sourceTree = "<group>"; };
 		745A81CB2D3E428B00E28002 /* LocalVerificationViewModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = LocalVerificationViewModel.swift; sourceTree = "<group>"; };
@@ -446,6 +446,7 @@
 		749234992D687B0D0025F700 /* AmplitudeManager.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = AmplitudeManager.swift; sourceTree = "<group>"; };
 		7496EC1A2DACF3E500508EA8 /* GoogleService-Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = "GoogleService-Info.plist"; sourceTree = "<group>"; };
 		749A01022D3A6DFC00CD7A90 /* ACDebouncer.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ACDebouncer.swift; sourceTree = "<group>"; };
+		749C90E72DD4D37100455211 /* splashLottie.json */ = {isa = PBXFileReference; lastKnownFileType = text.json; path = splashLottie.json; sourceTree = "<group>"; };
 		74A13D612DCBB978007FFFC3 /* OnboardingViewController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = OnboardingViewController.swift; sourceTree = "<group>"; };
 		74A13D632DCBBAB4007FFFC3 /* OnboardingView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = OnboardingView.swift; sourceTree = "<group>"; };
 		74A13D662DCBC2B0007FFFC3 /* DislikeFoodCollectionViewCell.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = DislikeFoodCollectionViewCell.swift; sourceTree = "<group>"; };
@@ -481,6 +482,7 @@
 		74DDBA8A2DC45E3400BF9824 /* ACButtonType.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ACButtonType.swift; sourceTree = "<group>"; };
 		74DDBA8C2DC45E4300BF9824 /* ACButton.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ACButton.swift; sourceTree = "<group>"; };
 		74E38D332D69B468009449D4 /* LocationUtils.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = LocationUtils.swift; sourceTree = "<group>"; };
+		74FA77832DD43709006846C9 /* SplashBGM.mp3 */ = {isa = PBXFileReference; lastKnownFileType = audio.mp3; path = SplashBGM.mp3; sourceTree = "<group>"; };
 		B28431BAB67B99CD7B85C705 /* Pods_ACON_iOS.framework */ = {isa = PBXFileReference; explicitFileType = wrapper.framework; includeInIndex = 0; path = Pods_ACON_iOS.framework; sourceTree = BUILT_PRODUCTS_DIR; };
 		BB785B4E26FA7C11BB85A55D /* Pods-ACON-iOS.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-ACON-iOS.debug.xcconfig"; path = "Target Support Files/Pods-ACON-iOS/Pods-ACON-iOS.debug.xcconfig"; sourceTree = "<group>"; };
 		D61917E82D3E4410001BF0EE /* OnboardingTargetType.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = OnboardingTargetType.swift; sourceTree = "<group>"; };
@@ -1138,6 +1140,7 @@
 		748D6F762D2BCAB3007690B4 /* Resources */ = {
 			isa = PBXGroup;
 			children = (
+				74FA77822DD436E4006846C9 /* Music */,
 				74BF921A2D3972C500B923E3 /* Lottie */,
 				748D6F772D2BCB90007690B4 /* Fonts */,
 				748D6F622D2BCA1C007690B4 /* Assets.xcassets */,
@@ -1395,7 +1398,7 @@
 				15C0ED692D42CDA300C9ED83 /* loadingWhite.json */,
 				745000D52D403F0200262CBE /* checkLottie.json */,
 				745000D62D403F0200262CBE /* lodingLottie.json */,
-				7439FAF12D421A8000864AD0 /* splashLottie.json */,
+				749C90E72DD4D37100455211 /* splashLottie.json */,
 			);
 			path = Lottie;
 			sourceTree = "<group>";
@@ -1476,6 +1479,14 @@
 			path = Cell;
 			sourceTree = "<group>";
 		};
+		74FA77822DD436E4006846C9 /* Music */ = {
+			isa = PBXGroup;
+			children = (
+				74FA77832DD43709006846C9 /* SplashBGM.mp3 */,
+			);
+			path = Music;
+			sourceTree = "<group>";
+		};
 		D61917EA2D3E483E001BF0EE /* DTO */ = {
 			isa = PBXGroup;
 			children = (
@@ -1660,6 +1671,7 @@
 			isa = PBXResourcesBuildPhase;
 			buildActionMask = 2147483647;
 			files = (
+				74FA77842DD43709006846C9 /* SplashBGM.mp3 in Resources */,
 				15BFF8B92D665BAD00909C4F /* Debug.xcconfig in Resources */,
 				15BFF8BA2D665BAD00909C4F /* Release.xcconfig in Resources */,
 				748D6F6C2D2BCA1C007690B4 /* Assets.xcassets in Resources */,
@@ -1671,12 +1683,12 @@
 				15C0ED682D42CD8800C9ED83 /* drop3Acorn.json in Resources */,
 				748D6FA12D2BD65D007690B4 /* Pretendard-Regular.otf in Resources */,
 				15F15E832DBFD17A002F81E2 /* Pretendard-Light.otf in Resources */,
-				7439FAF22D421A8000864AD0 /* splashLottie.json in Resources */,
 				745000D72D403F0200262CBE /* lodingLottie.json in Resources */,
 				745000D82D403F0200262CBE /* checkLottie.json in Resources */,
 				15C0ED6A2D42CDA300C9ED83 /* loadingWhite.json in Resources */,
 				748D6F6E2D2BCA1C007690B4 /* LaunchScreen.storyboard in Resources */,
 				746AA0352DAD0EFF00E28B66 /* GoogleService-Info.plist in Resources */,
+				749C90E82DD4D37100455211 /* splashLottie.json in Resources */,
 				747F4FC12D3DC80B003DECBF /* finishedUpload.json in Resources */,
 				748D6F9D2D2BD641007690B4 /* Pretendard-SemiBold.otf in Resources */,
 			);

ACON-iOS/ACON-iOS/Global/Resources/Assets.xcassets/Images/2.0/img_splash.imageset/Contents.json

@@ -0,0 +1,23 @@
+{
+  "images" : [
+    {
+      "filename" : "SplashFrame2.png",
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "filename" : "SplashFrame2@2x.png",
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "SplashFrame2@3x.png",
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

ACON-iOS/ACON-iOS/Global/Resources/Assets.xcassets/Images/2.0/img_splash_shadow.imageset/Contents.json

@@ -0,0 +1,12 @@
+{
+  "images" : [
+    {
+      "filename" : "Splash_Shadow.png",
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

ACON-iOS/ACON-iOS/Presentation/Login/View/LoginView.swift

@@ -14,13 +14,15 @@ final class LoginView: BaseView {
 
     // MARK: - UI Properties
 
-    private let brandingLabel : UILabel = UILabel()
-
     private let logoImageView : UIImageView = UIImageView()
 
+    private let shadowImageView: UIImageView = UIImageView()
+
+    let loginContentView: UIView = UIView()
+
     var googleLoginButton: UIButton = UIButton()
 
-    var appleLoginButton: UIButton = UIButton()
+    var appleLoginButton: ACButton = ACButton(style: GlassConfigButton(buttonType: .line_12_b1SB))
 
     private let proceedLoginLabel: UILabel = UILabel()
 
@@ -31,10 +33,10 @@ final class LoginView: BaseView {
     lazy var socialLoginButtonConfiguration: UIButton.Configuration = {
         var configuration = UIButton.Configuration.plain()
         configuration.imagePlacement = .leading
-        configuration.imagePadding = 60
+        configuration.imagePadding = 60*ScreenUtils.widthRatio
         configuration.titleAlignment = .center
         configuration.preferredSymbolConfigurationForImage = UIImage.SymbolConfiguration(pointSize: 24)
-        configuration.contentInsets = NSDirectionalEdgeInsets(top: 15, leading: 24, bottom: 15, trailing: 24)
+        configuration.contentInsets = NSDirectionalEdgeInsets(top: 15, leading: ScreenUtils.widthRatio*24, bottom: 15, trailing: ScreenUtils.widthRatio*24)
         return configuration
     }()
 
@@ -46,58 +48,77 @@ final class LoginView: BaseView {
     override func setHierarchy() {
         super.setHierarchy()
 
-        self.addSubviews(brandingLabel,
+        self.addSubviews(loginContentView,
                          logoImageView,
-                         googleLoginButton,
-                         appleLoginButton,
-                         proceedLoginLabel,
-                         termsOfUseLabel,
-                         privacyPolicyLabel)
+                         shadowImageView)
+        loginContentView.addSubviews(googleLoginButton,
+                                     appleLoginButton,
+                                     proceedLoginLabel,
+                                     termsOfUseLabel,
+                                     privacyPolicyLabel)
     }
 
     override func setLayout() {
         super.setLayout()
 
+        loginContentView.snp.makeConstraints {
+            $0.edges.equalToSuperview()
+        }
+
         logoImageView.snp.makeConstraints {
-            $0.top.equalToSuperview().offset(ScreenUtils.heightRatio*145)
+            $0.bottom.equalToSuperview().inset(ScreenUtils.heightRatio*416)
+            $0.width.equalTo(ScreenUtils.widthRatio*240)
+            $0.height.equalTo(ScreenUtils.heightRatio*120)
+            $0.centerX.equalToSuperview()
+        }
+
+        shadowImageView.snp.makeConstraints {
+            $0.bottom.equalToSuperview().inset(ScreenUtils.heightRatio*340)
             $0.centerX.equalToSuperview()
-            $0.height.equalTo(ScreenUtils.heightRatio*91)
-            $0.width.equalTo(ScreenUtils.widthRatio*261)
         }
 
         googleLoginButton.snp.makeConstraints {
-            $0.bottom.equalToSuperview().inset(ScreenUtils.heightRatio*172)
+            $0.bottom.equalToSuperview().inset(ScreenUtils.heightRatio*177)
             $0.height.equalTo(loginButtonHeight)
             $0.horizontalEdges.equalToSuperview().inset(ScreenUtils.widthRatio*20)
         }
 
         appleLoginButton.snp.makeConstraints {
-            $0.top.equalTo(googleLoginButton.snp.bottom).offset(8)
+            $0.top.equalTo(googleLoginButton.snp.bottom).offset(16)
             $0.height.equalTo(loginButtonHeight)
             $0.horizontalEdges.equalToSuperview().inset(ScreenUtils.widthRatio*20)
         }
 
         proceedLoginLabel.snp.makeConstraints {
-            $0.bottom.equalToSuperview().inset(ScreenUtils.heightRatio*60)
+            $0.bottom.equalToSuperview().inset(ScreenUtils.heightRatio*65)
             $0.centerX.equalToSuperview()
         }
 
         termsOfUseLabel.snp.makeConstraints {
-            $0.bottom.equalToSuperview().inset(ScreenUtils.heightRatio*36)
-            $0.leading.equalToSuperview().inset(ScreenUtils.widthRatio*111.5)
+            $0.bottom.equalToSuperview().inset(ScreenUtils.heightRatio*45)
+            $0.leading.equalToSuperview().inset(ScreenUtils.widthRatio*111)
         }
 
         privacyPolicyLabel.snp.makeConstraints {
-            $0.bottom.equalToSuperview().inset(ScreenUtils.heightRatio*36)
-            $0.trailing.equalToSuperview().inset(ScreenUtils.widthRatio*111.5)
+            $0.bottom.equalToSuperview().inset(ScreenUtils.heightRatio*45)
+            $0.trailing.equalToSuperview().inset(ScreenUtils.widthRatio*111)
         }
     }
 
     override func setStyle() {
         super.setStyle()
 
+        loginContentView.do {
+            $0.backgroundColor = .clear
+        }
+
         logoImageView.do {
-            $0.image = .icWordLogoSplashOrg
+            $0.image = .imgSplash
+            $0.contentMode = .scaleAspectFit
+        }
+
+        shadowImageView.do {
+            $0.image = .imgSplashShadow
             $0.contentMode = .scaleAspectFit
         }
 
@@ -116,13 +137,11 @@ final class LoginView: BaseView {
             $0.configuration = socialLoginButtonConfiguration
             $0.contentHorizontalAlignment = .leading
             $0.layer.cornerRadius = loginButtonHeight / 2
-            $0.backgroundColor = .acBlack
+            $0.backgroundColor = .gray700
             $0.setImage(.icApple, for: .normal)
             $0.setAttributedTitle(text: StringLiterals.Login.appleLogin,
                                   style: .t4SB,
                                   color: .acWhite)
-            $0.layer.borderColor = UIColor.gray500.cgColor
-            $0.layer.borderWidth = 1
         }
 
         proceedLoginLabel.do {

ACON-iOS/ACON-iOS/Presentation/Login/View/LoginViewController.swift

@@ -33,6 +33,24 @@ class LoginViewController: BaseNavViewController {
         self.setSkipButton()
     }
 
+    override func viewWillAppear(_ animated: Bool) {
+        super.viewWillAppear(animated)
+
+        loginView.loginContentView.alpha = 0
+        self.rightButton.alpha = 0
+    }
+
+    override func viewDidAppear(_ animated: Bool) {
+        super.viewDidAppear(animated)
+
+        DispatchQueue.main.asyncAfter(deadline: .now() + 0.4) {
+            UIView.animate(withDuration: 0.4) {
+                self.loginView.loginContentView.alpha = 1.0
+                self.rightButton.alpha = 1.0
+            }
+        }
+    }
+
     override func setHierarchy() {
         super.setHierarchy()
 

ACON-iOS/ACON-iOS/Presentation/Splash/View/SplashView.swift

@@ -8,41 +8,52 @@
 import UIKit
 
 import Lottie
-import SnapKit
-import Then
+import AVFAudio
 
 class SplashView: BaseView {
 
     let splashLottieView = LottieAnimationView(name: "splashLottie")
 
+    let shadowImageView: UIImageView = UIImageView()
+
     override func setHierarchy() {
         super.setHierarchy()
 
-        self.addSubviews(splashLottieView)
+        self.addSubviews(splashLottieView, shadowImageView)
     }
 
     override func setLayout() {
         super.setLayout()
 
         splashLottieView.snp.makeConstraints {
-            // NOTE: 13 mini -> 110, 14 pro max -> 119, 15 pro -> 113
-            $0.top.equalToSuperview().inset(ScreenUtils.heightRatio*113)
+            $0.bottom.equalToSuperview().inset(ScreenUtils.heightRatio*416)
+            $0.width.equalTo(ScreenUtils.widthRatio*240)
+            $0.height.equalTo(ScreenUtils.heightRatio*120)
+            $0.centerX.equalToSuperview()
+        }
+
+        shadowImageView.snp.makeConstraints {
+            $0.bottom.equalToSuperview().inset(ScreenUtils.heightRatio*340)
             $0.centerX.equalToSuperview()
-            $0.width.equalTo(ScreenUtils.widthRatio*300)
         }
 
     }
 
     override func setStyle() {
         super.setStyle()
-        
+
         splashLottieView.do {
             $0.contentMode = .scaleAspectFit
             $0.loopMode = .playOnce
             $0.animationSpeed = 1.0
             $0.backgroundBehavior = .pauseAndRestore
         }
 
+        shadowImageView.do {
+            $0.image = .imgSplashShadow
+            $0.alpha = 0.05
+            $0.contentMode = .scaleAspectFit
+        }
     }
 
 }