[PR] UI Improvement (1.4.2)

common/src/main/java/com/doyoonkim/common/theme/Color.kt

@@ -32,10 +32,10 @@ val TitleWhite = Color(0xFFFFFFFF)
 
 val SubtitleAny = Color(0xFF787879)
 
-val ButtonLight = Color(0xFF3C3C3C)
-val ButtonDark = Color(0xFF888888)
+val ButtonDark = Color(0xFF3C3C3C)
+val ButtonLight = Color(0xFFF3F3F3)
 
-val GradientStartDark = Color(0xFF444444)
+val GradientStartDark = Color(0xFF4F4F4F)
 val GradientStartLight = Color(0xFFA1A1A1)
 
 val GradientIntermediateDark = Color(0xFF5C5C5C)

common/src/main/java/com/doyoonkim/common/ui/CircleGoButton.kt

@@ -0,0 +1,37 @@
+package com.doyoonkim.common.ui
+
+import androidx.compose.foundation.layout.wrapContentSize
+import androidx.compose.foundation.shape.CircleShape
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.automirrored.filled.KeyboardArrowRight
+import androidx.compose.material3.Icon
+import androidx.compose.material3.IconButton
+import androidx.compose.material3.IconButtonDefaults
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
+import androidx.compose.ui.graphics.Color
+
+@Composable
+fun CircleGoButton(
+    modifier: Modifier = Modifier,
+    onClick: () -> Unit,
+    containerColor: Color = Color.Gray,
+    contentColor: Color = Color.LightGray
+) {
+    IconButton(
+        onClick = onClick,
+        modifier = modifier
+            .wrapContentSize()
+            .clip(CircleShape),
+        colors = IconButtonDefaults.iconButtonColors().copy(
+            containerColor = containerColor,
+            contentColor = contentColor
+        )
+    ) {
+        Icon(
+            imageVector = Icons.AutoMirrored.Default.KeyboardArrowRight,
+            contentDescription = "Go"
+        )
+    }
+}

common/src/main/java/com/doyoonkim/common/ui/RoundedCornerColumn.kt

@@ -0,0 +1,54 @@
+package com.doyoonkim.common.ui
+
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.ColumnScope
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.wrapContentSize
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material3.Surface
+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
+import androidx.compose.ui.unit.dp
+
+@Composable
+fun RoundedCornerColumn(
+    modifier: Modifier = Modifier,
+    verticalArrangement: Arrangement.Vertical = Arrangement.Top,
+    horizontalAlignment: Alignment.Horizontal = Alignment.Start,
+    cornerRadius: Dp = 15.dp,
+    backgroundColor: Color,
+    content: @Composable (ColumnScope.() -> Unit)
+) {
+
+    Surface(
+        modifier = modifier
+            .wrapContentSize()
+            .background(Color.Transparent)
+            .clip(RoundedCornerShape(cornerRadius)),
+        color = backgroundColor
+    ) {
+        Column(
+            modifier = Modifier
+                .fillMaxWidth()
+                .padding(horizontal = 10.dp),
+            verticalArrangement = verticalArrangement,
+            horizontalAlignment = horizontalAlignment,
+            content = content
+        )
+    }
+
+}
+
+@Preview(showBackground = true)
+@Composable
+fun RoundedCornerColumn_Preview() {
+
+}

common/src/main/java/com/doyoonkim/common/ui/RoundedCornerColumnItem.kt

@@ -0,0 +1,135 @@
+package com.doyoonkim.common.ui
+
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.ColumnScope
+import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.wrapContentHeight
+import androidx.compose.material3.HorizontalDivider
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.text.style.TextAlign
+import androidx.compose.ui.unit.Dp
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+
+enum class TextSize { Large, Medium, Small }
+
+@Composable
+fun RoundedCornerColumnTextItemWithExtraOnRight(
+    modifier: Modifier = Modifier,
+    verticalPadding: Dp = 0.dp,
+    titleText: String,
+    subTitleText: String? = "Subtitle",
+    fontSize: TextSize = TextSize.Medium,
+    primaryColor: Color = Color.Black,
+    secondaryColor: Color = Color.Gray,
+    hasBottomDivider: Boolean = true,
+    extraOnRight: @Composable () -> Unit
+) {
+    Row(
+        modifier = Modifier.fillMaxWidth().wrapContentHeight(),
+        verticalAlignment = Alignment.CenterVertically,
+        horizontalArrangement = Arrangement.SpaceEvenly
+    ) {
+        RoundedCornerColumnTextItem(
+            modifier = modifier.weight(4f),
+            verticalPadding = verticalPadding,
+            titleText = titleText,
+            subTitleText = subTitleText,
+            textSize = fontSize,
+            primaryColor = primaryColor,
+            secondaryColor = secondaryColor,
+            hasBottomDivider = hasBottomDivider
+        )
+        extraOnRight()
+    }
+}
+
+@Composable
+fun RoundedCornerColumnTextItem(
+    modifier: Modifier = Modifier,
+    verticalPadding: Dp = 0.dp,
+    titleText: String,
+    subTitleText: String? = "Subtitle",
+    textSize: TextSize = TextSize.Medium,
+    primaryColor: Color = Color.Black,
+    secondaryColor: Color = Color.Gray,
+    hasBottomDivider: Boolean = true
+) {
+    val extra = if (subTitleText == null) 10.dp else 0.dp
+    val fontSize = when (textSize) {
+        TextSize.Large -> Pair(24, 20)
+        TextSize.Medium -> Pair(18, 14)
+        TextSize.Small -> Pair(14, 10)
+    }
+
+    RoundedCornerColumnItem(
+        modifier = modifier,
+        verticalPadding = verticalPadding,
+        extra = extra,
+        hasBottomDivider = hasBottomDivider,
+        dividerColor = secondaryColor
+    ) {
+        Text(
+            text = titleText,
+            color = primaryColor,
+            fontWeight = FontWeight.SemiBold,
+            fontSize = fontSize.first.sp,
+            textAlign = TextAlign.Start,
+            modifier = Modifier.fillMaxWidth().padding(start = 10.dp)
+        )
+
+        subTitleText?.let {
+            Text(
+                text = it,
+                color = secondaryColor,
+                fontWeight = FontWeight.Normal,
+                fontSize = fontSize.second.sp,
+                textAlign = TextAlign.Start,
+                modifier = Modifier.fillMaxWidth().padding(start = 10.dp)
+            )
+        }
+    }
+}
+
+@Composable
+fun RoundedCornerColumnItem(
+    modifier: Modifier = Modifier,
+    verticalPadding: Dp = 0.dp,
+    extra: Dp = 0.dp,
+    hasBottomDivider: Boolean = true,
+    dividerColor: Color = Color.Gray,
+    content: @Composable (ColumnScope.() -> Unit)
+) {
+
+    val columnPadding = if (hasBottomDivider) {
+        PaddingValues(top = verticalPadding + extra)
+    } else {
+        PaddingValues(vertical = verticalPadding + extra)
+    }
+
+    Column(
+        modifier = modifier
+            .padding(columnPadding),
+        verticalArrangement = Arrangement.SpaceEvenly,
+        horizontalAlignment = Alignment.CenterHorizontally
+    ) {
+
+        content()
+
+        if (hasBottomDivider) {
+            HorizontalDivider(
+                Modifier.padding(top = verticalPadding + extra),
+                color = dividerColor
+            )
+        }
+    }
+}

common/src/main/res/values-ko-rKR/strings.xml

@@ -8,7 +8,7 @@
     <string name="btn_more">더보기</string>
     <string name="btn_more_on_browser">브라우저에서 더보기</string>
     <string name="enable_notification_title">서비스 알림</string>
-    <string name="enable_service_notification_sub">새로운 공지사항이 등록되면 푸시 알림으로 알려드려요.</string>
+    <string name="enable_service_notification_sub">새로운 공지사항이 등록되면 푸시 알림을 받을래요.</string>
     <string name="about_title">더보기</string>
     <string name="about_version">버전정보</string>
     <string name="about_oss">오픈소스 라이센스</string>