From 63e2097bae9cb2cbb2ff40f662dda8d5dc50e3d3 Mon Sep 17 00:00:00 2001 From: arinming Date: Sun, 7 Jul 2024 23:35:47 +0900 Subject: [PATCH] [ADD/#19] TextField DecorationBox Add --- .../textfield/TerningTextField.kt | 68 +++++++++++++++++++ .../com/terning/feature/main/MainNavigator.kt | 4 +- .../com/terning/feature/main/MainScreen.kt | 21 ++++-- .../com/terning/feature/search/SearchRoute.kt | 18 ++++- 4 files changed, 101 insertions(+), 10 deletions(-) create mode 100644 core/src/main/java/com/terning/core/designsystem/textfield/TerningTextField.kt diff --git a/core/src/main/java/com/terning/core/designsystem/textfield/TerningTextField.kt b/core/src/main/java/com/terning/core/designsystem/textfield/TerningTextField.kt new file mode 100644 index 000000000..1ff804ffc --- /dev/null +++ b/core/src/main/java/com/terning/core/designsystem/textfield/TerningTextField.kt @@ -0,0 +1,68 @@ +package com.terning.core.designsystem.textfield + +import androidx.compose.foundation.background +import androidx.compose.foundation.layout.Arrangement +import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.fillMaxWidth +import androidx.compose.foundation.layout.height +import androidx.compose.foundation.text.BasicTextField +import androidx.compose.material3.Icon +import androidx.compose.runtime.Composable +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.draw.drawWithContent +import androidx.compose.ui.geometry.Offset +import androidx.compose.ui.res.painterResource +import androidx.compose.ui.unit.dp +import com.terning.core.R +import com.terning.core.designsystem.theme.TerningMain +import com.terning.core.designsystem.theme.TerningTypography +import com.terning.core.designsystem.theme.White + +@Composable +fun TerningTextField( + value: String, + onValueChange: (String) -> Unit, + modifier: Modifier = Modifier, +) { + BasicTextField( + value = value, + onValueChange = onValueChange, + modifier = Modifier + .fillMaxWidth() + .background(White), + textStyle = TerningTypography().button3, + decorationBox = { innerTextField -> + Column(modifier = Modifier.drawWithContent { + drawContent() + drawLine( + color = TerningMain, + start = Offset( + x = 0f, + y = size.height - 1.dp.toPx(), + ), + end = Offset( + x = size.width, + y = size.height - 1.dp.toPx(), + ), + strokeWidth = 2.dp.toPx(), + ) + }) { + Row( + verticalAlignment = Alignment.CenterVertically, + horizontalArrangement = Arrangement.spacedBy(12.dp), + ) { + Icon( + painter = painterResource(id = R.drawable.ic_back), + contentDescription = null, + tint = TerningMain, + ) + innerTextField() + } + Spacer(modifier = Modifier.height(8.dp)) + } + } + ) +} \ No newline at end of file diff --git a/feature/src/main/java/com/terning/feature/main/MainNavigator.kt b/feature/src/main/java/com/terning/feature/main/MainNavigator.kt index beb7b7920..e67b04927 100644 --- a/feature/src/main/java/com/terning/feature/main/MainNavigator.kt +++ b/feature/src/main/java/com/terning/feature/main/MainNavigator.kt @@ -12,7 +12,7 @@ import androidx.navigation.navOptions import com.terning.feature.calendar.navigation.navigateCalendar import com.terning.feature.home.navigation.navigateHome import com.terning.feature.mypage.navigation.navigateMyPage -import com.terning.feature.onboarding.signin.navigation.SignIn +import com.terning.feature.search.navigation.Search import com.terning.feature.search.navigation.navigateSearch class MainNavigator( @@ -22,7 +22,7 @@ class MainNavigator( @Composable get() = navController .currentBackStackEntryAsState().value?.destination - val startDestination = SignIn + val startDestination = Search val currentTab: MainTab? @Composable get() = MainTab.find { tab -> diff --git a/feature/src/main/java/com/terning/feature/main/MainScreen.kt b/feature/src/main/java/com/terning/feature/main/MainScreen.kt index 9d51ef625..150101db0 100644 --- a/feature/src/main/java/com/terning/feature/main/MainScreen.kt +++ b/feature/src/main/java/com/terning/feature/main/MainScreen.kt @@ -21,7 +21,6 @@ import androidx.navigation.compose.NavHost import com.terning.core.designsystem.theme.Grey300 import com.terning.core.designsystem.theme.TerningMain import com.terning.core.designsystem.theme.White -import com.terning.core.designsystem.topappbar.BackButtonTopAppBar import com.terning.core.designsystem.topappbar.LogoTopAppBar import com.terning.core.designsystem.topappbar.MyPageTopAppBar import com.terning.core.designsystem.topappbar.TerningTopAppBar @@ -42,10 +41,7 @@ fun MainScreen( topBar = { when (navigator.currentTab) { MainTab.HOME -> LogoTopAppBar() - MainTab.CALENDAR -> BackButtonTopAppBar( - title = "dkssud", - onBackButtonClick = { navigator.navigateUp() }) - + MainTab.CALENDAR -> TerningTopAppBar() MainTab.SEARCH -> LogoTopAppBar() MainTab.MY_PAGE -> MyPageTopAppBar() null -> TerningTopAppBar() @@ -80,6 +76,21 @@ fun MainScreen( } } + + +@Composable +private fun MainTopBar( + isVisible: Boolean, + tabs: List, + currentTab: MainTab?, + onTabSelected: (MainTab) -> Unit, +) { + AnimatedVisibility( + visible = isVisible, + ) { + } +} + @Composable private fun MainBottomBar( isVisible: Boolean, diff --git a/feature/src/main/java/com/terning/feature/search/SearchRoute.kt b/feature/src/main/java/com/terning/feature/search/SearchRoute.kt index 3ba7af3d4..85b150e6a 100644 --- a/feature/src/main/java/com/terning/feature/search/SearchRoute.kt +++ b/feature/src/main/java/com/terning/feature/search/SearchRoute.kt @@ -3,11 +3,15 @@ package com.terning.feature.search import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.padding -import androidx.compose.material3.Scaffold import androidx.compose.material3.Text import androidx.compose.runtime.Composable +import androidx.compose.runtime.getValue +import androidx.compose.runtime.mutableStateOf +import androidx.compose.runtime.remember +import androidx.compose.runtime.setValue import androidx.compose.ui.Modifier -import com.terning.core.designsystem.topappbar.LogoTopAppBar +import androidx.compose.ui.unit.dp +import com.terning.core.designsystem.textfield.TerningTextField @Composable fun SearchRoute() { @@ -16,10 +20,18 @@ fun SearchRoute() { @Composable fun SearchScreen(modifier: Modifier = Modifier) { + var text by remember { mutableStateOf("") } Column( modifier = Modifier .fillMaxWidth() + .padding(horizontal = 16.dp) ) { Text(text = "탐색 스크린") + TerningTextField( + value = text, + onValueChange = { newText -> + text = newText + } + ) } -} +} \ No newline at end of file