diff --git a/Projects/Feature/SandBeach/Interface/Sources/SandBeachCoachMark/SandBeachCoachMarkView.swift b/Projects/Feature/SandBeach/Interface/Sources/SandBeachCoachMark/SandBeachCoachMarkView.swift index 6e78f4c0..00788278 100644 --- a/Projects/Feature/SandBeach/Interface/Sources/SandBeachCoachMark/SandBeachCoachMarkView.swift +++ b/Projects/Feature/SandBeach/Interface/Sources/SandBeachCoachMark/SandBeachCoachMarkView.swift @@ -19,14 +19,87 @@ public struct SandBeachCoachMarkView: View { } public var body: some View { - VStack(spacing: 0.0) { - Spacer() + ZStack { + Color.black.opacity(0.6) + .edgesIgnoringSafeArea(.all) + if store.count == 0 { + firstCoachMark + } else if store.count == 1 { + secondCoachMark + } else { + thirdCoachMark + } } - .frame(maxWidth: .infinity) - .contentShape(Rectangle()) + .compositingGroup() .asButton { store.send(.coachMarkDidTapped) } - .background(Color.black.opacity(0.7)) + } +} + +private extension SandBeachCoachMarkView { + var firstCoachMark: some View { + VStack(spacing: 0) { + Spacer() + .frame(height: 96) + + PopupView(popupType: .coachMark(content: "나의 첫인상이 될\n자기소개를 작성해주세요")) + + RoundedRectangle(cornerRadius: 20) + .frame(width: 267, height: 106) + .foregroundColor(.white) + .blendMode(.destinationOut) + .padding(.top, .xl) + + Spacer() + } + } + + var secondCoachMark: some View { + VStack(spacing: 0.0) { + Spacer() + .frame(height: 239) + + PopupView(popupType: .coachMark(content: "바구니를 클릭하면\n보틀 속 자기소개를 읽어볼 수 있어요")) + + GeometryReader { geo in + HStack(spacing: 0.0) { + Spacer() + RoundedRectangle(cornerRadius: 20) + .frame(width: geo.size.width - 200, height: geo.size.width - 200) + .foregroundColor(.white) + .blendMode(.destinationOut) + .padding(.top, .xl) + Spacer() + } + } + Spacer() + } + } + + var thirdCoachMark: some View { + GeometryReader { geo in + + VStack(spacing: 0.0) { + Spacer() + + PopupView(popupType: .coachMark(content: "가치관 문답을 시작한 경우\n문답에서 확인할 수 있어요")) + .offset(x: geo.size.width * 0.09) + + HStack(spacing: 0.0) { + Spacer() + RoundedRectangle(cornerRadius: 20) + .frame(width: 72, height: 72) + .foregroundColor(.white) + .blendMode(.destinationOut) + .padding(.top, .xl) + .offset(x: geo.size.width * 0.09) + Spacer() + + } + } + .offset(y: -34) + } + .ignoresSafeArea(.all, edges: .bottom) } } diff --git a/Projects/Feature/TabBar/Interface/Sources/TabBarModifier.swift b/Projects/Feature/TabBar/Interface/Sources/TabBarModifier.swift index 0c151aa6..c3f1f38a 100644 --- a/Projects/Feature/TabBar/Interface/Sources/TabBarModifier.swift +++ b/Projects/Feature/TabBar/Interface/Sources/TabBarModifier.swift @@ -42,7 +42,7 @@ private struct TabBarModifier: ViewModifier { color: selectedTab == item ? .primary : .enableTertiary ) } - .offset(y: -9) + .offset(y: -15) .asThrottleButton { action(item) }