Skip to content

Commit 4e6fdc2

Browse files
casper-jrcasper-jr
committed
[ui]: AddMenu - Search화면 구현(#14)
1 parent 0613acb commit 4e6fdc2

File tree

4 files changed

+121
-35
lines changed

4 files changed

+121
-35
lines changed

‎app/src/main/java/com/kuit/ourmenu/ui/addmenu/component/RestaurantSearchItem.kt

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ fun RestaurantSearchItem(isLastItem: Boolean = false) {
2525
Row(
2626
modifier = Modifier
2727
.fillMaxWidth()
28-
.padding(vertical = 20.dp),
28+
.padding(vertical = 20.dp, horizontal = 20.dp),
2929
verticalAlignment = Alignment.CenterVertically
3030
) {
3131
Icon(
@@ -34,8 +34,8 @@ fun RestaurantSearchItem(isLastItem: Boolean = false) {
3434
tint = Color.Unspecified
3535
)
3636
Column(modifier = Modifier.padding(start = 20.dp)){
37-
Text(text = "메뉴 이름", fontSize = 16.sp, fontWeight = FontWeight.Bold)
38-
Text(text = "14,000원", fontSize = 14.sp, color = Color.Gray)
37+
Text(text = "아워떡볶이", fontSize = 16.sp, fontWeight = FontWeight.Bold)
38+
Text(text = "서울 광진구 능동로 112", fontSize = 14.sp, color = Color.Gray)
3939
}
4040
}
4141

‎app/src/main/java/com/kuit/ourmenu/ui/addmenu/screen/AddMenuSearchScreen.kt

Lines changed: 101 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -1,67 +1,82 @@
11
package com.kuit.ourmenu.ui.addmenu.screen
22

3+
import androidx.compose.foundation.layout.Arrangement
34
import androidx.compose.foundation.layout.Column
45
import androidx.compose.foundation.layout.fillMaxSize
56
import androidx.compose.foundation.layout.fillMaxWidth
67
import androidx.compose.foundation.layout.padding
8+
import androidx.compose.foundation.layout.size
9+
import androidx.compose.foundation.lazy.LazyColumn
10+
import androidx.compose.foundation.lazy.items
11+
import androidx.compose.foundation.shape.RoundedCornerShape
712
import androidx.compose.material3.Button
13+
import androidx.compose.material3.ButtonDefaults
814
import androidx.compose.material3.ExperimentalMaterial3Api
915
import androidx.compose.material3.Icon
10-
import androidx.compose.material3.IconButton
1116
import androidx.compose.material3.Scaffold
1217
import androidx.compose.material3.Text
13-
import androidx.compose.material3.TopAppBar
1418
import androidx.compose.runtime.Composable
19+
import androidx.compose.runtime.getValue
20+
import androidx.compose.runtime.mutableStateOf
21+
import androidx.compose.runtime.saveable.rememberSaveable
1522
import androidx.compose.ui.Alignment
1623
import androidx.compose.ui.Modifier
17-
import androidx.compose.ui.draw.drawBehind
1824
import androidx.compose.ui.draw.shadow
1925
import androidx.compose.ui.graphics.Color
2026
import androidx.compose.ui.res.painterResource
2127
import androidx.compose.ui.text.font.FontWeight
2228
import androidx.compose.ui.tooling.preview.Preview
2329
import androidx.compose.ui.unit.dp
30+
import androidx.compose.ui.unit.sp
2431
import com.kuit.ourmenu.R
32+
import com.kuit.ourmenu.ui.addmenu.component.AddMenuTopAppBar
33+
import com.kuit.ourmenu.ui.addmenu.component.RestaurantSearchItem
34+
import com.kuit.ourmenu.ui.common.SearchBar
2535

2636
@OptIn(ExperimentalMaterial3Api::class)
2737
@Composable
2838
fun AddMenuSearchScreen(modifier: Modifier = Modifier) {
39+
val searchActionDone by rememberSaveable { mutableStateOf(true) }
40+
val dummyRecentSearchList = mutableListOf(
41+
false,
42+
false,
43+
false,
44+
false,
45+
true,
46+
)
47+
val dummySearchResultList: MutableList<Boolean> = mutableListOf()
48+
2949
Scaffold(modifier = Modifier.fillMaxSize(),
3050
topBar = {
31-
TopAppBar(
32-
title = {
33-
Text(
34-
"OURMENU",
35-
color = Color(0xFFFF5420),
36-
fontWeight = FontWeight.Bold
37-
)
38-
},
39-
navigationIcon = {
40-
IconButton(onClick = { TODO("뒤로가기 구현") }) {
41-
Icon(
42-
painter = painterResource(R.drawable.ic_top_bar_back),
43-
contentDescription = "Back"
44-
)
45-
}
46-
},
47-
modifier = Modifier
48-
.drawBehind {
49-
drawRect(
50-
color = Color.Black
51-
)
52-
}
53-
.shadow(elevation = 4.dp)
54-
)
51+
AddMenuTopAppBar {
52+
Text(
53+
"OURMENU",
54+
color = Color(0xFFFF5420),
55+
fontWeight = FontWeight.Bold
56+
)
57+
}
5558
},
5659
bottomBar = {
5760
Column(
5861
modifier = Modifier
5962
.fillMaxWidth()
6063
.padding(start = 20.dp, end = 20.dp, bottom = 20.dp),
61-
horizontalAlignment = Alignment.CenterHorizontally
64+
horizontalAlignment = Alignment.CenterHorizontally,
65+
verticalArrangement = Arrangement.Center
6266
) {
63-
Button(onClick = { /*TODO*/ }) {
64-
Text("가게와 메뉴 직접 추가하기")
67+
Button(
68+
onClick = { /*TODO*/ },
69+
modifier = Modifier
70+
.fillMaxWidth()
71+
.size(320.dp, 52.dp)
72+
.shadow(elevation = 4.dp, shape = RoundedCornerShape(12.dp)),
73+
shape = RoundedCornerShape(12.dp),
74+
colors = ButtonDefaults.buttonColors(
75+
containerColor = Color(0xFFF7F7F9),
76+
contentColor = Color(0xFFA4A4A6)
77+
),
78+
) {
79+
Text(text = "가게와 메뉴 직접 추가하기")
6580
}
6681
}
6782
},
@@ -72,7 +87,62 @@ fun AddMenuSearchScreen(modifier: Modifier = Modifier) {
7287
.fillMaxWidth(),
7388
horizontalAlignment = Alignment.CenterHorizontally
7489
) {
75-
Text("content")
90+
Column(
91+
modifier = Modifier
92+
.fillMaxWidth()
93+
.padding(vertical = 12.dp, horizontal = 20.dp)
94+
) {
95+
SearchBar { TODO() }
96+
}
97+
Column(modifier = Modifier.fillMaxSize()) {
98+
if (searchActionDone) {
99+
//검색을 한 경우
100+
if (dummySearchResultList.isEmpty()) {
101+
Column(
102+
modifier = Modifier
103+
.fillMaxWidth()
104+
.padding(top = 64.dp),
105+
horizontalAlignment = Alignment.CenterHorizontally
106+
) {
107+
Icon(
108+
painter = painterResource(R.drawable.ic_addmenu_noresult),
109+
contentDescription = "no result",
110+
tint = Color.Unspecified
111+
)
112+
Text(
113+
text = "검색 결과가 없어요!",
114+
fontSize = 14.sp,
115+
color = Color(0xFF666668),
116+
modifier = Modifier.padding(top = 8.dp)
117+
)
118+
}
119+
} else {
120+
LazyColumn {
121+
items(dummySearchResultList) { item ->
122+
RestaurantSearchItem(item)
123+
}
124+
}
125+
}
126+
} else {
127+
//검색을 하지 않은 경우
128+
Text(
129+
text = "최근 검색",
130+
fontSize = 14.sp,
131+
color = Color(0xFF666668),
132+
modifier = Modifier.padding(start = 28.dp)
133+
)
134+
if (dummyRecentSearchList.isEmpty()) {
135+
Column(modifier = Modifier.fillMaxSize()) { /*empty view*/ }
136+
} else {
137+
LazyColumn {
138+
items(dummyRecentSearchList) { item ->
139+
RestaurantSearchItem(item)
140+
}
141+
}
142+
}
143+
}
144+
145+
}
76146
}
77147
}
78148
)

‎app/src/main/java/com/kuit/ourmenu/ui/common/SearchBar.kt

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@ fun SearchBar(
3030
) {
3131
Card(
3232
modifier = Modifier
33-
.shadow(elevation = 4.dp)
33+
.shadow(elevation = 4.dp, shape = RoundedCornerShape(8.dp))
3434
.fillMaxWidth(),
3535
shape = RoundedCornerShape(8.dp)
3636
) {

‎app/src/main/res/drawable/ic_addmenu_noresult.xml

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
<vector xmlns:android="http://schemas.android.com/apk/res/android"
2+
android:width="54dp"
3+
android:height="56dp"
4+
android:viewportWidth="54"
5+
android:viewportHeight="56">
6+
<path
7+
android:pathData="M19.57,34.969C27.385,34.969 33.72,28.399 33.72,20.295C33.72,12.19 27.385,5.62 19.57,5.62C11.755,5.62 5.419,12.19 5.419,20.295C5.419,28.399 11.755,34.969 19.57,34.969ZM19.57,40.589C30.378,40.589 39.139,31.503 39.139,20.295C39.139,9.086 30.378,0 19.57,0C8.762,0 0,9.086 0,20.295C0,31.503 8.762,40.589 19.57,40.589Z"
8+
android:fillColor="#A4A4A6"
9+
android:fillType="evenOdd"/>
10+
<path
11+
android:pathData="M33.374,38.584L33.282,36.502L35.198,34.515L37.206,34.61L54,52.026L50.168,56L33.374,38.584Z"
12+
android:fillColor="#A4A4A6"/>
13+
<path
14+
android:pathData="M35.198,34.515L34.148,33.426L32.232,35.413L33.282,36.502L35.198,34.515Z"
15+
android:fillColor="#A4A4A6"/>
16+
</vector>

0 commit comments

Comments
 (0)