Skip to content

Commit 102fb9d

Browse files
authored
Merge branch 'develop' into feat/#58_group_navigation
2 parents 7dc33b1 + 6290b07 commit 102fb9d

22 files changed

Lines changed: 1732 additions & 72 deletions

.idea/compiler.xml

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

.idea/gradle.xml

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

app/build.gradle.kts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -59,6 +59,7 @@ dependencies {
5959
implementation(libs.kotlinx.serialization.json)
6060
implementation(libs.accompanist.pager)
6161
implementation(libs.accompanist.pager.indicators)
62+
implementation(libs.coil.compose)
6263
testImplementation(libs.junit)
6364
androidTestImplementation(libs.androidx.junit)
6465
androidTestImplementation(libs.androidx.espresso.core)
Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
package com.texthip.thip.ui.common.buttons
2+
3+
import androidx.compose.foundation.layout.Arrangement
4+
import androidx.compose.foundation.layout.FlowRow
5+
import androidx.compose.foundation.layout.fillMaxWidth
6+
import androidx.compose.runtime.Composable
7+
import androidx.compose.runtime.mutableStateListOf
8+
import androidx.compose.runtime.remember
9+
import androidx.compose.ui.Modifier
10+
import androidx.compose.ui.tooling.preview.Preview
11+
import androidx.compose.ui.unit.dp
12+
import com.texthip.thip.ui.theme.ThipTheme
13+
14+
@Composable
15+
fun SubGenreChipGrid(
16+
subGenres: List<String>,
17+
selectedGenres: List<String>,
18+
onGenreToggle: (String) -> Unit
19+
) {
20+
FlowRow(
21+
modifier = Modifier.fillMaxWidth(),
22+
horizontalArrangement = Arrangement.spacedBy(8.dp),
23+
verticalArrangement = Arrangement.spacedBy(8.dp)
24+
) {
25+
subGenres.forEach { genre ->
26+
OptionChipButton(
27+
text = genre,
28+
isSelected = selectedGenres.contains(genre),
29+
isFilled = false,
30+
onClick = { onGenreToggle(genre) }
31+
)
32+
}
33+
}
34+
}
35+
36+
@Preview(showBackground = true)
37+
@Composable
38+
fun PreviewSubGenreChipGrid() {
39+
ThipTheme {
40+
val previewSubGenres = listOf(
41+
"태그1", "태그2", "태그3", "태그4", "태그5",
42+
"태그6", "태그7", "태그8", "태그9", "태그10"
43+
)
44+
val selectedGenres = remember { mutableStateListOf<String>() }
45+
46+
SubGenreChipGrid(
47+
subGenres = previewSubGenres,
48+
selectedGenres = selectedGenres,
49+
onGenreToggle = { genre ->
50+
if (selectedGenres.contains(genre)) {
51+
selectedGenres.remove(genre)
52+
} else {
53+
selectedGenres.add(genre)
54+
}
55+
}
56+
)
57+
}
58+
}
Lines changed: 32 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,6 @@
11
package com.texthip.thip.ui.common.header
22

3-
import androidx.compose.foundation.Image
43
import androidx.compose.foundation.background
5-
import androidx.compose.foundation.border
6-
import androidx.compose.foundation.clickable
74
import androidx.compose.foundation.layout.Box
85
import androidx.compose.foundation.layout.Column
96
import androidx.compose.foundation.layout.Row
@@ -14,33 +11,30 @@ import androidx.compose.foundation.layout.padding
1411
import androidx.compose.foundation.layout.size
1512
import androidx.compose.foundation.layout.width
1613
import androidx.compose.foundation.shape.CircleShape
17-
import androidx.compose.foundation.shape.RoundedCornerShape
1814
import androidx.compose.material3.Text
1915
import androidx.compose.runtime.Composable
2016
import androidx.compose.ui.Alignment
2117
import androidx.compose.ui.Modifier
2218
import androidx.compose.ui.draw.clip
23-
import androidx.compose.ui.graphics.Color
24-
import androidx.compose.ui.graphics.painter.Painter
25-
import androidx.compose.ui.res.stringResource
2619
import androidx.compose.ui.tooling.preview.Preview
2720
import androidx.compose.ui.unit.Dp
2821
import androidx.compose.ui.unit.dp
22+
import coil.compose.AsyncImage
23+
import com.texthip.thip.ui.common.buttons.OutlinedButton
2924
import com.texthip.thip.ui.theme.ThipTheme
3025
import com.texthip.thip.ui.theme.ThipTheme.colors
3126
import com.texthip.thip.ui.theme.ThipTheme.typography
32-
import com.texthip.thip.R
33-
import com.texthip.thip.ui.common.buttons.OutlinedButton
34-
import com.texthip.thip.ui.theme.Grey02
3527

3628
@Composable
3729
fun AuthorHeader(
3830
modifier: Modifier = Modifier,
39-
profileImage: Painter?,
31+
profileImage: String?,
4032
nickname: String,
4133
badgeText: String,
42-
buttonText: String,
43-
buttonWidth: Dp? = null,
34+
buttonText: String = "",
35+
buttonWidth: Dp = 60.dp,
36+
showButton: Boolean = true,
37+
profileImageSize: Dp = 54.dp,
4438
onButtonClick: () -> Unit = {}
4539
) {
4640
Row(
@@ -50,17 +44,17 @@ fun AuthorHeader(
5044
verticalAlignment = Alignment.CenterVertically
5145
) {
5246
if (profileImage != null) {
53-
Image(
54-
painter = profileImage,
55-
contentDescription = "작성자 장르이미지",
47+
AsyncImage(
48+
model = profileImage,
49+
contentDescription = null,
5650
modifier = Modifier
57-
.size(48.dp)
51+
.size(profileImageSize)
5852
.clip(CircleShape)
5953
)
6054
} else {
6155
Box(
6256
modifier = Modifier
63-
.size(48.dp)
57+
.size(profileImageSize)
6458
.clip(CircleShape)
6559
.background(colors.Grey)
6660
)
@@ -82,7 +76,8 @@ fun AuthorHeader(
8276
maxLines = 1
8377
)
8478
}
85-
OutlinedButton(
79+
if (showButton) {
80+
OutlinedButton(
8681
modifier = Modifier
8782
.then(
8883
if (buttonWidth != null)
@@ -94,20 +89,30 @@ fun AuthorHeader(
9489
text = buttonText,
9590
textStyle = typography.view_m500_s14,
9691
onClick = onButtonClick
97-
)
92+
)
93+
}
9894
}
9995
}
10096

10197
@Preview(showBackground = true)
10298
@Composable
10399
fun PreviewAuthorHeader() {
104100
ThipTheme {
105-
AuthorHeader(
106-
profileImage = null,
107-
nickname = "열자자제한열열자제한",
108-
badgeText = "칭호칭호칭호",
109-
buttonText = "구독",
110-
buttonWidth = 60.dp
111-
)
101+
Column {
102+
AuthorHeader(
103+
profileImage = null,
104+
nickname = "열자자제한열열자제한",
105+
badgeText = "칭호칭호칭호",
106+
buttonText = "구독",
107+
modifier = Modifier.padding(bottom = 20.dp)
108+
)
109+
AuthorHeader(
110+
profileImage = null,
111+
nickname = "열자자제한열열자제한",
112+
badgeText = "칭호칭호칭호",
113+
buttonWidth = 60.dp,
114+
showButton = false
115+
)
116+
}
112117
}
113118
}

app/src/main/java/com/texthip/thip/ui/common/topappbar/LogoTopAppBar.kt

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@ import com.texthip.thip.ui.theme.ThipTheme.colors
2323

2424
@Composable
2525
fun LogoTopAppBar(
26+
modifier: Modifier = Modifier,
2627
leftIcon: Painter,
2728
hasNotification: Boolean,
2829
onLeftClick: () -> Unit = {},
@@ -35,7 +36,7 @@ fun LogoTopAppBar(
3536
}
3637

3738
Box(
38-
modifier = Modifier
39+
modifier = modifier
3940
.fillMaxWidth()
4041
.background(color = colors.Black)
4142
.padding(horizontal = 20.dp, vertical = 16.dp),
Lines changed: 131 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,131 @@
1+
package com.texthip.thip.ui.feed.component
2+
3+
import androidx.compose.foundation.background
4+
import androidx.compose.foundation.clickable
5+
import androidx.compose.foundation.layout.Column
6+
import androidx.compose.foundation.layout.Row
7+
import androidx.compose.foundation.layout.Spacer
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.layout.size
12+
import androidx.compose.foundation.layout.width
13+
import androidx.compose.foundation.shape.CircleShape
14+
import androidx.compose.material.Icon
15+
import androidx.compose.material.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.text.SpanStyle
23+
import androidx.compose.ui.text.buildAnnotatedString
24+
import androidx.compose.ui.text.font.FontWeight
25+
import androidx.compose.ui.text.withStyle
26+
import androidx.compose.ui.tooling.preview.Preview
27+
import androidx.compose.ui.unit.dp
28+
import coil.compose.AsyncImage
29+
import com.texthip.thip.R
30+
import com.texthip.thip.ui.theme.ThipTheme
31+
import com.texthip.thip.ui.theme.ThipTheme.colors
32+
import com.texthip.thip.ui.theme.ThipTheme.typography
33+
34+
@Composable
35+
fun FeedSubscribeBarlist(
36+
modifier: Modifier = Modifier,
37+
followerProfileImageUrls: List<String>,
38+
onClick: () -> Unit
39+
) {
40+
Row(
41+
modifier = modifier
42+
.fillMaxWidth()
43+
.height(24.dp)
44+
.clickable { onClick() },
45+
verticalAlignment = Alignment.CenterVertically
46+
) {
47+
Icon(
48+
painter = painterResource(id = R.drawable.ic_group),
49+
contentDescription = null,
50+
tint = Color.Unspecified
51+
)
52+
Text(
53+
text = buildAnnotatedString {
54+
withStyle(
55+
style = SpanStyle(
56+
fontWeight = FontWeight.Bold,
57+
color = colors.White
58+
)
59+
) {
60+
append("${followerProfileImageUrls.size}")
61+
}
62+
withStyle(
63+
style = SpanStyle(
64+
color = colors.Grey
65+
)
66+
) {
67+
append("이 띱 하는중")
68+
}
69+
},
70+
style = typography.info_r400_s12,
71+
modifier = Modifier.padding(start = 2.dp)
72+
)
73+
Spacer(modifier = Modifier.weight(1f))
74+
Row(
75+
verticalAlignment = Alignment.CenterVertically
76+
) {
77+
followerProfileImageUrls.take(5).reversed().forEachIndexed { index, imageUrl ->
78+
AsyncImage(
79+
model = imageUrl,
80+
contentDescription = null,
81+
modifier = Modifier
82+
.size(24.dp)
83+
.clip(CircleShape)
84+
.background(Color.LightGray)
85+
)
86+
87+
val isLast = index == followerProfileImageUrls.take(5).lastIndex
88+
Spacer(modifier = Modifier.width(if (isLast) 15.dp else 4.dp))
89+
}
90+
91+
Icon(
92+
painter = painterResource(id = R.drawable.ic_chevron),
93+
contentDescription = null,
94+
tint = colors.Grey
95+
)
96+
}
97+
}
98+
}
99+
100+
@Preview
101+
@Composable
102+
private fun FeedSubscribelistBarPreview() {
103+
ThipTheme {
104+
Column {
105+
// Case 1: 팔로워 0
106+
FeedSubscribeBarlist(
107+
followerProfileImageUrls = emptyList(),
108+
onClick = {}
109+
)
110+
111+
// Case 2: 팔로워 3
112+
FeedSubscribeBarlist(
113+
followerProfileImageUrls = listOf(
114+
"https://example.com/image1.jpg",
115+
"https://example.com/image2.jpg",
116+
"https://example.com/image3.jpg"
117+
),
118+
onClick = {}
119+
)
120+
121+
// Case 3: 팔로워 6
122+
FeedSubscribeBarlist(
123+
followerProfileImageUrls = List(6) {
124+
"https://example.com/profile$it.jpg"
125+
},
126+
onClick = {}
127+
)
128+
}
129+
}
130+
131+
}

0 commit comments

Comments
 (0)