design: datepicker UI 변경 및 사소한 로직 수정

Author: hgjwilly-koreatech

Koin/Core/Extensions/UIViewController+.swift

@@ -8,7 +8,7 @@
 import UIKit.UIViewController
 
 extension UIViewController {
-    func hideKeyboardWhenTappedAround() {
+    @objc func hideKeyboardWhenTappedAround() {
         let tap = UITapGestureRecognizer(target: self, action: #selector(UIViewController.dismissKeyboard))
         tap.cancelsTouchesInView = false
         view.addGestureRecognizer(tap)

Koin/Presentation/LostItem/EditLostItem/EditLostItemViewController.swift

@@ -87,6 +87,11 @@ final class EditLostItemViewController: UIViewController {
         configureNavigationBar(style: .empty)
     }
 
+    override func hideKeyboardWhenTappedAround() {
+        super.hideKeyboardWhenTappedAround()
+        foundDateView.dismissDropdown()
+    }
+    
     private func bind() {
         viewModel.transform(with: inputSubject.eraseToAnyPublisher()).sink { [weak self] output in
             guard let self else { return }
@@ -120,6 +125,13 @@ final class EditLostItemViewController: UIViewController {
         contentView.shouldDismissDropDownPublisher.sink { [weak self] in
             self?.foundDateView.dismissDropdown()
         }.store(in: &subscriptions)
+        
+        foundDateView.focusDropdownPublisher.sink { [weak self] targetView in
+            guard let self else { return }
+            var rect = targetView.convert(targetView.bounds, to: scrollView)
+            rect.size.height += 15
+            scrollView.scrollRectToVisible(rect, animated: true)
+        }.store(in: &subscriptions)
     }
 }
 
@@ -130,6 +142,9 @@ extension EditLostItemViewController {
     }
 
     @objc private func editButtonTapped() {
+        dismissKeyboard()
+        foundDateView.dismissDropdown()
+        
         if foundDateView.isValid && foundPlaceView.isValid {
             let imageUrls = imagesView.imageUploadCollectionView.imageUrls
             let category = categoryView.selectedCategory

Koin/Presentation/LostItem/EditLostItem/SubViews/EditLostItemFoundDateView.swift

@@ -18,6 +18,7 @@ final class EditLostItemFoundDateView: ExtendedTouchAreaView {
         dateWarningLabel.isHidden
     }
     private(set) var foundDate: String
+    let focusDropdownPublisher = PassthroughSubject<UIView, Never>()
 
     // MARK: - UI Components
     private lazy var dateLabel = UILabel().then {
@@ -106,6 +107,9 @@ final class EditLostItemFoundDateView: ExtendedTouchAreaView {
         dropdownView.valueChangedPublisher.sink { [weak self] in
             self?.dropdownValueChanged()
         }.store(in: &subscriptions)
+        dropdownView.dismissDropdownPublisher.sink { [weak self] in
+            self?.dismissDropdown()
+        }.store(in: &subscriptions)
     }
 
     private func setAddTargets() {
@@ -116,6 +120,7 @@ final class EditLostItemFoundDateView: ExtendedTouchAreaView {
         if dropdownView.isHidden {
             presentDropdown()
             endEditing(true)
+            focusDropdownPublisher.send(dropdownView)
         } else {
             dismissDropdown()
         }
@@ -134,7 +139,7 @@ final class EditLostItemFoundDateView: ExtendedTouchAreaView {
     }
 
     @objc func dismissDropdown() {
-        UIView.animate(withDuration: 0.1) { [weak self] in
+        UIView.animate(withDuration: 0.2) { [weak self] in
             guard let self else { return }
             dropdownView.alpha = 0
             dropdownView.transform = CGAffineTransform(translationX: 0, y: -20)

Koin/Presentation/LostItem/PostLostItem/PostLostItemViewController.swift

@@ -187,6 +187,8 @@ extension PostLostItemViewController: UITextViewDelegate, PHPickerViewController
         return allCellData
     }
     private func writeButtonTapped() {
+        dismissKeyboardDropdown()
+        
         var isAllValid = true
         for index in 0..<addLostItemCollectionView.numberOfItems(inSection: 0) {
             let indexPath = IndexPath(item: index, section: 0)

Koin/Presentation/LostItem/PostLostItem/SubViews/AddLostItemCollectionView/AddLostItemCollectionViewCell.swift

@@ -224,6 +224,9 @@ final class AddLostItemCollectionViewCell: UICollectionViewCell {
         dropdownView.valueChangedPublisher.sink { [weak self] in
             self?.dropdownValueChanged()
             }.store(in: &cancellable)
+        dropdownView.dismissDropdownPublisher.sink { [weak self] in
+            self?.shouldDismissDropDownPublisher.send(nil)
+        }.store(in: &cancellable)
     }
     required init?(coder: NSCoder) {
         fatalError("init(coder:) has not been implemented")

Koin/Presentation/LostItem/PostLostItem/SubViews/DatePickerDropdownView.swift

@@ -7,45 +7,109 @@
 
 import UIKit
 import Combine
+import SnapKit
 
 final class DatePickerDropdownView: UIView {
 
+    // MARK: - Properties
     let valueChangedPublisher = PassthroughSubject<Void, Never>()
+    let dismissDropdownPublisher = PassthroughSubject<Void, Never>()
+    
     var dateValue: Date {
         get { return datePicker.date }
         set { datePicker.date = newValue }
     }
 
+    // MARK: - UI Components
     private let datePicker = UIDatePicker().then {
         $0.datePickerMode = .date
         $0.preferredDatePickerStyle = .wheels
         $0.locale = Locale(identifier: "ko_KR")
         $0.minimumDate = Calendar.current.date(byAdding: .year, value: -10, to: Date())
         $0.maximumDate = Date()
     }
+    private let separatorView = UIView().then {
+        $0.backgroundColor = .appColor(.neutral200)
+    }
+    private let resetButton = UIButton().then {
+        $0.setAttributedTitle(NSAttributedString(
+            string: "초기화",
+            attributes: [
+                .font : UIFont.appFont(.pretendardMedium, size: 14),
+                .foregroundColor : UIColor.appColor(.primary600)
+            ]), for: .normal)
+    }
+    private let applyButton = UIButton().then {
+        $0.setAttributedTitle(NSAttributedString(
+            string: "확인",
+            attributes: [
+                .font : UIFont.appFont(.pretendardMedium, size: 14),
+                .foregroundColor : UIColor.appColor(.primary600)
+            ]), for: .normal)
+    }
 
-    var onDateSelected: ((Date) -> Void)?
-    
+    // MARK: - Initializer
     override init(frame: CGRect) {
         super.init(frame: frame)
-        setupView()
+        configureView()
+        setAddTargets()
         datePicker.addTarget(self, action: #selector(datePickerValueChagned), for: .valueChanged)
     }
 
     required init?(coder: NSCoder) {
         fatalError("init(coder:) has not been implemented")
     }
+}
+
+extension DatePickerDropdownView {
+    
+    private func setAddTargets() {
+        resetButton.addTarget(self, action: #selector(resetButtonTapped), for: .touchUpInside)
+        applyButton.addTarget(self, action: #selector(applyButtonTapped), for: .touchUpInside)
+    }
+    
+    @objc private func resetButtonTapped() {
+        dateValue = Date()
+        datePickerValueChagned()
+    }
+    
+    @objc private func applyButtonTapped() {
+        dismissDropdownPublisher.send()
+    }
+}
+
+extension DatePickerDropdownView {
+    
+    private func setUpLayouts() {
+        [datePicker, separatorView, applyButton, resetButton].forEach {
+            addSubview($0)
+        }
+    }
+    private func setUpConstraints() {
+        datePicker.snp.makeConstraints {
+            $0.top.leading.trailing.equalToSuperview()
+            $0.height.equalTo(114)
+        }
+        separatorView.snp.makeConstraints {
+            $0.top.equalTo(datePicker.snp.bottom)
+            $0.leading.trailing.equalToSuperview()
+            $0.height.equalTo(1)
+        }
+        applyButton.snp.makeConstraints {
+            $0.top.equalTo(separatorView.snp.bottom).offset(10)
+            $0.trailing.equalToSuperview().offset(-40)
+            $0.bottom.equalToSuperview().offset(-14)
+            $0.height.equalTo(22)
+        }
+        resetButton.snp.makeConstraints {
+            $0.height.centerY.equalTo(applyButton)
+            $0.trailing.equalTo(applyButton.snp.leading).offset(-16)
+        }
+    }
 
-    private func setupView() {
-        addSubview(datePicker)
-        datePicker.translatesAutoresizingMaskIntoConstraints = false
-        NSLayoutConstraint.activate([
-            datePicker.leadingAnchor.constraint(equalTo: leadingAnchor),
-            datePicker.trailingAnchor.constraint(equalTo: trailingAnchor),
-            datePicker.topAnchor.constraint(equalTo: topAnchor),
-            datePicker.bottomAnchor.constraint(equalTo: bottomAnchor),
-            heightAnchor.constraint(equalToConstant: 114)
-        ])
+    private func configureView(){
+        setUpLayouts()
+        setUpConstraints()
 
         DispatchQueue.main.async {
             self.updatePickerTextColor()