refactor #87: 로그인 뷰 디자인 변경

Projects/DSKit/Sources/Lottie/KeymeLottie.swift

@@ -27,7 +27,7 @@ public struct KeymeLottieView: UIViewRepresentable {
 
  lottieView.translatesAutoresizingMaskIntoConstraints = false
  lottieView.loopMode = loopMode
- lottieView.contentMode = .scaleToFill
+ lottieView.contentMode = .scaleAspectFill
  lottieView.play(completion: { finished in
  if finished {
  completion?()

Projects/Features/Sources/Root/RootView.swift

@@ -7,7 +7,9 @@
 //
 
 import SwiftUI
+import Core
 import ComposableArchitecture
+import DSKit
 
 public struct RootView: View {
  private let store: StoreOf<RootFeature>
@@ -22,51 +24,63 @@ public struct RootView: View {
 
  public var body: some View {
  WithViewStore(store, observe: { $0 }) { viewStore in
- if viewStore.logInStatus == .notDetermined {
- // 여기 걸리면 에러임. 조심하셈.
- EmptyView()
- } else if viewStore.logInStatus == .loggedOut {
- // 회원가입을 하지 않았거나 로그인을 하지 않은 유저
- let loginStore = store.scope(
- state: \.$logInStatus,
- action: RootFeature.Action.login)
-
- IfLetStore(loginStore) { store in
- SignInView(store: store)
- }
- } else if viewStore.registrationState?.status == .notDetermined {
- // 개인정보 등록 상태를 로딩 중
- ProgressView()
- } else if viewStore.registrationState?.status == .needsRegister {
- // 개인정보 등록
- let registrationStore = store.scope(
- state: \.$registrationState,
- action: RootFeature.Action.registration)
-
- IfLetStore(registrationStore) { store in
- RegistrationView(store: store)
- }
- } else if viewStore.onboardingStatus?.status == .notDetermined {
- // 온보딩 상태를 로딩 중
- ProgressView()
- } else if viewStore.onboardingStatus?.status == .needsOnboarding {
- // 가입했지만 온보딩을 하지 않고 종료했던 유저
- let onboardingStore = store.scope(
- state: \.$onboardingStatus,
- action: RootFeature.Action.onboarding)
-
- IfLetStore(onboardingStore) { store in
- OnboardingView(store: store)
- }
- } else {
- // 가입했고 온보딩을 진행한 유저
- let mainPageStore = store.scope(state: \.$mainPageState, action: RootFeature.Action.mainPage)
+ ZStack {
+ // 애니메이션 부웅.. 부웅..
+ KeymeLottieView(asset: .background, loopMode: .autoReverse)
+ .ignoresSafeArea()
 
- IfLetStore(mainPageStore) { store in
- KeymeMainView(store: store)
+ if viewStore.logInStatus == .loggedIn {
+ BackgroundBlurringView(style: .dark)
+ .ignoresSafeArea()
  .transition(.opacity)
- } else: {
- Text("에러")
+ }
+
+ if viewStore.logInStatus == .notDetermined {
+ // 여기 걸리면 에러임. 조심하셈.
+ EmptyView()
+ } else if viewStore.logInStatus == .loggedOut {
+ // 회원가입을 하지 않았거나 로그인을 하지 않은 유저
+ let loginStore = store.scope(
+ state: \.$logInStatus,
+ action: RootFeature.Action.login)
+
+ IfLetStore(loginStore) { store in
+ SignInView(store: store)
+ }
+ } else if viewStore.registrationState?.status == .notDetermined {
+ // 개인정보 등록 상태를 로딩 중
+ ProgressView()
+ } else if viewStore.registrationState?.status == .needsRegister {
+ // 개인정보 등록
+ let registrationStore = store.scope(
+ state: \.$registrationState,
+ action: RootFeature.Action.registration)
+
+ IfLetStore(registrationStore) { store in
+ RegistrationView(store: store)
+ }
+ } else if viewStore.onboardingStatus?.status == .notDetermined {
+ // 온보딩 상태를 로딩 중
+ ProgressView()
+ } else if viewStore.onboardingStatus?.status == .needsOnboarding {
+ // 가입했지만 온보딩을 하지 않고 종료했던 유저
+ let onboardingStore = store.scope(
+ state: \.$onboardingStatus,
+ action: RootFeature.Action.onboarding)
+
+ IfLetStore(onboardingStore) { store in
+ OnboardingView(store: store)
+ }
+ } else {
+ // 가입했고 온보딩을 진행한 유저
+ let mainPageStore = store.scope(state: \.$mainPageState, action: RootFeature.Action.mainPage)
+
+ IfLetStore(mainPageStore) { store in
+ KeymeMainView(store: store)
+ .transition(.opacity)
+ } else: {
+ Text("에러")
+ }
  }
  }
  }

Projects/Features/Sources/SignIn/SignInView.swift

@@ -10,6 +10,7 @@
 
 import AuthenticationServices
 import ComposableArchitecture
+import DSKit
 import SwiftUI
 import Network
 
@@ -21,16 +22,27 @@ public struct SignInView: View {
  }
 
  public var body: some View {
- VStack(alignment: .center, spacing: 0) {
- Spacer()
+ ZStack(alignment: .center) {
+ Text.keyme("KEYME", font: .checkResult)
+ .foregroundColor(.white)
+ .offset(y: -39)
 
- KakaoLoginButton(store: store)
-
- AppleLoginButton(store: store)
-
- GuideMessageView()
+ VStack(alignment: .center, spacing: 30) {
+ Spacer()
+
+ VStack(spacing: 16) {
+ KakaoLoginButton(store: store)
+ .frame(height: 48)
+
+ AppleLoginButton(store: store)
+ .frame(height: 48)
+ }
+
+ GuideMessageView()
+ }
+ .padding(.horizontal, 32)
+ .padding(.bottom, 56)
  }
- .padding()
  }
 
  // 카카오 로그인 버튼
@@ -45,7 +57,6 @@ public struct SignInView: View {
  .resizable()
  .scaledToFill()
  }
- .frame(width: 312, height: 48)
  .cornerRadius(6)
  }
  }
@@ -68,9 +79,7 @@ public struct SignInView: View {
  }
  })
  .signInWithAppleButtonStyle(.white)
- .frame(width: 312, height: 48)
  .cornerRadius(6)
- .padding(.vertical)
  }
  }
 
@@ -99,7 +108,6 @@ public struct SignInView: View {
  }
  }
  .font(.system(size: 11))
- .frame(width: 265, height: 36)
  }
  }
 }