Merge pull request #64 from SOPT-all/feat/ui-add-study

[feat] add study와 split study UI 구현
SOPT-all · Jan 23, 2025 · 59e9c99 · 59e9c99
2 parents 1fe3189 + a325f3c
commit 59e9c99
Show file tree

Hide file tree

Showing 29 changed files with 2,250 additions and 30 deletions.
diff --git a/.../org/android/bbangzip/presentation/component/bottomsheet/BbangZipDatePickerBottomSheet.kt b/.../org/android/bbangzip/presentation/component/bottomsheet/BbangZipDatePickerBottomSheet.kt
@@ -14,7 +14,11 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
+import org.android.bbangzip.presentation.component.button.BbangZipButton
+import org.android.bbangzip.presentation.component.wheelpicker.BbangZipDatePicker
 import org.android.bbangzip.presentation.model.Date
+import org.android.bbangzip.presentation.type.BbangZipButtonSize
+import org.android.bbangzip.presentation.type.BbangZipButtonType
 import org.android.bbangzip.ui.theme.BbangZipTheme
 
 @OptIn(ExperimentalMaterial3Api::class)
@@ -23,9 +27,9 @@ fun BbangZipDatePickerBottomSheet(
     isBottomSheetVisible: Boolean,
     modifier: Modifier = Modifier,
     bottomSheetTitle: String,
-    selectedDate: Date? = null,
+    selectedDate: Date,
     onSelectedDateChanged: (Date) -> Unit = {},
-    onClickInputButton: (Date) -> Unit = {},
+    onClickInputButton: () -> Unit = {},
     onDismissRequest: () -> Unit = {},
 ) {
     BbangZipBasicModalBottomSheet(
@@ -46,13 +50,21 @@ fun BbangZipDatePickerBottomSheet(
         content = {
             Spacer(modifier = Modifier.height(24.dp))
 
-            // TODO Picker 넣기, padding horizontal 24 넣기
+            BbangZipDatePicker(
+                onConfirm = onSelectedDateChanged,
+                currentDate = selectedDate,
+            )
 
             Spacer(modifier = Modifier.height(24.dp))
         },
         interactButton = {
-            // TODO Button 넣기, Button 클릭 시에 onClickInputButton() 전달
-
+            BbangZipButton(
+                bbangZipButtonType = BbangZipButtonType.Solid,
+                bbangZipButtonSize = BbangZipButtonSize.Large,
+                onClick = onClickInputButton,
+                label = "시험 일자 입력하기",
+                isEnable = true,
+            )
             Spacer(modifier = Modifier.height(16.dp))
         },
     )
@@ -67,5 +79,6 @@ private fun BbangZipDatePickerBottomSheetPreview() {
         isBottomSheetVisible = isBottomSheetVisible,
         bottomSheetTitle = "언제까지 공부할까요?",
         onDismissRequest = { isBottomSheetVisible = !isBottomSheetVisible },
+        selectedDate = Date("2025", "1", "21"),
     )
 }
diff --git a/.../org/android/bbangzip/presentation/component/bottomsheet/BbangZipListPickerBottomSheet.kt b/.../org/android/bbangzip/presentation/component/bottomsheet/BbangZipListPickerBottomSheet.kt
@@ -52,8 +52,11 @@ fun BbangZipListPickerBottomSheet(
                         modifier =
                             Modifier
                                 .fillMaxWidth()
-                                .padding(vertical = 8.dp)
-                                .applyFilterOnClick { onSelectedItemChanged(index) },
+                                .applyFilterOnClick(
+                                    radius = 16.dp,
+                                    isDisabled = false,
+                                ) { onSelectedItemChanged((index + 1)) }
+                                .padding(vertical = 8.dp),
                         textAlign = TextAlign.Center,
                         style = BbangZipTheme.typography.body1Bold,
                         color = BbangZipTheme.colors.labelNormal_282119,
@@ -68,7 +71,7 @@ fun BbangZipListPickerBottomSheet(
 @Composable
 private fun BbangZipListPickerBottomSheetPreview() {
     var isBottomSheetVisible by rememberSaveable { mutableStateOf(true) }
-    var selectedPiece by rememberSaveable { mutableStateOf<Int?>(null) }
+    var selectedPiece by rememberSaveable { mutableStateOf<String>("") }
 
     BBANGZIPTheme {
         BbangZipListPickerBottomSheet(
@@ -95,7 +98,7 @@ private fun BbangZipListPickerBottomSheetPreview() {
                     "6조각",
                 ),
             onSelectedItemChanged = { index ->
-                selectedPiece = index
+                selectedPiece = index.toString()
                 isBottomSheetVisible = !isBottomSheetVisible
             },
         )

diff --git a/...main/java/org/android/bbangzip/presentation/component/textfield/BbangZipBasicTextField.kt b/...main/java/org/android/bbangzip/presentation/component/textfield/BbangZipBasicTextField.kt
@@ -47,7 +47,6 @@ import org.android.bbangzip.presentation.model.getIconColor
 import org.android.bbangzip.presentation.util.modifier.noRippleClickable
 import org.android.bbangzip.ui.theme.BBANGZIPTheme
 import org.android.bbangzip.ui.theme.BbangZipTheme
-import timber.log.Timber
 
 @Composable
 fun BbangZipBasicTextField(
@@ -107,7 +106,6 @@ fun BbangZipBasicTextField(
                         .onFocusChanged { focusState ->
                             isFocused = focusState.isFocused
                             onFocusChange(focusState.isFocused)
-                            Timber.d("[TextField] onFocusChange -> $isFocused")
                         }
                         .onKeyEvent { keyEvent ->
                             if (keyEvent.key == Key.Enter && keyEvent.type == KeyEventType.KeyUp) {

diff --git a/...ain/java/org/android/bbangzip/presentation/component/textfield/BbangZipSimpleTextField.kt b/...ain/java/org/android/bbangzip/presentation/component/textfield/BbangZipSimpleTextField.kt
@@ -8,6 +8,8 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.foundation.text.BasicTextField
+import androidx.compose.foundation.text.KeyboardActions
+import androidx.compose.foundation.text.KeyboardOptions
 import androidx.compose.material3.Icon
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
@@ -16,13 +18,22 @@ import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.focus.FocusManager
 import androidx.compose.ui.focus.FocusRequester
 import androidx.compose.ui.focus.focusRequester
 import androidx.compose.ui.focus.onFocusChanged
 import androidx.compose.ui.graphics.SolidColor
 import androidx.compose.ui.graphics.vector.ImageVector
+import androidx.compose.ui.input.key.Key
+import androidx.compose.ui.input.key.KeyEventType
+import androidx.compose.ui.input.key.key
+import androidx.compose.ui.input.key.onKeyEvent
+import androidx.compose.ui.input.key.type
+import androidx.compose.ui.platform.LocalFocusManager
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.res.vectorResource
+import androidx.compose.ui.text.input.ImeAction
+import androidx.compose.ui.text.input.KeyboardType
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import org.android.bbangzip.R
@@ -39,13 +50,25 @@ import org.android.bbangzip.ui.theme.defaultBbangZipColors
 fun BbangZipSimpleTextField(
     @DrawableRes leadingIcon: Int,
     @StringRes placeholder: Int,
-    @StringRes guideline: Int,
+    guideline: String,
     value: String,
+    isEnable: Boolean = true,
     modifier: Modifier = Modifier,
     bbangZipTextFieldInputState: BbangZipTextFieldInputState = BbangZipTextFieldInputState.Default,
-    onFocusChange: () -> Unit = { },
+    onFocusChange: (Boolean) -> Unit = { },
     onValueChange: (String) -> Unit = { },
+    focusManager: FocusManager,
+    keyboardOptions: KeyboardOptions = KeyboardOptions.Default.copy(imeAction = ImeAction.Default),
+    keyboardActions: KeyboardActions =
+        KeyboardActions(
+            onDone = {
+                val trimmedValue = value.trim()
+                onValueChange(trimmedValue)
+                focusManager.clearFocus(force = true)
+            },
+        ),
 ) {
+    var isFocused by remember { mutableStateOf(false) }
     BbangZipTextFieldSlot(
         columnModifier = modifier,
         rowModifier =
@@ -63,14 +86,36 @@ fun BbangZipSimpleTextField(
         },
         content = {
             BasicTextField(
+                enabled = isEnable,
                 modifier =
                     Modifier
                         .weight(1f)
                         .padding(start = 8.dp)
                         .focusRequester(FocusRequester())
-                        .onFocusChanged { if (it.isFocused) onFocusChange() },
+                        .onFocusChanged { focusState ->
+                            isFocused = focusState.isFocused
+                            onFocusChange(focusState.isFocused)
+                        }
+                        .onKeyEvent { keyEvent ->
+                            if (keyEvent.key == Key.Enter && keyEvent.type == KeyEventType.KeyUp) {
+                                focusManager.clearFocus(force = true)
+                                onFocusChange(false)
+                                true
+                            } else {
+                                false
+                            }
+                        },
                 value = value,
-                onValueChange = { onValueChange(it) },
+                onValueChange = { input ->
+                    val filteredInput = input.filter { it.isDigit() }
+                    if (filteredInput.length <= 3) onValueChange(filteredInput)
+                },
+                keyboardActions = keyboardActions,
+                keyboardOptions =
+                    keyboardOptions.copy(
+                        imeAction = ImeAction.Done,
+                        keyboardType = KeyboardType.Number,
+                    ),
                 cursorBrush = SolidColor(BbangZipTheme.colors.labelNormal_282119),
                 singleLine = true,
                 textStyle = BbangZipTheme.typography.label1Medium,
@@ -89,7 +134,7 @@ fun BbangZipSimpleTextField(
         },
         guideline = {
             Text(
-                text = stringResource(id = guideline),
+                text = guideline,
                 modifier =
                     Modifier
                         .padding(start = 8.dp, top = 4.dp),
@@ -126,7 +171,7 @@ fun BbangZipSimpleTextFieldPreview() {
         BbangZipSimpleTextField(
             leadingIcon = R.drawable.ic_page_check_default_24,
             placeholder = R.string.app_name,
-            guideline = R.string.app_name,
+            guideline = "빵집",
             value = text,
             bbangZipTextFieldInputState = validationState,
             onFocusChange = {
@@ -136,6 +181,7 @@ fun BbangZipSimpleTextFieldPreview() {
                 text = newValue
                 validateText(text = newValue)
             },
+            focusManager = LocalFocusManager.current,
         )
     }
 }
diff --git a/app/src/main/java/org/android/bbangzip/presentation/component/topbar/BbangZipMenuTopBar.kt b/app/src/main/java/org/android/bbangzip/presentation/component/topbar/BbangZipMenuTopBar.kt
@@ -67,12 +67,12 @@ fun BbangZipBaseTopBar(
                         contentDescription = null,
                         modifier =
                             Modifier
-                                .padding(8.dp)
                                 .applyFilterOnClick(
                                     radius = 20.dp,
                                     isDisabled = false,
                                     onClick = { onLeadingIconClick() },
-                                ),
+                                )
+                                .padding(8.dp),
                         tint = BbangZipTheme.colors.labelAlternative_282119_61,
                     )
                 }

diff --git a/...c/main/java/org/android/bbangzip/presentation/component/wheelpicker/BbangZipDatePicker.kt b/...c/main/java/org/android/bbangzip/presentation/component/wheelpicker/BbangZipDatePicker.kt
@@ -28,11 +28,11 @@ fun BbangZipDatePicker(
         modifier = Modifier.fillMaxWidth(),
     ) {
         val years = DateConstants.YEARS_LIST
-        val yearPickerState by remember { mutableStateOf("") }
+        var yearPickerState by remember { mutableStateOf(currentDate.year) }
         val startYear = currentDate.year.toInt() - DateConstants.YEAR_OF_TODAY
 
         val months = DateConstants.MONTHS_LIST
-        val monthsPickerState by remember { mutableStateOf("") }
+        var monthsPickerState by remember { mutableStateOf(currentDate.month) }
         val startMonth = currentDate.month.toInt() - 1
 
         val days =
@@ -41,7 +41,7 @@ fun BbangZipDatePicker(
                 val month = monthsPickerState.filter { it.isDigit() }.toIntOrNull() ?: 1
                 (1..getDaysInMonth(year, month)).map { it.toString() + "일" }
             }
-        val daysPickerState by remember { mutableStateOf("") }
+        var daysPickerState by remember { mutableStateOf(currentDate.day) }
         val startDay = currentDate.day.toInt() - 1
 
         LaunchedEffect(yearPickerState, monthsPickerState, daysPickerState) {
@@ -60,18 +60,21 @@ fun BbangZipDatePicker(
         // 3개 picker에 weight 부여해서 대충 피그마와 비슷하게 동적으로 되게 구현해봤는데 어떤가요..
         BbangZipPicker(
             items = years,
+            onItemChanged = { yearPickerState = it },
             modifier = Modifier.weight(5f),
             startIndex = startYear,
         )
 
         BbangZipPicker(
             items = months,
+            onItemChanged = { monthsPickerState = it },
             modifier = Modifier.weight(3f),
             startIndex = startMonth,
         )
 
         BbangZipPicker(
             items = days,
+            onItemChanged = { daysPickerState = it },
             modifier = Modifier.weight(3f),
             startIndex = startDay,
         )

diff --git a/app/src/main/java/org/android/bbangzip/presentation/model/AddStudyData.kt b/app/src/main/java/org/android/bbangzip/presentation/model/AddStudyData.kt
@@ -0,0 +1,18 @@
+package org.android.bbangzip.presentation.model
+
+import android.os.Parcelable
+import kotlinx.parcelize.Parcelize
+import kotlinx.serialization.Serializable
+
+@Serializable
+@Parcelize
+data class AddStudyData(
+    val subjectName: String,
+    val pieceNumber: Int,
+    val examDate: String,
+    val studyContent: String,
+    val startPage: String,
+    val endPage: String,
+    val startPageList: List<String>,
+    val endPageList: List<String>,
+) : Parcelable
diff --git a/app/src/main/java/org/android/bbangzip/presentation/model/SplitStudyData.kt b/app/src/main/java/org/android/bbangzip/presentation/model/SplitStudyData.kt
@@ -0,0 +1,21 @@
+package org.android.bbangzip.presentation.model
+
+import android.os.Parcelable
+import kotlinx.parcelize.Parcelize
+import kotlinx.serialization.Serializable
+import org.android.bbangzip.presentation.type.AddStudyViewType
+
+@Serializable
+@Parcelize
+data class SplitStudyData(
+    val subjectName: String,
+    val pieceNumber: Int,
+    val examDate: String,
+    val studyContent: String,
+    val startPage: String,
+    val endPage: String,
+    val startPageList: List<String>,
+    val endPageList: List<String>,
+    val deadLineList: List<String>,
+    val addStudyViewType: AddStudyViewType,
+) : Parcelable
diff --git a/app/src/main/java/org/android/bbangzip/presentation/type/AddStudyViewType.kt b/app/src/main/java/org/android/bbangzip/presentation/type/AddStudyViewType.kt
@@ -0,0 +1,9 @@
+package org.android.bbangzip.presentation.type
+
+import kotlinx.serialization.Serializable
+
+@Serializable
+enum class AddStudyViewType {
+    DEFAULT,
+    AGAIN,
+}
diff --git a/app/src/main/java/org/android/bbangzip/presentation/type/ShortTextFieldType.kt b/app/src/main/java/org/android/bbangzip/presentation/type/ShortTextFieldType.kt
@@ -0,0 +1,6 @@
+package org.android.bbangzip.presentation.type
+
+enum class ShortTextFieldType {
+    LEFT,
+    RIGHT,
+}
diff --git a/app/src/main/java/org/android/bbangzip/presentation/ui/navigator/MainNavHost.kt b/app/src/main/java/org/android/bbangzip/presentation/ui/navigator/MainNavHost.kt
@@ -17,7 +17,11 @@ import org.android.bbangzip.presentation.ui.onboarding.navigation.navigateOnboar
 import org.android.bbangzip.presentation.ui.onboarding.navigation.onboardingEndNavGraph
 import org.android.bbangzip.presentation.ui.onboarding.navigation.onboardingNavGraph
 import org.android.bbangzip.presentation.ui.onboarding.navigation.onboardingStartNavGraph
+import org.android.bbangzip.presentation.ui.subject.addstudy.addStudyNavGraph
+import org.android.bbangzip.presentation.ui.subject.addstudy.navigateAddStudy
 import org.android.bbangzip.presentation.ui.subject.navigateSubject
+import org.android.bbangzip.presentation.ui.subject.splitstudy.navigateSplitStudy
+import org.android.bbangzip.presentation.ui.subject.splitstudy.splitStudyNavGraph
 import org.android.bbangzip.presentation.ui.subject.subjectNavGraph
 import org.android.bbangzip.presentation.ui.todo.navigation.todoNavGraph
 import org.android.bbangzip.presentation.ui.todo.pendingtodoadd.navigation.todoAddPendingNavGraph
@@ -83,7 +87,19 @@ fun MainNavHost(
                 navigateToBack = { navigator.navigateToMyBadgeCategory() },
             )
 
-            subjectNavGraph()
+            subjectNavGraph(
+                navigateAddStudy = { navigator.navHostController.navigateAddStudy(it) },
+            )
+
+            addStudyNavGraph(
+                padding = padding,
+                navigateSplitStudy = { navigator.navHostController.navigateSplitStudy(it) },
+            )
+
+            splitStudyNavGraph(
+                navigateBack = { navigator.navHostController.popBackStack() },
+                navigateAddStudy = { navigator.navHostController.navigateAddStudy(it) },
+            )
 
             todoNavGraph(
                 snackBarHostState = snackBarHostState,

diff --git a/app/src/main/java/org/android/bbangzip/presentation/ui/onboarding/OnboardingViewModel.kt b/app/src/main/java/org/android/bbangzip/presentation/ui/onboarding/OnboardingViewModel.kt
@@ -197,13 +197,11 @@ class OnboardingViewModel
                 is OnboardingContract.OnboardingReduce.UpdateCurrentPage -> state.copy(currentPage = reduce.nextPage)
                 is OnboardingContract.OnboardingReduce.UpdateUserNameTextFieldSate -> {
                     val checkedText = determineTextFieldType(reduce.userName, currentUiState.userNameFocusedState)
-                    Timber.d("[TextField] UpdateUserNameTextFieldSate -> ${reduce.userName} -> $checkedText")
                     state.copy(userNameTextFieldState = checkedText)
                 }
 
                 is OnboardingContract.OnboardingReduce.UpdateSubjectNameTextFieldSate -> {
                     val checkedText = determineTextFieldType(reduce.subject, currentUiState.subjectNameFocusedState)
-                    Timber.d("[온보딩] 텍스트 필드 -> ${reduce.subject} -> $checkedText")
                     state.copy(subjectNameTextFieldState = checkedText)
                 }