[feat] 번개 생성 개최 뷰 - 시간 / 날짜 뷰 구현

app/src/main/java/org/sopt/pingle/presentation/ui/main/plan/PlanDateDialogFragment.kt

@@ -0,0 +1,71 @@
+package org.sopt.pingle.presentation.ui.main.plan
+
+import android.os.Bundle
+import android.view.View
+import android.widget.NumberPicker
+import org.sopt.pingle.R
+import org.sopt.pingle.databinding.DialogDatePickerBinding
+import org.sopt.pingle.util.base.BindingBottomSheetDialogFragment
+
+class PlanDateDialogFragment(
+    private val onDialogClosed: (year: Int, month: Int, day: Int) -> Unit
+) :
+    BindingBottomSheetDialogFragment<DialogDatePickerBinding>(R.layout.dialog_date_picker) {
+
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+        isCancelable = false
+    }
+
+    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
+        super.onViewCreated(view, savedInstanceState)
+
+        initLayout()
+        addListeners()
+    }
+
+    private fun initLayout() {
+        val yearPicker = binding.npDatePickerYear
+        yearPicker.apply {
+            wrapSelectorWheel = false // 순한 안되게 막기
+            descendantFocusability = NumberPicker.FOCUS_BLOCK_DESCENDANTS // editText 설정 해제
+            minValue = YEAR_MIN
+            maxValue = YEAR_MAX
+        }
+
+        val hoursPicker = binding.npDatePickerMonth
+        hoursPicker.apply {
+            wrapSelectorWheel = false
+            descendantFocusability = NumberPicker.FOCUS_BLOCK_DESCENDANTS
+            minValue = MONTH_MIN
+            maxValue = MONTH_MAX
+        }
+        val dayPicker = binding.npDatePickerDay
+        dayPicker.apply {
+            wrapSelectorWheel = false
+            descendantFocusability = NumberPicker.FOCUS_BLOCK_DESCENDANTS
+            minValue = DAY_MIN
+            maxValue = DAY_MAX
+        }
+    }
+
+    private fun addListeners() {
+        binding.tvDatePickerDone.setOnClickListener {
+            onDialogClosed(
+                binding.npDatePickerYear.value,
+                binding.npDatePickerMonth.value,
+                binding.npDatePickerDay.value
+            )
+            dismiss()
+        }
+    }
+
+    companion object {
+        const val YEAR_MIN = 2024
+        const val YEAR_MAX = 2050
+        const val MONTH_MIN = 1
+        const val MONTH_MAX = 12
+        const val DAY_MIN = 1
+        const val DAY_MAX = 31
+    }
+}

app/src/main/java/org/sopt/pingle/presentation/ui/main/plan/PlanDateTimeFragment.kt

@@ -2,12 +2,89 @@ package org.sopt.pingle.presentation.ui.main.plan
 
 import android.os.Bundle
 import android.view.View
+import androidx.fragment.app.activityViewModels
+import java.text.SimpleDateFormat
+import java.time.LocalDate
 import org.sopt.pingle.R
 import org.sopt.pingle.databinding.FragmentPlanDateTimeBinding
 import org.sopt.pingle.util.base.BindingFragment
+import timber.log.Timber
 
-class PlanDateTimeFragment : BindingFragment<FragmentPlanDateTimeBinding>(R.layout.fragment_plan_date_time) {
+class PlanDateTimeFragment :
+    BindingFragment<FragmentPlanDateTimeBinding>(R.layout.fragment_plan_date_time) {
+    private val planViewModel: PlanViewModel by activityViewModels()
     override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
         super.onViewCreated(view, savedInstanceState)
+
+        addListeners()
+    }
+
+    private fun addListeners() {
+        binding.includePlanTextWithTitleDate.root.setOnClickListener {
+            val dialogDateFragment = PlanDateDialogFragment(::onDateDialogFragmentClosed)
+            dialogDateFragment.show(
+                parentFragmentManager,
+                dialogDateFragment.tag
+            )
+        }
+
+        binding.includePlanTextWithTitleStartTime.root.setOnClickListener {
+            val dialogStartTimeFragment = PlanTimeDialogFragment(::onTimeDialogFragmentClosed)
+            dialogStartTimeFragment.show(
+                parentFragmentManager,
+                dialogStartTimeFragment.tag
+            )
+            planViewModel.setSelectedTimeType(START_TIME)
+        }
+
+        binding.includePlanTextWithTitleEndTime.root.setOnClickListener {
+            val dialogEndTimeFragment = PlanTimeDialogFragment(::onTimeDialogFragmentClosed)
+            dialogEndTimeFragment.show(
+                parentFragmentManager,
+                dialogEndTimeFragment.tag
+            )
+            planViewModel.setSelectedTimeType(END_TIME)
+        }
+    }
+
+    // TODO format 관련 refactor
+    private fun onDateDialogFragmentClosed(year: Int, month: Int, day: Int) {
+        val dateFormat = SimpleDateFormat("yyyy-MM-dd")
+        val todayLocalDate = dateFormat.parse(LocalDate.now().toString())
+        val selectedFormatDate = String.format("%d-%02d-%02d", year, month, day)
+        val selectedLocalDate = dateFormat.parse(selectedFormatDate)
+
+        if (selectedLocalDate != null) {
+            if (selectedLocalDate.before(todayLocalDate)) {
+                // TODO 에러 스낵바 노출
+            } else {
+                binding.includePlanTextWithTitleDate.tvText.text = String.format(
+                    "%d년 %d월 %d일",
+                    year,
+                    month,
+                    day
+                )
+                planViewModel.setPlanDate(selectedFormatDate)
+            }
+        }
+    }
+
+    // TODO 시간 포맷 나오면 수정 예정
+    // TODO {} 수정 예정
+    private fun onTimeDialogFragmentClosed(time: String) {
+        when (planViewModel.selectedTimeType.value) {
+            START_TIME -> {
+                Timber.d(START_TIME)
+            }
+
+            END_TIME -> {
+                Timber.d(END_TIME)
+            }
+        }
+    }
+
+    companion object {
+        const val START_TIME = "startTime"
+        const val END_TIME = "endTime"
     }
 }

app/src/main/java/org/sopt/pingle/presentation/ui/main/plan/PlanTimeDialogFragment.kt

@@ -0,0 +1,76 @@
+package org.sopt.pingle.presentation.ui.main.plan
+
+import android.os.Bundle
+import android.view.View
+import android.widget.NumberPicker
+import org.sopt.pingle.R
+import org.sopt.pingle.databinding.DialogTimePickerBinding
+import org.sopt.pingle.util.base.BindingBottomSheetDialogFragment
+
+class PlanTimeDialogFragment(
+    private val onDialogClosed: (String) -> Unit
+) :
+    BindingBottomSheetDialogFragment<DialogTimePickerBinding>(R.layout.dialog_time_picker) {
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+        isCancelable = false
+    }
+
+    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
+        super.onViewCreated(view, savedInstanceState)
+
+        initLayout()
+        addListeners()
+    }
+
+    private fun initLayout() {
+        val meridiemPicker = binding.npTimePickerMeridiem
+        meridiemPicker.apply {
+            wrapSelectorWheel = false // 순한 안되게 막기
+            descendantFocusability = NumberPicker.FOCUS_BLOCK_DESCENDANTS // editText 설정 해제
+            minValue = 0
+            maxValue = 1
+            displayedValues = arrayOf("오전", "오후")
+        }
+
+        val hoursPicker = binding.npTimePickerHour
+        hoursPicker.apply {
+            wrapSelectorWheel = false // 순한 안되게 막기
+            descendantFocusability = NumberPicker.FOCUS_BLOCK_DESCENDANTS // editText 설정 해제
+            minValue = HOUR_MIN
+            maxValue = HOUR_MAX
+        }
+        val minutesPicker = binding.npTimePickerMinute
+        minutesPicker.apply {
+            wrapSelectorWheel = false // 순한 안되게 막기
+            descendantFocusability = NumberPicker.FOCUS_BLOCK_DESCENDANTS // editText 설정 해제
+            minValue = MINUTE_MIN
+            maxValue = MINUTE_MAX
+            setFormatter { value -> String.format("%02d", value) }
+        }
+    }
+
+    private fun addListeners() {
+        binding.tvTimePickerDone.setOnClickListener {
+            onDialogClosed("aaa")
+            // 시간 설정 후 editText에 띄우기
+//            with(binding) {
+//                val timeFormat =
+//                    String.format("%02d:%02d:00", npTimePickerHour.value, npTimePickerMinute.value)
+//                onDialogClosed(timeFormat)
+//                Log.d(
+//                    "aaa",
+//                    String.format("%02d:%02d:00", npTimePickerHour.value, npTimePickerMinute.value)
+//                )
+//            }
+            dismiss()
+        }
+    }
+
+    companion object {
+        const val HOUR_MIN = 1
+        const val HOUR_MAX = 12
+        const val MINUTE_MIN = 0
+        const val MINUTE_MAX = 59
+    }
+}

app/src/main/java/org/sopt/pingle/presentation/ui/main/plan/PlanViewModel.kt

@@ -7,11 +7,23 @@ import kotlinx.coroutines.flow.asStateFlow
 class PlanViewModel : ViewModel() {
     private val _currentPage = MutableStateFlow(FIRST_PAGE_POSITION)
     val currentPage get() = _currentPage.asStateFlow()
+    private val _planDate = MutableStateFlow<String?>(null)
+    val planDate get() = _planDate.asStateFlow()
+    private val _selectedTimeType = MutableStateFlow<String?>(null)
+    val selectedTimeType get() = _selectedTimeType.asStateFlow()
 
     fun setCurrentPage(position: Int) {
         _currentPage.value = position
     }
 
+    fun setPlanDate(planDate: String) {
+        _planDate.value = planDate
+    }
+
+    fun setSelectedTimeType(timeType: String) {
+        _selectedTimeType.value = timeType
+    }
+
     companion object {
         const val FIRST_PAGE_POSITION = 0
     }

app/src/main/java/org/sopt/pingle/util/component/PingleEditText.kt

@@ -10,11 +10,13 @@ import org.sopt.pingle.R
 import org.sopt.pingle.databinding.EditTextPingleBinding
 
 @SuppressLint("CustomViewStyleable")
-class PingleEditText(
+class PingleEditText @JvmOverloads constructor(
     context: Context,
-    attrs: AttributeSet
-) : ConstraintLayout(context, attrs) {
+    attrs: AttributeSet? = null,
+    defStyleAttr: Int = 0
+) : ConstraintLayout(context, attrs, defStyleAttr) {
     private lateinit var binding: EditTextPingleBinding
+    private var _etText: String? = null
 
     init {
         val typedArray = context.obtainStyledAttributes(attrs, R.styleable.pingleEditText)
@@ -33,6 +35,9 @@ class PingleEditText(
 
             val hint = getString(R.styleable.pingleEditText_hint)
             binding.etEditText.hint = hint
+
+            _etText = getString(R.styleable.pingleEditText_etText)
+            binding.etEditText.setText(_etText)
         }
     }
 }

app/src/main/res/layout/dialog_date_picker.xml

@@ -0,0 +1,60 @@
+<?xml version="1.0" encoding="utf-8"?>
+<layout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto">
+
+    <data>
+
+    </data>
+
+    <androidx.constraintlayout.widget.ConstraintLayout
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:background="@color/g_10">
+
+        <TextView
+            android:id="@+id/tv_date_picker_done"
+            android:layout_width="0dp"
+            android:layout_height="wrap_content"
+            android:background="@color/g_11"
+            android:paddingVertical="7dp"
+            android:paddingEnd="15dp"
+            android:text="Done"
+            android:textAlignment="textEnd"
+            android:textColor="@color/pingle_green"
+            android:textSize="18dp"
+            app:layout_constraintEnd_toEndOf="parent"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toTopOf="parent" />
+
+        <NumberPicker
+            android:id="@+id/np_date_picker_year"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_marginVertical="20dp"
+            android:layout_marginStart="44dp"
+            android:theme="@style/AppTheme.NumberPicker"
+            app:layout_constraintBottom_toBottomOf="parent"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toBottomOf="@+id/tv_date_picker_done" />
+
+        <NumberPicker
+            android:id="@+id/np_date_picker_month"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:theme="@style/AppTheme.NumberPicker"
+            app:layout_constraintBottom_toBottomOf="@+id/np_date_picker_year"
+            app:layout_constraintEnd_toEndOf="parent"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toTopOf="@+id/np_date_picker_year" />
+
+        <NumberPicker
+            android:id="@+id/np_date_picker_day"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_marginEnd="44dp"
+            android:theme="@style/AppTheme.NumberPicker"
+            app:layout_constraintBottom_toBottomOf="@+id/np_date_picker_month"
+            app:layout_constraintEnd_toEndOf="parent"
+            app:layout_constraintTop_toTopOf="@+id/np_date_picker_month" />
+    </androidx.constraintlayout.widget.ConstraintLayout>
+</layout>