[Feature] 마음 등록 구현 (#45)

dnd-side-project · Feb 4, 2024 · 2e3b100 · 2e3b100
1 parent d327411
commit 2e3b100
Show file tree

Hide file tree

Showing 24 changed files with 1,065 additions and 59 deletions.
diff --git a/.../src/main/kotlin/ac/dnd/bookkeeping/android/presentation/common/view/BottomSheetScreen.kt b/.../src/main/kotlin/ac/dnd/bookkeeping/android/presentation/common/view/BottomSheetScreen.kt
@@ -42,7 +42,10 @@ fun BottomSheetScreen(
                 .fillMaxWidth()
                 .wrapContentHeight(),
             color = Color.White,
-            shape = RoundedCornerShape(topStart = 10.dp, topEnd = 10.dp)
+            shape = RoundedCornerShape(
+                topStart = 12.dp,
+                topEnd = 12.dp
+            )
         ) {
             content()
         }

diff --git a/...tion/src/main/kotlin/ac/dnd/bookkeeping/android/presentation/common/view/chip/ChipItem.kt b/...tion/src/main/kotlin/ac/dnd/bookkeeping/android/presentation/common/view/chip/ChipItem.kt
@@ -21,20 +21,21 @@ import androidx.compose.material.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 
 @Composable
 fun ChipItem(
     chipType: ChipType = ChipType.LESS_BORDER,
-    currentSelectedId: Long,
+    currentSelectedId: Set<Long>,
     chipId: Long,
     chipText: String,
     chipCount: Int = 0,
     onSelectChip: (chipId: Long) -> Unit
 ) {
-    val isSelected = currentSelectedId == chipId
+    val isSelected = chipId in currentSelectedId
     val backgroundColor = animateColorAsState(
         targetValue = when (chipType) {
             ChipType.MAIN -> if (isSelected) Gray700 else Gray000
@@ -59,6 +60,7 @@ fun ChipItem(
 
     Row(
         modifier = Modifier
+            .clip(RoundedCornerShape(100.dp))
             .background(
                 color = backgroundColor.value,
                 shape = RoundedCornerShape(100.dp)
@@ -68,13 +70,13 @@ fun ChipItem(
                 width = 1.dp,
                 shape = RoundedCornerShape(100.dp)
             )
+            .clickable {
+                onSelectChip(chipId)
+            }
             .padding(
                 horizontal = 14.dp,
                 vertical = 6.5.dp
-            )
-            .clickable {
-                onSelectChip(chipId)
-            },
+            ),
         verticalAlignment = Alignment.CenterVertically,
         horizontalArrangement = Arrangement.Center
     ) {
@@ -102,15 +104,15 @@ fun ChipsType1Preview(){
     Row(horizontalArrangement = Arrangement.spacedBy(6.dp)){
         ChipItem(
             chipType = ChipType.LESS_BORDER,
-        currentSelectedId = 0,
+        currentSelectedId = setOf(0),
         chipId = 0,
         chipText = "가족",
         chipCount = 5,
         onSelectChip = {}
         )
         ChipItem(
             chipType = ChipType.LESS_BORDER,
-            currentSelectedId = 0,
+            currentSelectedId = setOf(0),
             chipId = 1,
             chipText = "친구",
             chipCount = 0,
@@ -125,15 +127,15 @@ fun ChipsType2Preview(){
     Row(horizontalArrangement = Arrangement.spacedBy(6.dp)){
         ChipItem(
             chipType = ChipType.BORDER,
-            currentSelectedId = 0,
+            currentSelectedId = setOf(0),
             chipId = 0,
             chipText = "가족",
             chipCount = 5,
             onSelectChip = {}
         )
         ChipItem(
             chipType = ChipType.BORDER,
-            currentSelectedId = 0,
+            currentSelectedId = setOf(0),
             chipId = 1,
             chipText = "친구",
             chipCount = 0,
@@ -148,15 +150,15 @@ fun ChipsType3Preview(){
     Row(horizontalArrangement = Arrangement.spacedBy(6.dp)){
         ChipItem(
             chipType = ChipType.MAIN,
-            currentSelectedId = 0,
+            currentSelectedId = setOf(0),
             chipId = 0,
             chipText = "가족",
             chipCount = 5,
             onSelectChip = {}
         )
         ChipItem(
             chipType = ChipType.MAIN,
-            currentSelectedId = 0,
+            currentSelectedId = setOf(0),
             chipId = 1,
             chipText = "친구",
             chipCount = 0,

diff --git a/...kotlin/ac/dnd/bookkeeping/android/presentation/common/view/chip/GroupChipListComponent.kt b/...kotlin/ac/dnd/bookkeeping/android/presentation/common/view/chip/GroupChipListComponent.kt
@@ -21,7 +21,7 @@ fun GroupChipListComponent(
         items(groups) { group ->
             ChipItem(
                 chipType = chipType,
-                currentSelectedId = currentSelectedId,
+                currentSelectedId = setOf(currentSelectedId),
                 chipId = group.id,
                 chipText = group.name,
                 chipCount = group.relations.size,

diff --git a/...lin/ac/dnd/bookkeeping/android/presentation/common/view/component/FieldSelectComponent.kt b/...lin/ac/dnd/bookkeeping/android/presentation/common/view/component/FieldSelectComponent.kt
@@ -0,0 +1,83 @@
+package ac.dnd.bookkeeping.android.presentation.common.view.component
+
+import ac.dnd.bookkeeping.android.presentation.R
+import ac.dnd.bookkeeping.android.presentation.common.theme.Body1
+import ac.dnd.bookkeeping.android.presentation.common.theme.Gray000
+import ac.dnd.bookkeeping.android.presentation.common.theme.Gray400
+import ac.dnd.bookkeeping.android.presentation.common.theme.Gray800
+import ac.dnd.bookkeeping.android.presentation.common.theme.Primary4
+import ac.dnd.bookkeeping.android.presentation.common.theme.Shapes
+import ac.dnd.bookkeeping.android.presentation.common.theme.Space12
+import ac.dnd.bookkeeping.android.presentation.common.theme.Space16
+import ac.dnd.bookkeeping.android.presentation.common.theme.Space48
+import androidx.compose.foundation.Image
+import androidx.compose.foundation.background
+import androidx.compose.foundation.border
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.material.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+
+@Composable
+fun FieldSelectComponent(
+    isSelected: Boolean,
+    text: String,
+    onClick: () -> Unit
+) {
+    Box(
+        modifier = Modifier
+            .clip(Shapes.medium)
+            .background(color = Gray000)
+            .border(
+                width = 1.dp,
+                color = if (isSelected) Primary4 else Gray400,
+                shape = Shapes.medium
+            )
+            .fillMaxWidth()
+            .height(Space48)
+            .clickable {
+                onClick()
+            }
+            .padding(
+                start = Space16,
+                end = Space12,
+                top = Space12,
+                bottom = Space12
+            )
+    ) {
+        Text(
+            text = text,
+            style = Body1.merge(
+                color = Gray800,
+                fontWeight = FontWeight.Normal
+            ),
+            modifier = Modifier.align(Alignment.CenterStart)
+        )
+
+        Image(
+            painter = painterResource(R.drawable.ic_chevron_right),
+            contentDescription = null,
+            modifier = Modifier.align(Alignment.CenterEnd)
+        )
+    }
+}
+
+@Preview(backgroundColor = 0xFFFFFFFF, showBackground = true)
+@Composable
+fun FieldSelectComponentPreview() {
+    FieldSelectComponent(
+        isSelected = true,
+        text = "2024/01/10",
+        onClick = {}
+    )
+}
diff --git a/...in/ac/dnd/bookkeeping/android/presentation/common/view/component/FieldSubjectComponent.kt b/...in/ac/dnd/bookkeeping/android/presentation/common/view/component/FieldSubjectComponent.kt
@@ -0,0 +1,55 @@
+package ac.dnd.bookkeeping.android.presentation.common.view.component
+
+import ac.dnd.bookkeeping.android.presentation.R
+import ac.dnd.bookkeeping.android.presentation.common.theme.Body1
+import ac.dnd.bookkeeping.android.presentation.common.theme.Gray700
+import androidx.compose.foundation.Image
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.width
+import androidx.compose.material.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.alpha
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.unit.dp
+
+@Composable
+fun FieldSubject(
+    subject: String,
+    isViewIcon: Boolean = true
+) {
+    Column {
+        Row {
+            Text(
+                text = subject,
+                style = Body1.merge(
+                    color = Gray700,
+                    fontWeight = FontWeight.SemiBold
+                )
+            )
+            Spacer(modifier = Modifier.width(1.dp))
+            Box(
+                modifier = Modifier
+                    .height(21.dp)
+                    .alpha(if (isViewIcon) 100f else 0f)
+                    .padding(bottom = 3.dp),
+                contentAlignment = Alignment.Center
+            ) {
+                Image(
+                    painter = painterResource(R.drawable.ic_essential_field),
+                    contentDescription = null
+                )
+            }
+        }
+        Spacer(
+            modifier = Modifier.height(18.dp)
+        )
+    }
+}
diff --git a/...otlin/ac/dnd/bookkeeping/android/presentation/common/view/textfield/PriceChipComponent.kt b/...otlin/ac/dnd/bookkeeping/android/presentation/common/view/textfield/PriceChipComponent.kt
@@ -25,6 +25,7 @@ import androidx.compose.runtime.remember
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.text.font.FontWeight
@@ -58,10 +59,8 @@ fun PriceChipComponent(
             )
             Row(
                 modifier = Modifier
-                    .background(
-                        color = backgroundColorState.value,
-                        shape = Shapes.medium
-                    )
+                    .clip(Shapes.medium)
+                    .background(color = backgroundColorState.value)
                     .clickable {
                         onClickChip(money)
                         scope.launch {

diff --git a/.../kotlin/ac/dnd/bookkeeping/android/presentation/common/view/textfield/TypingPriceField.kt b/.../kotlin/ac/dnd/bookkeeping/android/presentation/common/view/textfield/TypingPriceField.kt
@@ -9,6 +9,7 @@ import ac.dnd.bookkeeping.android.presentation.common.theme.Headline3
 import ac.dnd.bookkeeping.android.presentation.common.theme.Negative
 import ac.dnd.bookkeeping.android.presentation.common.theme.Primary3
 import ac.dnd.bookkeeping.android.presentation.common.util.expansion.NumberCommaTransformation
+import ac.dnd.bookkeeping.android.presentation.common.view.component.FieldSubject
 import androidx.compose.animation.animateColorAsState
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
@@ -62,7 +63,7 @@ fun TypingPriceField(
     textFieldHeight: Dp = 35.dp,
     keyboardOptions: KeyboardOptions = KeyboardOptions(keyboardType = KeyboardType.NumberPassword),
     textFormat : VisualTransformation = NumberCommaTransformation(),
-    fieldSubjectContent: (@Composable () -> Unit) = { FieldSubject() },
+    fieldSubjectContent: (@Composable () -> Unit) = { FieldSubject("금액") },
     leadingIconContent: (@Composable () -> Unit)? = null,
     trailingIconContent: (@Composable () -> Unit)? = null,
     errorMessageContent: (@Composable () -> Unit) = { },
@@ -154,37 +155,6 @@ fun TypingPriceField(
         )
         errorMessageContent()
     }
-
-}
-
-@Composable
-private fun FieldSubject() {
-    Column {
-        Row {
-            Text(
-                text = "금액",
-                style = Body1.merge(
-                    color = Gray700,
-                    fontWeight = FontWeight.SemiBold
-                )
-            )
-            Spacer(modifier = Modifier.width(1.dp))
-            Box(
-                modifier = Modifier
-                    .height(21.dp)
-                    .padding(bottom = 3.dp),
-                contentAlignment = Alignment.Center
-            ) {
-                Image(
-                    painter = painterResource(R.drawable.ic_essential_field),
-                    contentDescription = null
-                )
-            }
-        }
-        Spacer(
-            modifier = Modifier.height(18.dp)
-        )
-    }
 }
 
 @Composable

diff --git a/...n/kotlin/ac/dnd/bookkeeping/android/presentation/common/view/textfield/TypingTextField.kt b/...n/kotlin/ac/dnd/bookkeeping/android/presentation/common/view/textfield/TypingTextField.kt
@@ -25,6 +25,7 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.wrapContentHeight
 import androidx.compose.foundation.text.BasicTextField
+import androidx.compose.foundation.text.KeyboardActions
 import androidx.compose.foundation.text.KeyboardOptions
 import androidx.compose.material.ExperimentalMaterialApi
 import androidx.compose.material.Icon
@@ -113,6 +114,9 @@ fun TypingTextField(
                 singleLine = isSingleLine,
                 minLines = if (isSingleLine) 1 else 3,
                 keyboardOptions = keyboardOptions,
+                keyboardActions = KeyboardActions(
+
+                ),
                 cursorBrush = SolidColor(value = currentColorState.value),
                 interactionSource = interactionSource,
             ) { textField ->

diff --git a/...main/kotlin/ac/dnd/bookkeeping/android/presentation/ui/main/home/history/HistoryScreen.kt b/...main/kotlin/ac/dnd/bookkeeping/android/presentation/ui/main/home/history/HistoryScreen.kt
@@ -4,6 +4,7 @@ import ac.dnd.bookkeeping.android.presentation.common.util.ErrorObserver
 import ac.dnd.bookkeeping.android.presentation.ui.main.ApplicationState
 import ac.dnd.bookkeeping.android.presentation.ui.main.home.history.main.HistoryMainModel
 import ac.dnd.bookkeeping.android.presentation.ui.main.home.history.main.HistoryMainScreen
+import ac.dnd.bookkeeping.android.presentation.ui.main.home.history.main.HistoryMainViewModel
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
 import androidx.hilt.navigation.compose.hiltViewModel
@@ -12,7 +13,7 @@ import androidx.lifecycle.compose.collectAsStateWithLifecycle
 @Composable
 fun HistoryScreen(
     appState: ApplicationState,
-    viewModel: HistoryViewModel = hiltViewModel()
+    viewModel: HistoryMainViewModel = hiltViewModel()
 ) {
 
     val model: HistoryMainModel = Unit.let {