Skip to content

Commit d86d265

Browse files
authored
Merge pull request #21 from PAW-KEY/feat/#18-home-view
[Feat/#18] : home view 생성, component 작업
2 parents bbe4a00 + a60eb6d commit d86d265

File tree

13 files changed

+534
-9
lines changed

13 files changed

+534
-9
lines changed

app/src/main/java/com/paw/key/core/designsystem/component/PawkeyButton.kt

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -60,7 +60,7 @@ fun PawkeyButton(
6060
text = text,
6161
modifier = Modifier
6262
.padding(vertical = 18.dp),
63-
style = PawKeyTheme.typography.title2Sb15
63+
style = PawKeyTheme.typography.body16Sb
6464
)
6565
}
6666
}

app/src/main/java/com/paw/key/core/designsystem/component/SubChip.kt

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@ fun SubChip(
3636
Text(
3737
text = text,
3838
color = PawKeyTheme.colors.gray300,
39-
style = PawKeyTheme.typography.body7R13
39+
style = PawKeyTheme.typography.body14M
4040
)
4141
}
4242

app/src/main/java/com/paw/key/presentation/ui/home/HomeScreen.kt

Lines changed: 14 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,14 @@
11
package com.paw.key.presentation.ui.home
22

3+
import androidx.compose.foundation.layout.Column
34
import androidx.compose.foundation.layout.PaddingValues
5+
import androidx.compose.foundation.layout.fillMaxSize
6+
import androidx.compose.foundation.layout.padding
47
import androidx.compose.material3.SnackbarHostState
5-
import androidx.compose.material3.Text
68
import androidx.compose.runtime.Composable
79
import androidx.compose.ui.Modifier
8-
import androidx.compose.ui.res.stringResource
910
import androidx.compose.ui.tooling.preview.Preview
10-
import com.paw.key.R
11+
import com.paw.key.presentation.ui.home.component.TopBar
1112

1213
@Composable
1314
fun HomeRoute (
@@ -35,11 +36,17 @@ fun HomeScreen (
3536
snackBarHostState: SnackbarHostState,
3637
modifier: Modifier = Modifier
3738
) {
38-
// Todo : 변경 예정
39-
Text(
40-
text = stringResource(R.string.ic_home_description),
39+
40+
Column (
4141
modifier = modifier
42-
)
42+
.padding(paddingValues)
43+
.fillMaxSize()
44+
45+
){
46+
TopBar(
47+
location = "강남구 역삼동"
48+
)
49+
}
4350
}
4451

4552
@Preview
Lines changed: 148 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,148 @@
1+
package com.paw.key.presentation.ui.home.component
2+
3+
import androidx.compose.foundation.background
4+
import androidx.compose.foundation.layout.Arrangement
5+
import androidx.compose.foundation.layout.Box
6+
import androidx.compose.foundation.layout.Column
7+
import androidx.compose.foundation.layout.Row
8+
import androidx.compose.foundation.layout.Spacer
9+
import androidx.compose.foundation.layout.fillMaxWidth
10+
import androidx.compose.foundation.layout.height
11+
import androidx.compose.foundation.layout.padding
12+
import androidx.compose.foundation.layout.width
13+
import androidx.compose.foundation.shape.RoundedCornerShape
14+
import androidx.compose.material3.Icon
15+
import androidx.compose.material3.Text
16+
import androidx.compose.runtime.Composable
17+
import androidx.compose.ui.Alignment
18+
import androidx.compose.ui.Modifier
19+
import androidx.compose.ui.draw.clip
20+
import androidx.compose.ui.graphics.Color
21+
import androidx.compose.ui.res.painterResource
22+
import androidx.compose.ui.tooling.preview.Preview
23+
import androidx.compose.ui.unit.dp
24+
import com.paw.key.R
25+
import com.paw.key.core.designsystem.theme.PawKeyTheme
26+
27+
28+
@Preview
29+
@Composable
30+
private fun PreviewHistoryCard() {
31+
PawKeyTheme{
32+
HistoryCard()
33+
}
34+
35+
}
36+
37+
38+
@Composable
39+
fun HistoryCard(
40+
41+
){
42+
43+
Box (
44+
modifier = Modifier
45+
.width(298.dp)
46+
.height(343.dp)
47+
.background(
48+
color=PawKeyTheme.colors.white2
49+
)
50+
.clip(RoundedCornerShape(12.dp))
51+
52+
){
53+
Box(
54+
modifier=Modifier
55+
.fillMaxWidth()
56+
.height(210.dp)
57+
) {
58+
Column (
59+
60+
){
61+
HistoryTop()
62+
Box(
63+
64+
){
65+
Spacer(modifier= Modifier.height(114.dp))
66+
Box(
67+
68+
){
69+
InfoColumn(location = "강남구 역삼동", date="2025.06.26(금)", time="23:20-23:30")
70+
}
71+
}
72+
73+
}
74+
75+
}
76+
77+
}
78+
}
79+
80+
@Composable
81+
fun HistoryTop(
82+
83+
){
84+
Row (
85+
verticalAlignment = Alignment.CenterVertically,
86+
modifier = Modifier
87+
.fillMaxWidth()
88+
.height(41.dp)
89+
.background(color=PawKeyTheme.colors.beige400)
90+
.padding(horizontal = 16.dp)
91+
.clip(RoundedCornerShape(
92+
topStart = 12.dp,
93+
topEnd = 12.dp
94+
))
95+
){
96+
Text(
97+
text="최근산책",
98+
color = PawKeyTheme.colors.white1,
99+
style = PawKeyTheme.typography.body14Sb
100+
)
101+
}
102+
103+
}
104+
105+
@Composable
106+
fun InfoColumn(
107+
location : String,
108+
date : String,
109+
time : String
110+
){
111+
Column (
112+
verticalArrangement = Arrangement.Center
113+
114+
){
115+
Row(
116+
117+
){
118+
Icon(
119+
painter = painterResource(id = R.drawable.ic_home_location),
120+
contentDescription = null,
121+
tint = Color.Unspecified
122+
)
123+
Text(
124+
text=location
125+
)
126+
127+
}
128+
Row(
129+
130+
){
131+
Icon(
132+
painter = painterResource(id = R.drawable.ic_home_location),
133+
contentDescription = null,
134+
tint = Color.Unspecified
135+
)
136+
Text(
137+
text = date
138+
)
139+
Text(
140+
text=time
141+
)
142+
143+
}
144+
145+
146+
}
147+
148+
}
Lines changed: 111 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,111 @@
1+
package com.paw.key.presentation.ui.home.component
2+
3+
import androidx.compose.foundation.background
4+
import androidx.compose.foundation.layout.Box
5+
import androidx.compose.foundation.layout.Row
6+
import androidx.compose.foundation.layout.Spacer
7+
import androidx.compose.foundation.layout.fillMaxHeight
8+
import androidx.compose.foundation.layout.fillMaxWidth
9+
import androidx.compose.foundation.layout.height
10+
import androidx.compose.foundation.layout.padding
11+
import androidx.compose.foundation.shape.RoundedCornerShape
12+
import androidx.compose.material3.Card
13+
import androidx.compose.material3.Icon
14+
import androidx.compose.material3.Text
15+
import androidx.compose.runtime.Composable
16+
import androidx.compose.ui.Alignment
17+
import androidx.compose.ui.Modifier
18+
import androidx.compose.ui.graphics.Color
19+
import androidx.compose.ui.res.painterResource
20+
import androidx.compose.ui.tooling.preview.Preview
21+
import androidx.compose.ui.unit.dp
22+
import com.paw.key.R
23+
import com.paw.key.core.designsystem.theme.PawKeyTheme
24+
25+
@Preview
26+
@Composable
27+
private fun PreviewTopBar() {
28+
PawKeyTheme {
29+
TopBar(
30+
location = "강남구 역삼동"
31+
)
32+
33+
}
34+
35+
}
36+
37+
38+
@Composable
39+
fun TopBar(
40+
location: String,
41+
) {
42+
Card(
43+
modifier = Modifier
44+
.fillMaxWidth()
45+
.height(47.dp)
46+
.background(color = PawKeyTheme.colors.black),
47+
shape = RoundedCornerShape(
48+
bottomStart = 15.dp
49+
),
50+
) {
51+
Row(
52+
verticalAlignment = Alignment.CenterVertically,
53+
modifier = Modifier
54+
.fillMaxWidth()
55+
.fillMaxHeight()
56+
.background(color = PawKeyTheme.colors.black)
57+
.padding(horizontal = 16.dp, vertical = 12.dp)
58+
) {
59+
DateChip(text = "D+36",
60+
modifier = Modifier.align(Alignment.CenterVertically))
61+
Text(
62+
text = "연속 산책",
63+
modifier = Modifier.padding(start = 4.dp),
64+
color = PawKeyTheme.colors.white1,
65+
style = PawKeyTheme.typography.body14M
66+
)
67+
Spacer(modifier = Modifier.weight(1f))
68+
Icon(
69+
painter = painterResource(id = R.drawable.ic_home_location),
70+
contentDescription = null,
71+
tint = Color.Unspecified
72+
)
73+
Text(
74+
text = location,
75+
modifier = Modifier
76+
.padding(horizontal = 2.dp),
77+
color = PawKeyTheme.colors.white1,
78+
style = PawKeyTheme.typography.body14Sb
79+
)
80+
Icon(
81+
painter = painterResource(id = R.drawable.ic_home_under_arrow),
82+
contentDescription = null,
83+
tint = Color.Unspecified
84+
)
85+
86+
}
87+
88+
}
89+
90+
}
91+
92+
@Composable
93+
fun DateChip(
94+
text: String,
95+
modifier: Modifier = Modifier,
96+
) {
97+
Box(
98+
modifier
99+
.background(
100+
color = PawKeyTheme.colors.beige400,
101+
shape = RoundedCornerShape(15.dp)
102+
)
103+
.padding(horizontal = 12.dp, vertical = 2.dp)
104+
) {
105+
Text(
106+
text = text,
107+
color = PawKeyTheme.colors.white1,
108+
style = PawKeyTheme.typography.caption12Sb1
109+
)
110+
}
111+
}
Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
package com.paw.key.presentation.ui.home.component
2+
3+
import androidx.compose.foundation.Image
4+
import androidx.compose.foundation.background
5+
import androidx.compose.foundation.layout.Box
6+
import androidx.compose.foundation.layout.height
7+
import androidx.compose.foundation.layout.width
8+
import androidx.compose.runtime.Composable
9+
import androidx.compose.ui.Modifier
10+
import androidx.compose.ui.res.painterResource
11+
import androidx.compose.ui.tooling.preview.Preview
12+
import androidx.compose.ui.unit.dp
13+
import com.paw.key.R
14+
import com.paw.key.core.designsystem.theme.PawKeyTheme
15+
16+
17+
@Preview
18+
@Composable
19+
private fun PreviewTrackingCard() {
20+
PawKeyTheme {
21+
TrackingCard(
22+
)
23+
}
24+
25+
}
26+
27+
28+
@Composable
29+
fun TrackingCard(
30+
31+
){
32+
Box(
33+
modifier = Modifier
34+
.width(235.dp)
35+
.height(110.dp)
36+
.background(
37+
color= PawKeyTheme.colors.black)
38+
) {
39+
40+
}
41+
}

0 commit comments

Comments
 (0)