Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[PC-000] Error Color 추가 및 Matching 화면 스크롤 영역 최하단 32px 여백 추가 #18

Merged
merged 3 commits into from
Jan 1, 2025
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,8 @@ private val Light2 = Color(0xFFE8EBF0)
private val Light3 = Color(0xFFF4F6FA)
private val White = Color(0xFFFFFFFF)

private val Error = Color(0xFFFF3059)

@Immutable
data class PieceColors(
val primaryDefault: Color = PrimaryDefault,
Expand All @@ -36,4 +38,5 @@ data class PieceColors(
val light2: Color = Light2,
val light3: Color = Light3,
val white: Color = White,
val error: Color = Error,
)
32 changes: 21 additions & 11 deletions core/designsystem/src/main/res/values/strings.xml
Original file line number Diff line number Diff line change
@@ -1,14 +1,24 @@
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="feature_matching_detail_valuepick_bottom_bar_label">매칭 수락하기</string>
<string name="feature_matching_detail_basicinfo_main_label">오늘의 매칭 조각</string>
<string name="feature_matching_detail_basicinfocard_age">나이</string>
<string name="feature_matching_detail_basicinfocard_age_particle">만</string>
<string name="feature_matching_detail_basicinfocard_age_classifier">세</string>
<string name="feature_matching_detail_basicinfocard_age_suffix">년생</string>
<string name="feature_matching_detail_basicinfocard_height">키</string>
<string name="feature_matching_detail_basicinfocard_religion">종교</string>
<string name="feature_matching_detail_basicinfocard_activityRegion">활동 지역</string>
<string name="feature_matching_detail_basicinfocard_occupation">직업</string>
<string name="feature_matching_detail_basicinfocard_smokeStatue">흡연</string>
<!--Matching-->
<string name="matching_title">Matching</string>
<string name="check_the_matching_pieces">매칭 조각을 확인해주세요!</string>
<string name="same_value_as_me">나와 같은 가치관</string>
<string name="accept_matching">매칭 수락하기</string>

<!--Matching Detail-->
<string name="basicinfo_title" />
<string name="valuetalk_title">가치관 Talk</string>
<string name="valuepick_title">가치관 Pick</string>
<string name="valuepick_bottom_bar_label">매칭 수락하기</string>
<string name="basicinfo_main_label">오늘의 매칭 조각</string>
<string name="basicinfocard_age">나이</string>
<string name="basicinfocard_age_particle">만</string>
<string name="basicinfocard_age_classifier">세</string>
<string name="basicinfocard_age_suffix">년생</string>
<string name="basicinfocard_height">키</string>
<string name="basicinfocard_religion">종교</string>
<string name="basicinfocard_activityRegion">활동 지역</string>
<string name="basicinfocard_occupation">직업</string>
<string name="basicinfocard_smokeStatue">흡연</string>
</resources>
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
Expand All @@ -25,6 +26,7 @@ import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.SpanStyle
import androidx.compose.ui.text.buildAnnotatedString
import androidx.compose.ui.text.style.TextOverflow
Expand All @@ -39,6 +41,7 @@ import com.puzzle.designsystem.component.PieceSolidButton
import com.puzzle.designsystem.foundation.PieceTheme
import com.puzzle.matching.contract.MatchingIntent
import com.puzzle.matching.contract.MatchingState
import com.puzzle.designsystem.R

@Composable
internal fun MatchingRoute(
Expand Down Expand Up @@ -66,11 +69,11 @@ internal fun MatchingScreen(
.padding(horizontal = 20.dp),
) {
PieceMainTopBar(
title = "Matching",
title = stringResource(R.string.matching_title),
titleColor = PieceTheme.colors.white,
rightComponent = {
Image(
painter = painterResource(com.puzzle.designsystem.R.drawable.ic_alarm),
painter = painterResource(R.drawable.ic_alarm),
contentDescription = "",
)
},
Expand All @@ -87,9 +90,11 @@ internal fun MatchingScreen(
Text(
text = buildAnnotatedString {
append("소중한 인연이 시작되기까지 ")

withStyle(style = SpanStyle(color = PieceTheme.colors.subDefault)) {
append("02:32:75")
}

append(" 남았어요")
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

  • p3 : 혹시 이것도 string.xml로 넣을 수 있는건가요?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

  • p3 : 혹시 이것도 string.xml로 넣을 수 있는건가요?
image

Spannable이 strings.xml로 분리가 가능한지 찾아보니까, xml상에서 color값까지 적용해주면 되긴 하네요,

다만 이렇게 될 경우 디자인 시스템에 정의해놓은 color를 따라가지 않아서 추후에 수정이 필요할 일이 생기면 번거로워질 것 같습니다...

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

아하 그렇군요! 그럼 이건 그냥 string으로 써두는게 낫겠죠?!

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

아하 그렇군요! 그럼 이건 그냥 string으로 써두는게 낫겠죠?!

넵, 일단은 Spannable은 그냥 raw String으로 쓰는걸로 해요!

},
style = PieceTheme.typography.bodySM,
Expand Down Expand Up @@ -124,7 +129,7 @@ internal fun MatchingScreen(
)

Text(
text = "매칭 조각을 확인해주세요!",
text = stringResource(R.string.check_the_matching_pieces),
style = PieceTheme.typography.bodySM,
color = PieceTheme.colors.dark3
)
Expand Down Expand Up @@ -196,7 +201,7 @@ internal fun MatchingScreen(
) {
Row(horizontalArrangement = Arrangement.spacedBy(6.dp)) {
Text(
text = "나와 같은 가치관",
text = stringResource(R.string.same_value_as_me),
style = PieceTheme.typography.bodyMM,
color = PieceTheme.colors.black,
)
Expand Down Expand Up @@ -235,10 +240,18 @@ internal fun MatchingScreen(
),
key = { it },
) { value -> ValueTag(value) }

item {
Spacer(
modifier = Modifier
.fillMaxWidth()
.height(20.dp),
)
}
}

PieceSolidButton(
label = "매칭 수락하기",
label = stringResource(R.string.accept_matching),
onClick = { navigateToMatchingDetail() },
modifier = Modifier
.padding(top = 16.dp)
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -243,7 +243,7 @@ private fun MatchingDetailBottomBar(

if (currentPage == MatchingDetailPage.ValuePickState) {
PieceRoundingButton(
label = stringResource(R.string.feature_matching_detail_valuepick_bottom_bar_label),
label = stringResource(R.string.valuepick_bottom_bar_label),
onClick = onAcceptClick,
)
} else {
Expand Down Expand Up @@ -305,7 +305,7 @@ private fun BasicInfoName(
) {
Column(modifier = modifier) {
Text(
text = stringResource(R.string.feature_matching_detail_basicinfo_main_label),
text = stringResource(R.string.basicinfo_main_label),
style = PieceTheme.typography.bodyMM,
color = PieceTheme.colors.primaryDefault,
)
Expand Down Expand Up @@ -345,11 +345,11 @@ private fun BasicInfoCard(
horizontalArrangement = Arrangement.spacedBy(4.dp),
) {
InfoItem(
title = stringResource(R.string.feature_matching_detail_basicinfocard_age),
title = stringResource(R.string.basicinfocard_age),
text = {
Row(verticalAlignment = Alignment.CenterVertically) {
Text(
text = stringResource(R.string.feature_matching_detail_basicinfocard_age_particle),
text = stringResource(R.string.basicinfocard_age_particle),
style = PieceTheme.typography.bodySM,
color = PieceTheme.colors.black,
)
Expand All @@ -363,15 +363,15 @@ private fun BasicInfoCard(
)

Text(
text = stringResource(R.string.feature_matching_detail_basicinfocard_age_classifier),
text = stringResource(R.string.basicinfocard_age_classifier),
style = PieceTheme.typography.bodySM,
color = PieceTheme.colors.black,
)

Spacer(modifier = Modifier.width(4.dp))

Text(
text = birthYear + stringResource(R.string.feature_matching_detail_basicinfocard_age_suffix),
text = birthYear + stringResource(R.string.basicinfocard_age_suffix),
style = PieceTheme.typography.bodySM,
color = PieceTheme.colors.dark2,
)
Expand All @@ -383,12 +383,12 @@ private fun BasicInfoCard(
),
)
InfoItem(
title = stringResource(R.string.feature_matching_detail_basicinfocard_height),
title = stringResource(R.string.basicinfocard_height),
content = height,
modifier = modifier.weight(1f),
)
InfoItem(
title = stringResource(R.string.feature_matching_detail_basicinfocard_religion),
title = stringResource(R.string.basicinfocard_religion),
content = religion,
modifier = modifier.weight(1f),
)
Expand All @@ -400,7 +400,7 @@ private fun BasicInfoCard(
horizontalArrangement = Arrangement.spacedBy(5.5.dp),
) {
InfoItem(
title = stringResource(R.string.feature_matching_detail_basicinfocard_activityRegion),
title = stringResource(R.string.basicinfocard_activityRegion),
content = activityRegion,
modifier = modifier.size(
width = 144.dp,
Expand All @@ -409,13 +409,13 @@ private fun BasicInfoCard(
)

InfoItem(
title = stringResource(R.string.feature_matching_detail_basicinfocard_occupation),
title = stringResource(R.string.basicinfocard_occupation),
content = occupation,
modifier = modifier.weight(1f),
)

InfoItem(
title = stringResource(R.string.feature_matching_detail_basicinfocard_smokeStatue),
title = stringResource(R.string.basicinfocard_smokeStatue),
content = smokeStatue,
modifier = modifier.weight(1f),
)
Expand Down
6 changes: 0 additions & 6 deletions feature/matching/src/main/res/values/strings.xml

This file was deleted.

Loading