Merge pull request #161 from SOPT-all/feat/#149-registerScrollFeat

 [�Feat] #149 - 키보드 활성화 여부에 따른 자동 스크롤 구현

Author: ChoiAnYong

Spoony-iOS/Spoony-iOS/Source/Feature/Register/Components/ChipsContainerView.swift

@@ -14,7 +14,7 @@ struct ChipsContainerView: View {
     let horizontalSpacing: CGFloat
     let items: [CategoryChip]
     var sortedItems: [CategoryChip] {
-        items.sorted { $0.id > $1.id }
+        items.sorted { $0.id < $1.id }
     }
 
     init(

Spoony-iOS/Spoony-iOS/Source/Feature/Register/State/RegisterIntent.swift

@@ -29,4 +29,5 @@ enum RegisterIntent {
     case deleteImage(UploadImage)
     case getCategories
     case didTapPhoto([PhotosPickerItem])
+    case updateKeyboardHeight(CGFloat)
 }

Spoony-iOS/Spoony-iOS/Source/Feature/Register/State/RegisterState.swift

@@ -14,10 +14,11 @@ struct RegisterState {
 
     // MARK: - InfoStepView
     var placeText: String = ""
-    var recommendTexts: [TextList] = [.init()]
 
-    var toast: Toast?
+    var keyboardHeight: CGFloat = 0
 
+    var toast: Toast?
+    var recommendTexts: [TextList] = [.init()]
     var categorys: [CategoryChip] = []
     var selectedCategory: [CategoryChip] = []
 

Spoony-iOS/Spoony-iOS/Source/Feature/Register/State/RegisterStore.swift

@@ -146,6 +146,8 @@ final class RegisterStore: ObservableObject {
             fetchCategories()
         case .didTapPhoto(let items):
             validateSelectedPhotoCount(item: items)
+        case .updateKeyboardHeight(let height):
+            state.keyboardHeight = height
         }
     }
 }

Spoony-iOS/Spoony-iOS/Source/Feature/Register/View/InfoStepView.swift

@@ -9,6 +9,7 @@ import SwiftUI
 
 struct InfoStepView: View {
     @ObservedObject private var store: RegisterStore
+    @FocusState private var isPlaceTextFieldFocused: Bool
 
     init(store: RegisterStore) {
         self.store = store
@@ -27,14 +28,15 @@ struct InfoStepView: View {
             store.dispatch(.didTapBackground(.start))
             hideKeyboard()
         }
-        .toastView(toast: Binding(get: {
-            store.state.toast
-        }, set: { newValue in
-            store.dispatch(.updateToast(newValue))
-        }))
+        .toastView(toast: Binding(
+            get: { store.state.toast },
+            set: { newValue in
+                store.dispatch(.updateToast(newValue))
+            }
+        ))
         .task {
             store.dispatch(.getCategories)
-        }        
+        }
     }
 }
 
@@ -85,6 +87,7 @@ extension InfoStepView {
                 ) {
                     store.dispatch(.didTapButtonIcon(.place))
                 }
+                .focused($isPlaceTextFieldFocused)
                 .onSubmit {
                     store.dispatch(.didTapkeyboardEnter)
                 }
@@ -114,7 +117,7 @@ extension InfoStepView {
                 ChipsContainerView(
                     selectedItem: Binding(get: {
                         store.state.selectedCategory
-                    }, set: { newValue in                        
+                    }, set: { newValue in
                         store.dispatch(.updateSelectedCategoryChip(newValue))
                     }),
                     items: store.state.categorys
@@ -150,7 +153,7 @@ extension InfoStepView {
                     plusButton
                 }
             }
-        }        
+        }
     }
 
     private var dropDownView: some View {
@@ -197,34 +200,75 @@ extension InfoStepView {
     }
 
     private var nextButton: some View {
-        SpoonyButton(
-            style: .primary,
-            size: .xlarge,
-            title: "다음",
-            disabled: Binding(
-                get: {
-                    store.state.isDisableStartButton
-                }, set: { newValue in
-                    store.dispatch(.updateButtonState(newValue, .start))
+        ScrollViewReader { proxy in
+            VStack {
+                SpoonyButton(
+                    style: .primary,
+                    size: .xlarge,
+                    title: "다음",
+                    disabled: Binding(
+                        get: {
+                            store.state.isDisableStartButton
+                        }, set: { newValue in
+                            store.dispatch(.updateButtonState(newValue, .start))
+                        }
+                    )
+                ) {
+                    store.dispatch(.didTapNextButton(.start))
                 }
-            )
-        ) {
-            store.dispatch(.didTapNextButton(.start))
-        }
-        .padding(.bottom, 20)
-        .padding(.top, 61)
-        .overlay(alignment: .top) {
-            ToolTipView()
-                .padding(.top, 5)
-                .opacity(store.state.isToolTipPresented ? 1 : 0)
-                .task {
-                    do {
-                        try await Task.sleep(for: .seconds(3))
-                        store.dispatch(.updateToolTipState)
-                    } catch {
-                        
+                .padding(.bottom, 20)
+                .padding(.top, 61)
+            }
+            .onAppear {
+                NotificationCenter.default.addObserver(
+                    forName: UIResponder.keyboardWillShowNotification,
+                    object: nil,
+                    queue: .main
+                ) { notification in
+                    if let frame = notification.userInfo?[UIResponder.keyboardFrameEndUserInfoKey] as? CGRect {
+                        withAnimation(.smooth) {
+                            if !isPlaceTextFieldFocused {
+                                store.dispatch(.updateKeyboardHeight(frame.height))
+                            }
+                        }
                     }
                 }
+                
+                NotificationCenter.default.addObserver(
+                    forName: UIResponder.keyboardWillHideNotification,
+                    object: nil,
+                    queue: .main
+                ) { _ in
+                    withAnimation(.smooth) {
+                        store.dispatch(.updateKeyboardHeight(0))
+                    }
+                }
+            }
+            .id("nextButton")
+            .padding(.bottom, store.state.keyboardHeight)
+            .ignoresSafeArea(.keyboard)
+            .onChange(of: store.state.keyboardHeight) { _, newValue in
+                if newValue != 0 {
+                    DispatchQueue.main.asyncAfter(deadline: .now() + 0.1) {
+                        withAnimation {
+                            proxy.scrollTo("nextButton", anchor: .bottom)
+                        }
+                    }
+                }
+            }
+            .overlay(alignment: .top) {
+                ToolTipView()
+                    .padding(.top, 5)
+                    .opacity(store.state.isToolTipPresented ? 1 : 0)
+                    .task {
+                        do {
+                            try await Task.sleep(for: .seconds(3))
+                            store.dispatch(.updateToolTipState)
+                        } catch {
+                            
+                        }
+                    }
+            }
         }
     }
 }

Spoony-iOS/Spoony-iOS/Source/Feature/Register/View/Register.swift

@@ -26,6 +26,13 @@ struct Register: View {
                 .transition(.slide)
                 .animation(.easeInOut, value: store.state.registerStep)
             }
+            .scrollIndicators(.hidden)
+            .simultaneousGesture(
+                DragGesture()
+                    .onChanged { _ in
+                        hideKeyboard()
+                    }
+            )
         }
     }
 }
@@ -67,7 +74,3 @@ enum RegisterStep: Int {
     case middle = 2
     case end = 3
 }
-
-#Preview {
-    Register(store: .init(navigationManager: .init()))
-}