From e454ea63aa8f59cdd05f85afdbb085e54ecdb141 Mon Sep 17 00:00:00 2001 From: Dongmin Date: Sat, 21 Sep 2024 18:15:41 +0900 Subject: [PATCH] feature #866: feat homeScreen --- .../fortune/feature/home/HomeScreen.kt | 143 ++++++++++++++++++ 1 file changed, 143 insertions(+) create mode 100644 feature/fortune/src/main/java/org/sopt/official/feature/fortune/feature/home/HomeScreen.kt diff --git a/feature/fortune/src/main/java/org/sopt/official/feature/fortune/feature/home/HomeScreen.kt b/feature/fortune/src/main/java/org/sopt/official/feature/fortune/feature/home/HomeScreen.kt new file mode 100644 index 000000000..e21677b61 --- /dev/null +++ b/feature/fortune/src/main/java/org/sopt/official/feature/fortune/feature/home/HomeScreen.kt @@ -0,0 +1,143 @@ +package org.sopt.official.feature.fortune.feature.home + +import androidx.compose.foundation.Image +import androidx.compose.foundation.background +import androidx.compose.foundation.clickable +import androidx.compose.foundation.layout.Box +import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.PaddingValues +import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.fillMaxSize +import androidx.compose.foundation.layout.fillMaxWidth +import androidx.compose.foundation.layout.height +import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.shape.RoundedCornerShape +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.runtime.remember +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.draw.clip +import androidx.compose.ui.graphics.vector.ImageVector +import androidx.compose.ui.res.vectorResource +import androidx.compose.ui.tooling.preview.Preview +import androidx.compose.ui.unit.dp +import kotlinx.serialization.Serializable +import org.sopt.official.designsystem.SoptTheme +import org.sopt.official.feature.fortune.R +import java.time.LocalDate +import java.time.format.DateTimeFormatter +import java.time.format.TextStyle +import java.util.Locale + +@Serializable +data object Home + +@Composable +internal fun HomeRoute( + paddingValue: PaddingValues, + navigateToFortuneDetail: (String) -> Unit, +) { + val date = remember { getTodayInfo() } + + HomeScreen( + paddingValue = paddingValue, + date = date, + navigateToFortuneDetail = { + navigateToFortuneDetail(date) + } + ) +} + +@Composable +private fun HomeScreen( + paddingValue: PaddingValues, + date: String, + navigateToFortuneDetail: () -> Unit = {}, +) { + Column( + modifier = Modifier + .padding(paddingValue) + .fillMaxSize() + .background(SoptTheme.colors.background), + horizontalAlignment = Alignment.CenterHorizontally + ) { + Spacer(modifier = Modifier.height(12.dp)) + + Text( + text = date, + style = SoptTheme.typography.body16M, + color = SoptTheme.colors.onBackground, + ) + + Spacer(modifier = Modifier.height(2.dp)) + + Text( + text = "오늘의 운세가 도착했어요!", + style = SoptTheme.typography.heading18B, + color = SoptTheme.colors.onBackground, + ) + + Spacer(modifier = Modifier.height(8.dp)) + + Image( + imageVector = ImageVector.vectorResource(id = R.drawable.img_fortune_title), + contentDescription = null, + modifier = Modifier + .padding(horizontal = 45.dp) + ) + + Spacer(modifier = Modifier.height(10.dp)) + + Image( + imageVector = ImageVector.vectorResource(id = R.drawable.img_fortune_three_cards), + contentDescription = null, + modifier = Modifier + .padding(horizontal = 26.dp) + ) + + Spacer(modifier = Modifier.weight(1f)) + + Box( + modifier = Modifier + .padding(horizontal = 20.dp) + .fillMaxWidth() + .clip(RoundedCornerShape(12.dp)) + .background(SoptTheme.colors.primary) + .clickable(onClick = navigateToFortuneDetail), + contentAlignment = Alignment.Center + ) { + Text( + text = "오늘의 운세 보러가기", + style = SoptTheme.typography.label18SB, + color = SoptTheme.colors.onPrimary, + modifier = Modifier.padding(horizontal = 26.dp, vertical = 16.dp) + ) + } + + Spacer(modifier = Modifier.height(36.dp)) + } +} + +fun getTodayInfo(): String { + val today = LocalDate.now() + + val monthDay = today.format(DateTimeFormatter.ofPattern("M월 d일")) + val dayOfWeek = today.dayOfWeek.getDisplayName( + TextStyle.FULL, + Locale.KOREAN + ) + + return "$monthDay $dayOfWeek" +} + +@Preview +@Composable +fun HomeScreenPreview() { + SoptTheme { + HomeScreen( + paddingValue = PaddingValues(0.dp), + date = getTodayInfo() + ) + } +}