[FEAT/#64] 공고 상세 페이지 말 줄임표 추가

teamterning · Jul 13, 2024 · 2dfb2cb · 2dfb2cb
1 parent 4e17704
commit 2dfb2cb
Show file tree

Hide file tree

Showing 5 changed files with 60 additions and 22 deletions.
diff --git a/feature/src/main/java/com/terning/feature/intern/component/InternCompanyInfo.kt b/feature/src/main/java/com/terning/feature/intern/component/InternCompanyInfo.kt
@@ -5,26 +5,26 @@ import androidx.compose.foundation.border
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
-import androidx.compose.foundation.layout.aspectRatio
 import androidx.compose.foundation.layout.fillMaxWidth
-import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
-import androidx.compose.foundation.layout.width
 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.layout.ContentScale
 import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.text.style.TextOverflow
 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.feature.R
 
+private const val MAX_LINES = 2
+
 @Composable
 fun InternCompanyInfo(modifier: Modifier) {
     Row(
@@ -78,7 +78,9 @@ fun InternCompanyInfo(modifier: Modifier) {
                     text = "모니모니",
                     style = TerningTheme.typography.title4,
                     color = Black,
-                    modifier = modifier.padding(top = 11.dp)
+                    modifier = modifier.padding(top = 11.dp),
+                    maxLines = MAX_LINES,
+                    overflow = TextOverflow.Ellipsis
                 )
                 Text(
                     text = "스타트업",

diff --git a/feature/src/main/java/com/terning/feature/main/MainNavigator.kt b/feature/src/main/java/com/terning/feature/main/MainNavigator.kt
@@ -14,6 +14,7 @@ import com.terning.feature.home.home.navigation.navigateHome
 import com.terning.feature.intern.navigation.Intern
 import com.terning.feature.mypage.navigation.navigateMyPage
 import com.terning.feature.onboarding.signin.navigation.SignIn
+import com.terning.feature.search.search.navigation.Search
 import com.terning.feature.search.search.navigation.navigateSearch
 
 class MainNavigator(
@@ -23,7 +24,7 @@ class MainNavigator(
         @Composable get() = navController
             .currentBackStackEntryAsState().value?.destination
 
-    val startDestination = Intern
+    val startDestination = Search
 
     val currentTab: MainTab?
         @Composable get() = MainTab.find { tab ->

diff --git a/feature/src/main/java/com/terning/feature/search/search/SearchRoute.kt b/feature/src/main/java/com/terning/feature/search/search/SearchRoute.kt
@@ -1,6 +1,5 @@
 package com.terning.feature.search.search
 
-import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Spacer
@@ -20,6 +19,7 @@ import com.terning.core.designsystem.component.topappbar.LogoTopAppBar
 import com.terning.core.designsystem.theme.Black
 import com.terning.core.designsystem.theme.Grey100
 import com.terning.core.designsystem.theme.TerningTheme
+import com.terning.core.extension.noRippleClickable
 import com.terning.feature.R
 import com.terning.feature.search.search.component.ImageSlider
 import com.terning.feature.search.search.component.InternListType
@@ -63,7 +63,7 @@ fun SearchScreen(
                         horizontal = 24.dp,
                         vertical = 16.dp
                     )
-                    .clickable {
+                    .noRippleClickable {
                         navController.navigateSearchProcess()
                     }
             ) {
@@ -80,7 +80,9 @@ fun SearchScreen(
                 images = images
             )
 
-            Spacer(modifier = Modifier.padding(8.dp))
+            Spacer(
+                modifier = Modifier.padding(8.dp)
+            )
 
             Text(
                 text = stringResource(id = R.string.search_today_popular),

diff --git a/feature/src/main/java/com/terning/feature/search/searchprocess/SearchProcessRoute.kt b/feature/src/main/java/com/terning/feature/search/searchprocess/SearchProcessRoute.kt
@@ -1,10 +1,13 @@
 package com.terning.feature.search.searchprocess
 
 import androidx.compose.foundation.Image
+import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.wrapContentWidth
 import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
@@ -18,6 +21,7 @@ import androidx.compose.ui.focus.focusRequester
 import androidx.compose.ui.platform.LocalFocusManager
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import androidx.hilt.navigation.compose.hiltViewModel
@@ -33,6 +37,8 @@ import com.terning.core.designsystem.theme.TerningTheme
 import com.terning.core.extension.addFocusCleaner
 import com.terning.feature.R
 
+private const val MAX_LINES = 1
+
 @Composable
 fun SearchProcessRoute(
     navController: NavHostController,
@@ -76,7 +82,7 @@ fun SearchProcessScreen(
                 .fillMaxSize()
                 .padding(paddingValues)
                 .padding(horizontal = 24.dp)
-                .addFocusCleaner(focusManager)
+                .addFocusCleaner(focusManager),
         ) {
             if (!state.showSearchResults) {
                 Text(
@@ -109,31 +115,57 @@ fun SearchProcessScreen(
             if (state.showSearchResults) {
                 Column(
                     modifier = Modifier
-                        .fillMaxSize()
+                        .fillMaxWidth()
                         .padding(top = 87.dp),
-                    horizontalAlignment = Alignment.CenterHorizontally
+                    horizontalAlignment = Alignment.CenterHorizontally,
+                    verticalArrangement = Arrangement.Center
                 ) {
                     Image(
-                        painter = painterResource(id = R.drawable.ic_nosearch),
+                        painter = painterResource(
+                            id = R.drawable.ic_nosearch
+                        ),
                         contentDescription = stringResource(
                             id = R.string.search_process_no_result_icon
                         )
                     )
                     Row(
-                        modifier = Modifier.padding(vertical = 16.dp),
-                        verticalAlignment = Alignment.CenterVertically
+                        modifier = Modifier
+                            .fillMaxWidth()
+                            .padding(
+                                top = 16.dp,
+                                bottom = 6.dp
+                            ),
+                        verticalAlignment = Alignment.CenterVertically,
+                        horizontalArrangement = Arrangement.Center
                     ) {
+                        Row(
+                            modifier = modifier.wrapContentWidth(),
+                            verticalAlignment = Alignment.CenterVertically,
+                            horizontalArrangement = Arrangement.Center
+                        ) {
+                            Text(
+                                text = state.query,
+                                style = TerningTheme.typography.body1,
+                                color = TerningMain,
+                                maxLines = MAX_LINES,
+                                overflow = TextOverflow.Ellipsis,
+                            )
+                        }
                         Text(
-                            text = state.query,
-                            style = TerningTheme.typography.body1,
-                            color = TerningMain,
-                        )
-                        Text(
-                            text = stringResource(id = R.string.search_process_no_result_text),
+                            text = stringResource(id = R.string.search_process_no_result_text_sub),
                             style = TerningTheme.typography.body1,
                             color = Grey400,
+                            modifier = modifier.weight(1f)
                         )
                     }
+
+                    Text(
+                        text = stringResource(
+                            id = R.string.search_process_no_result_text_main
+                        ),
+                        style = TerningTheme.typography.body1,
+                        color = Grey400,
+                    )
                 }
             }
         }

diff --git a/feature/src/main/res/values/strings.xml b/feature/src/main/res/values/strings.xml
@@ -30,14 +30,15 @@
 
     <string name="search_today_popular">요즘 대학생들에게 인기 있는 공고</string>
     <string name="search_most_view_intern">지금 조회수가 많은 공고들이에요</string>
-    <string name="search_most_scrap_intern">지금 스크랩 수가 많은 공고들이에요</string>
+    <string name="search_most_scrap_intern">지금 스크랩수가 많은 공고들이에요</string>
 
     <!--SearchProcess-->
     <string name="search_process_top_bar_title">검색</string>
     <string name="search_process_question_text">어떤 공고를\n찾고 계시나요?</string>
     <string name="search_process_result_top_bar_title">검색 결과</string>
     <string name="search_process_no_result_icon">검색 결과 없을 때 아이콘</string>
-    <string name="search_process_no_result_text">와 일치하는 검색 결과가 없어요</string>
+    <string name="search_process_no_result_text_sub">에</string>
+    <string name="search_process_no_result_text_main">해당하는 검색 결과가 없어요</string>
 
 
     <!--calendar-->