feat: TextFieldButtonColor Gray 추가

YAPP-Github · Jan 24, 2024 · 4ef4f3b · 4ef4f3b
1 parent 9f5b51b
commit 4ef4f3b
Show file tree

Hide file tree

Showing 4 changed files with 45 additions and 10 deletions.
diff --git a/...designsystem/src/main/java/com/susu/core/designsystem/component/button/ClearIconButton.kt b/...designsystem/src/main/java/com/susu/core/designsystem/component/button/ClearIconButton.kt
@@ -3,25 +3,30 @@ package com.susu.core.designsystem.component.button
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.shape.CircleShape
+import androidx.compose.material3.Icon
 import androidx.compose.runtime.Composable
 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.unit.Dp
 import com.susu.core.designsystem.R
+import com.susu.core.designsystem.theme.Gray30
 import com.susu.core.ui.extension.susuClickable
 
 @Composable
 fun ClearIconButton(
     iconSize: Dp,
+    tint: Color = Gray30,
     onClick: () -> Unit,
 ) {
-    Image(
+    Icon(
         modifier = Modifier
             .clip(CircleShape)
             .size(iconSize)
             .susuClickable(onClick = onClick),
         painter = painterResource(id = R.drawable.ic_clear),
         contentDescription = "",
+        tint = tint,
     )
 }
diff --git a/...src/main/java/com/susu/core/designsystem/component/textfieldbutton/SusuTextFieldButton.kt b/...src/main/java/com/susu/core/designsystem/component/textfieldbutton/SusuTextFieldButton.kt
@@ -303,11 +303,11 @@ private fun InnerButtons(
     onClickCloseIcon: () -> Unit = {},
     onClickFilledButton: () -> Unit = {},
 ) {
-    val (innerButtonTextColor, innerButtonBackgroundColor) = with(color) {
+    val (innerButtonTextColor, innerButtonBackgroundColor, clearIconColor) = with(color) {
         when {
-            isFocused.not() -> (unFocusedContentColor to unFocusedBackgroundColor)
-            isActive || isSaved -> (activeContentColor to activeBackgroundColor)
-            else -> (inactiveContentColor to inactiveBackgroundColor)
+            isFocused.not() -> listOf(unFocusedContentColor, unFocusedBackgroundColor, activeClearIconColor)
+            isActive || isSaved -> listOf(activeContentColor, activeBackgroundColor, activeClearIconColor)
+            else -> listOf(inactiveContentColor, inactiveBackgroundColor, inactiveClearIconColor)
         }
     }
 
@@ -317,6 +317,7 @@ private fun InnerButtons(
                 ClearIconButton(
                     iconSize = clearIconSize,
                     onClick = onClickClearIcon,
+                    tint = clearIconColor,
                 )
             }
         }
@@ -423,7 +424,7 @@ fun TextFieldButtonPreview() {
                 onClickButton = { isFocused = !isFocused },
                 showClearIcon = false,
                 showCloseIcon = false,
-                color = TextFieldButtonColor.Orange,
+                color = TextFieldButtonColor.Gray,
                 style = LargeTextFieldButtonStyle.height46,
                 onClickFilledButton = { isSaved = isSaved.not() },
                 onClickClearIcon = { text = "" },
@@ -482,7 +483,7 @@ fun TextFieldButtonFocusedPreview() {
         ) {
             Text(text = "텍스트 길이에 딱 맞는 너비 (wrap)")
             SusuTextFieldWrapContentButton(
-                color = TextFieldButtonColor.Orange,
+                color = TextFieldButtonColor.Gray,
                 text = text,
                 onTextChange = { text = it },
                 placeholder = "",

diff --git a/...rc/main/java/com/susu/core/designsystem/component/textfieldbutton/TextFieldButtonColor.kt b/...rc/main/java/com/susu/core/designsystem/component/textfieldbutton/TextFieldButtonColor.kt
@@ -3,8 +3,11 @@ package com.susu.core.designsystem.component.textfieldbutton
 import androidx.compose.ui.graphics.Color
 import com.susu.core.designsystem.theme.Gray10
 import com.susu.core.designsystem.theme.Gray100
+import com.susu.core.designsystem.theme.Gray15
 import com.susu.core.designsystem.theme.Gray30
 import com.susu.core.designsystem.theme.Gray40
+import com.susu.core.designsystem.theme.Gray50
+import com.susu.core.designsystem.theme.Orange10
 import com.susu.core.designsystem.theme.Orange20
 import com.susu.core.designsystem.theme.Orange60
 
@@ -38,6 +41,16 @@ enum class TextFieldButtonColor(
         placeholderColor = Gray30,
         unFocusedTextColor = Gray10,
     ),
+    Gray(
+        buttonColor = TextButtonInnerButtonColor.Gray,
+        savedBackgroundColor = Orange10,
+        editBackgroundColor = Gray15,
+        unFocusedBackgroundColor = Gray15,
+        unFocusedTextColor = Gray50,
+        editTextColor = Gray100,
+        savedTextColor = Gray100,
+        placeholderColor = Gray40,
+    )
 }
 
 enum class TextButtonInnerButtonColor(
@@ -47,6 +60,8 @@ enum class TextButtonInnerButtonColor(
     val activeBackgroundColor: Color,
     val inactiveBackgroundColor: Color,
     val unFocusedBackgroundColor: Color,
+    val activeClearIconColor: Color,
+    val inactiveClearIconColor: Color,
     val rippleColor: Color,
 ) {
     Black(
@@ -56,6 +71,19 @@ enum class TextButtonInnerButtonColor(
         activeBackgroundColor = Gray100,
         inactiveBackgroundColor = Gray40,
         unFocusedBackgroundColor = Gray40,
+        activeClearIconColor = Gray30,
+        inactiveClearIconColor = Gray30,
+        rippleColor = Gray10,
+    ),
+    Gray(
+        activeContentColor = Gray10,
+        inactiveContentColor = Gray10,
+        unFocusedContentColor = Gray10,
+        activeBackgroundColor = Gray100,
+        inactiveBackgroundColor = Gray50,
+        unFocusedBackgroundColor = Gray50,
+        activeClearIconColor = Gray30,
+        inactiveClearIconColor = Gray40,
         rippleColor = Gray10,
     ),
 }
diff --git a/core/designsystem/src/main/res/drawable/ic_clear.xml b/core/designsystem/src/main/res/drawable/ic_clear.xml
@@ -3,10 +3,11 @@
     android:height="24dp"
     android:viewportWidth="24"
     android:viewportHeight="24">
+
   <path
       android:pathData="M12,0L12,0A12,12 0,0 1,24 12L24,12A12,12 0,0 1,12 24L12,24A12,12 0,0 1,0 12L0,12A12,12 0,0 1,12 0z"
       android:fillColor="#E7E7E7"/>
-  <path
-      android:pathData="M12,13.4L9.083,16.325C8.899,16.508 8.664,16.6 8.379,16.6C8.094,16.6 7.859,16.508 7.675,16.325C7.492,16.142 7.4,15.908 7.4,15.625C7.4,15.342 7.492,15.108 7.675,14.925L10.6,12L7.675,9.108C7.492,8.924 7.4,8.689 7.4,8.404C7.4,8.119 7.492,7.885 7.675,7.7C7.858,7.517 8.092,7.425 8.375,7.425C8.658,7.425 8.892,7.517 9.075,7.7L12,10.625L14.892,7.7C15.076,7.517 15.311,7.425 15.596,7.425C15.881,7.425 16.115,7.517 16.3,7.7C16.5,7.9 16.6,8.137 16.6,8.412C16.6,8.687 16.5,8.916 16.3,9.1L13.375,12L16.3,14.917C16.483,15.101 16.575,15.336 16.575,15.621C16.575,15.906 16.483,16.141 16.3,16.325C16.1,16.525 15.863,16.625 15.588,16.625C15.313,16.625 15.084,16.525 14.9,16.325L12,13.4Z"
-      android:fillColor="#ffffff"/>
+    <path
+        android:pathData="M12,13.4L9.083,16.325C8.899,16.508 8.664,16.6 8.379,16.6C8.094,16.6 7.859,16.508 7.675,16.325C7.492,16.142 7.4,15.908 7.4,15.625C7.4,15.342 7.492,15.108 7.675,14.925L10.6,12L7.675,9.108C7.492,8.924 7.4,8.689 7.4,8.404C7.4,8.119 7.492,7.885 7.675,7.7C7.858,7.517 8.092,7.425 8.375,7.425C8.658,7.425 8.892,7.517 9.075,7.7L12,10.625L14.892,7.7C15.076,7.517 15.311,7.425 15.596,7.425C15.881,7.425 16.115,7.517 16.3,7.7C16.5,7.9 16.6,8.137 16.6,8.412C16.6,8.687 16.5,8.916 16.3,9.1L13.375,12L16.3,14.917C16.483,15.101 16.575,15.336 16.575,15.621C16.575,15.906 16.483,16.141 16.3,16.325C16.1,16.525 15.863,16.625 15.588,16.625C15.313,16.625 15.084,16.525 14.9,16.325L12,13.4Z"
+        android:fillColor="#ffffff"/>
 </vector>