[UI/#12] 홈뷰 / 홈 기본 화면 구현

feature/src/main/java/com/terning/feature/home/home/HomeRoute.kt

@@ -0,0 +1,118 @@
+package com.terning.feature.home.home
+
+import androidx.compose.foundation.ExperimentalFoundationApi
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.material3.HorizontalDivider
+import androidx.compose.material3.Scaffold
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.unit.dp
+import com.terning.core.designsystem.component.topappbar.LogoTopAppBar
+import com.terning.core.designsystem.theme.Black
+import com.terning.core.designsystem.theme.Grey150
+import com.terning.core.designsystem.theme.TerningTheme
+import com.terning.core.designsystem.theme.White
+import com.terning.feature.R
+import com.terning.feature.home.home.component.HomeFilteringScreen
+import com.terning.feature.home.home.component.HomeTodayIntern
+
+@Composable
+fun HomeRoute() {
+    HomeScreen()
+}
+
+@OptIn(ExperimentalFoundationApi::class)
+@Composable
+fun HomeScreen() {
+    Scaffold(
+        modifier = Modifier,
+        topBar = {
+            LogoTopAppBar()
+        }
+    ) { paddingValues ->
+        LazyColumn(
+            modifier = Modifier
+                .fillMaxSize()
+                .padding(top = paddingValues.calculateTopPadding())
+        ) {
+            item {
+                Column(
+                    modifier = Modifier
+                        .padding(bottom = 16.dp)
+                ) {
+                    Text(
+                        text = stringResource(
+                            id = R.string.home_today_title_start
+                        )
+                                + "남지우"
+                                + stringResource(
+                            id = R.string.home_today_title_end
+                        ),
+                        modifier = Modifier
+                            .padding(top = 11.dp)
+                            .padding(horizontal = 24.dp),
+                        style = TerningTheme.typography.title1,
+                        color = Black,
+                    )
+                    HomeTodayIntern()
+                }
+            }
+            stickyHeader {
+                Column(
+                    modifier = Modifier
+                        .background(White)
+                ) {
+                    Text(
+                        text = stringResource(id = R.string.home_recommend_sub_title),
+                        style = TerningTheme.typography.detail2,
+                        color = Black,
+                        modifier = Modifier
+                            .padding(top = 25.dp)
+                            .padding(horizontal = 24.dp),
+                    )
+
+                    Text(
+                        text = stringResource(id = R.string.home_recommend_main_title),
+                        style = TerningTheme.typography.title1,
+                        color = Black,
+                        modifier = Modifier
+                            .padding(top = 5.dp)
+                            .padding(horizontal = 24.dp),
+                    )
+
+                    HomeFilteringScreen(
+                        grade = 3,
+                        period = 1,
+                        startYear = 2024,
+                        startMonth = 7,
+                    )
+
+                    HorizontalDivider(
+                        thickness = 4.dp,
+                        color = Grey150,
+                        modifier = Modifier
+                            .fillMaxWidth(),
+                    )
+                }
+            }
+
+            items(10) {
+                TerningPostItem(
+                    imageUrl = "https://reqres.in/img/faces/7-image.jpg",
+                    title = "[Someone] 콘텐츠 마케터 대학생 인턴 채용",
+                    dateDeadline = "2",
+                    workingPeriod = "2개월",
+                    isScraped = false,
+                )
+            }
+        }
+
+    }
+}

feature/src/main/java/com/terning/feature/home/home/TerningPostItem.kt

@@ -0,0 +1,111 @@
+package com.terning.feature.home.home
+
+import androidx.compose.foundation.Image
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.aspectRatio
+import androidx.compose.foundation.layout.fillMaxHeight
+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.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
+import androidx.compose.ui.draw.shadow
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.unit.dp
+import coil.compose.rememberImagePainter
+import com.terning.core.designsystem.theme.Black
+import com.terning.core.designsystem.theme.Grey400
+import com.terning.core.designsystem.theme.TerningMain
+import com.terning.core.designsystem.theme.TerningTheme
+import com.terning.core.designsystem.theme.White
+import com.terning.feature.R
+
+@Composable
+fun TerningPostItem(
+    imageUrl: String,
+    title: String,
+    dateDeadline: String,
+    workingPeriod: String,
+    isScraped: Boolean,
+    modifier: Modifier = Modifier,
+) {
+    Row(
+        modifier
+            .fillMaxWidth()
+            .height(92.dp)
+            .shadow(1.dp)
+            .background(
+                color = White,
+                shape = RoundedCornerShape(10.dp)
+            )
+            .padding(start = 10.dp, end = 8.dp),
+        verticalAlignment = Alignment.CenterVertically,
+    ) {
+        Image(
+            painter = rememberImagePainter(imageUrl),
+            contentDescription = title,
+            modifier
+                .fillMaxHeight()
+                .aspectRatio(1f)
+                .padding(vertical = 10.dp)
+                .clip(
+                    RoundedCornerShape(5.dp),
+                )
+        )
+        Column(
+            modifier
+                .padding(
+                    top = 10.dp,
+                    bottom = 9.dp,
+                    start = 8.dp
+                )
+                .weight(1f),
+        ) {
+            Text(
+                text = stringResource(id = R.string.terning_post_d_day) + dateDeadline,
+                style = TerningTheme.typography.detail0,
+                color = TerningMain,
+            )
+
+            Text(
+                text = title,
+                style = TerningTheme.typography.title5,
+                color = Black,
+                softWrap = true,
+                modifier = modifier.padding(top = 3.dp),
+            )
+
+            Row(
+                modifier = modifier
+                    .padding(top = 10.dp)
+            ) {
+                Text(
+                    text = stringResource(R.string.terning_post_working_period),
+                    style = TerningTheme.typography.detail3,
+                    color = Grey400
+                )
+
+                Text(
+                    text = workingPeriod,
+                    style = TerningTheme.typography.detail3,
+                    color = TerningMain,
+                    modifier = modifier.padding(start = 4.dp)
+                )
+            }
+        }
+        Image(
+            painter = painterResource(id = R.drawable.ic_home_bookmark_28),
+            contentDescription = "scrap",
+            modifier = modifier
+                .padding(end = 2.dp, bottom = 8.dp)
+                .align(Alignment.Bottom),
+        )
+    }
+}

feature/src/main/java/com/terning/feature/home/home/component/HomeFilteringScreen.kt

@@ -0,0 +1,120 @@
+package com.terning.feature.home.home.component
+
+import androidx.compose.foundation.Image
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.IntrinsicSize
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.fillMaxHeight
+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.material3.VerticalDivider
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.text.style.TextAlign
+import androidx.compose.ui.unit.dp
+import com.terning.core.designsystem.theme.Black
+import com.terning.core.designsystem.theme.Grey300
+import com.terning.core.designsystem.theme.TerningMain
+import com.terning.core.designsystem.theme.TerningTheme
+import com.terning.core.designsystem.theme.White
+import com.terning.feature.R
+
+@Composable
+fun HomeFilteringScreen(
+    grade: Int,
+    period: Int,
+    startYear: Int,
+    startMonth: Int,
+    modifier: Modifier = Modifier,
+) {
+    Row(
+        modifier = modifier
+            .padding(top = 10.dp, bottom = 11.dp)
+            .padding(horizontal = 24.dp)
+            .height(IntrinsicSize.Min)
+            .fillMaxWidth(),
+        horizontalArrangement = Arrangement.SpaceBetween
+    ) {
+        Row(
+            modifier = modifier
+                .background(
+                    color = TerningMain,
+                    shape = RoundedCornerShape(5.dp),
+                )
+                .align(Alignment.CenterVertically),
+        ) {
+            Image(
+                painter = painterResource(id = R.drawable.ic_home_filtering_28),
+                contentDescription = stringResource(id = R.string.home_recommend_filtering),
+                modifier = modifier
+                    .padding(horizontal = 2.dp),
+            )
+            Text(
+                text = stringResource(id = R.string.home_recommend_filtering),
+                style = TerningTheme.typography.button4,
+                color = White,
+                textAlign = TextAlign.Center,
+                modifier = modifier
+                    .padding(end = 6.dp)
+                    .align(Alignment.CenterVertically)
+            )
+        }
+
+        HomeFilteringText(
+            text = grade.toString() + stringResource(id = R.string.home_recommend_filtering_grade),
+            modifier = Modifier
+                .padding(vertical = 7.dp)
+        )
+        HomeFilteringDivider()
+        HomeFilteringText(
+            text = stringResource(
+                id = when (period) {
+                    1 -> R.string.home_recommend_filtering_working_period_1
+                    2 -> R.string.home_recommend_filtering_working_period_2
+                    3 -> R.string.home_recommend_filtering_working_period_3
+                    else -> R.string.server_failure
+                }
+            ),
+            modifier = Modifier
+                .padding(vertical = 7.dp)
+        )
+        HomeFilteringDivider()
+        HomeFilteringText(
+            text = startYear.toString() + stringResource(id = R.string.home_recommend_filtering_startYear)
+                    + "  " + startMonth.toString() + stringResource(id = R.string.home_recommend_filtering_startMonth),
+            modifier = Modifier
+                .padding(vertical = 7.dp)
+        )
+    }
+}
+
+@Composable
+private fun HomeFilteringText(
+    text: String,
+    modifier: Modifier = Modifier
+) {
+    Text(
+        text = text,
+        style = TerningTheme.typography.detail2,
+        color = Black,
+        modifier = modifier,
+    )
+}
+
+@Composable
+private fun HomeFilteringDivider() {
+    VerticalDivider(
+        color = Grey300,
+        thickness = 2.dp,
+        modifier = Modifier
+            .fillMaxHeight()
+            .padding(vertical = 4.dp),
+    )
+}