diff --git a/presentation/src/main/java/daily/dayo/presentation/screen/write/WriteFolderScreen.kt b/presentation/src/main/java/daily/dayo/presentation/screen/write/WriteFolderScreen.kt index ab809b72..f72d9b22 100644 --- a/presentation/src/main/java/daily/dayo/presentation/screen/write/WriteFolderScreen.kt +++ b/presentation/src/main/java/daily/dayo/presentation/screen/write/WriteFolderScreen.kt @@ -51,6 +51,7 @@ import daily.dayo.presentation.common.extension.clickableSingle import daily.dayo.presentation.common.extension.limitTo import daily.dayo.presentation.theme.Dark import daily.dayo.presentation.theme.DayoTheme +import daily.dayo.presentation.theme.Gray1_50545B import daily.dayo.presentation.theme.Gray2_767B83 import daily.dayo.presentation.theme.Gray3_9FA5AE import daily.dayo.presentation.theme.Primary_23C882 @@ -264,6 +265,11 @@ fun WriteFolderItemLayout( isSelected: Boolean = true, onFolderClick: (Long, String) -> Unit = { _, _ -> }, ) { + val thumbnailModel: Any = folder.thumbnailImage + .takeIf { it.isNotBlank() } + ?.let { "${BuildConfig.BASE_URL}/images/$it" } + ?: R.drawable.img_default_folder_dayo_logo + Row( modifier = Modifier .fillMaxWidth() @@ -278,10 +284,11 @@ fun WriteFolderItemLayout( ) { RoundImageView( context = LocalContext.current, - imageUrl = "${BuildConfig.BASE_URL}/images/${folder.thumbnailImage}", + imageUrl = thumbnailModel, modifier = Modifier.size(FOLDER_THUMBNAIL_SIZE.dp), imageSize = Size(FOLDER_THUMBNAIL_SIZE, FOLDER_THUMBNAIL_SIZE), roundSize = FOLDER_THUMBNAIL_RADIUS_SIZE.dp, + placeholderResId = R.drawable.img_default_folder_dayo_logo, ) if (isSelected) { Box( @@ -290,17 +297,17 @@ fun WriteFolderItemLayout( .clip(RoundedCornerShape(size = FOLDER_THUMBNAIL_RADIUS_SIZE.dp)) .background(Primary_23C882.copy(alpha = 0.6f)) ) { - Image( - painter = painterResource(id = R.drawable.ic_check), - contentDescription = "Selected", - contentScale = ContentScale.Crop, - colorFilter = ColorFilter.tint(White_FFFFFF), - modifier = Modifier - .size(18.dp) - .align(Alignment.Center) - ) - } - } + Image( + painter = painterResource(id = R.drawable.ic_check_corner_round), + contentDescription = "Selected", + contentScale = ContentScale.Fit, + colorFilter = ColorFilter.tint(White_FFFFFF), + modifier = Modifier + .align(Alignment.Center) + .size(18.dp) + ) + } + } } Spacer(modifier = Modifier.width(12.dp)) Column( @@ -308,24 +315,20 @@ fun WriteFolderItemLayout( .fillMaxHeight() .wrapContentHeight(Alignment.CenterVertically) ) { - Row { + Row(verticalAlignment = Alignment.CenterVertically) { if (folder.privacy == Privacy.ONLY_ME) { Image( modifier = Modifier - .height(24.dp) - .wrapContentHeight(Alignment.CenterVertically), + .size(16.dp), painter = painterResource(id = R.drawable.ic_lock), contentDescription = "Only Me", - colorFilter = ColorFilter.tint(Dark) + colorFilter = ColorFilter.tint(Gray1_50545B) ) Spacer(modifier = Modifier.width(4.dp)) } Text( modifier = Modifier - .fillMaxWidth() - .height(24.dp) - .wrapContentWidth(Alignment.Start) - .wrapContentHeight(Alignment.CenterVertically), + .fillMaxWidth(), text = folder.title, style = DayoTheme.typography.b4.copy( color = Dark, diff --git a/presentation/src/main/java/daily/dayo/presentation/screen/write/WriteScreen.kt b/presentation/src/main/java/daily/dayo/presentation/screen/write/WriteScreen.kt index 693aa1fe..ce30ca56 100644 --- a/presentation/src/main/java/daily/dayo/presentation/screen/write/WriteScreen.kt +++ b/presentation/src/main/java/daily/dayo/presentation/screen/write/WriteScreen.kt @@ -25,13 +25,14 @@ 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.layout.widthIn import androidx.compose.foundation.layout.wrapContentHeight import androidx.compose.foundation.lazy.LazyRow import androidx.compose.foundation.lazy.itemsIndexed import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.foundation.text.BasicTextField +import androidx.compose.foundation.text.TextAutoSize import androidx.compose.material.Surface +import androidx.compose.material3.Icon import androidx.compose.material3.Divider import androidx.compose.material3.ExperimentalMaterial3Api import androidx.compose.material3.SnackbarHostState @@ -64,6 +65,7 @@ import androidx.compose.ui.text.style.TextOverflow import androidx.compose.ui.text.withStyle import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp +import androidx.compose.ui.unit.sp import androidx.compose.ui.zIndex import androidx.core.content.ContextCompat import androidx.hilt.navigation.compose.hiltViewModel @@ -99,6 +101,8 @@ const val WRITE_POST_DETAIL_MAX_LENGTH = 200 const val WRITE_POST_IMAGE_SIZE = 220 const val WRITE_POST_TOP_Z_INDEX = 1f +private val WriteSummaryLabelSpacing = 12.dp + @OptIn(ExperimentalMaterial3Api::class) @Composable internal fun WriteRoute( @@ -445,26 +449,33 @@ fun WriteUploadImages( ) { Row( modifier = Modifier - .width(112.dp) + .width(116.dp) .height(36.dp) .clickable { onEditImage(index) } - .padding(horizontal = 12.dp) + .padding(horizontal = 12.dp), + horizontalArrangement = Arrangement.Center, + verticalAlignment = Alignment.CenterVertically ) { - Image( - painter = painterResource(id = R.drawable.ic_crop), - contentDescription = "edit image", - modifier = Modifier - .align(Alignment.CenterVertically) - .size(20.dp) + Icon( + painter = painterResource(id = R.drawable.ic_plus_green), + contentDescription = stringResource(R.string.write_post_image_edit), + tint = White_FFFFFF, + modifier = Modifier.size(20.dp) ) Spacer(modifier = Modifier.width(4.dp)) Text( text = stringResource(R.string.write_post_image_edit), style = DayoTheme.typography.b5, color = White_FFFFFF, - modifier = Modifier.align(Alignment.CenterVertically) + autoSize = TextAutoSize.StepBased( + minFontSize = 12.sp, + maxFontSize = 14.sp, + stepSize = 0.25.sp, + ), + maxLines = 1, + overflow = TextOverflow.Ellipsis ) } } @@ -678,13 +689,9 @@ fun WriteTagLayout( style = DayoTheme.typography.b3, color = Dark ) - Spacer( - modifier = Modifier - .weight(1f) - .widthIn(min = 54.dp) - ) + Spacer(modifier = Modifier.width(WriteSummaryLabelSpacing)) if (tags.isNotEmpty()) { - val tag = tags.joinToString(separator = ", ", postfix = " ") { + val tag = tags.joinToString(separator = ", ") { ContextCompat.getString(context, R.string.write_post_select_tag_contents).format(it) } Text( @@ -747,11 +754,7 @@ fun WriteFolderLayout( style = DayoTheme.typography.b3, color = Dark ) - Spacer( - modifier = Modifier - .weight(1f) - .widthIn(min = 54.dp) - ) + Spacer(modifier = Modifier.width(WriteSummaryLabelSpacing)) if (!folderName.isNullOrEmpty()) { Text( modifier = Modifier @@ -787,4 +790,4 @@ fun WriteFolderLayout( contentDescription = stringResource(R.string.write_post_select_folder_title) ) } -} \ No newline at end of file +} diff --git a/presentation/src/main/java/daily/dayo/presentation/view/dialog/BottomSheetDialog.kt b/presentation/src/main/java/daily/dayo/presentation/view/dialog/BottomSheetDialog.kt index 156533d1..c20c3a78 100644 --- a/presentation/src/main/java/daily/dayo/presentation/view/dialog/BottomSheetDialog.kt +++ b/presentation/src/main/java/daily/dayo/presentation/view/dialog/BottomSheetDialog.kt @@ -12,8 +12,8 @@ import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.height -import androidx.compose.foundation.layout.offset import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.width import androidx.compose.foundation.layout.wrapContentHeight import androidx.compose.foundation.layout.wrapContentSize import androidx.compose.foundation.shape.RoundedCornerShape @@ -127,7 +127,7 @@ fun BottomSheetDialog( interactionSource = interactionSource ) .background(White_FFFFFF) - .padding(12.dp), + .padding(vertical = 8.dp, horizontal = 12.dp), horizontalArrangement = Arrangement.SpaceBetween, verticalAlignment = Alignment.CenterVertically ) { @@ -139,14 +139,14 @@ fun BottomSheetDialog( tint = Color.Unspecified ) } + Spacer(modifier = Modifier.width(12.dp)) Text( text = button.first, - modifier = Modifier.offset(8.dp, 0.dp), + modifier = Modifier.weight(1f), color = if ((isFirstButtonColored && index == 0) || (checkedButtonIndex == index)) checkedColor else normalColor, fontSize = 16.sp, style = DayoTheme.typography.b4 ) - Spacer(modifier = Modifier.weight(1f)) if (checkedButtonIndex == index) { Icon( imageVector = rightIcon, @@ -241,4 +241,4 @@ fun PreviewMyBottomSheetDialog() { checkedButtonIndex = 0, ) } -} \ No newline at end of file +} diff --git a/presentation/src/main/res/drawable/ic_check_corner_round.xml b/presentation/src/main/res/drawable/ic_check_corner_round.xml new file mode 100644 index 00000000..96f06c51 --- /dev/null +++ b/presentation/src/main/res/drawable/ic_check_corner_round.xml @@ -0,0 +1,15 @@ + + + + diff --git a/presentation/src/main/res/drawable/ic_lock.xml b/presentation/src/main/res/drawable/ic_lock.xml index f760683f..455f0a60 100644 --- a/presentation/src/main/res/drawable/ic_lock.xml +++ b/presentation/src/main/res/drawable/ic_lock.xml @@ -1,15 +1,5 @@ - - - + + + + diff --git a/presentation/src/main/res/drawable/img_default_folder_dayo_logo.xml b/presentation/src/main/res/drawable/img_default_folder_dayo_logo.xml new file mode 100644 index 00000000..a2b98185 --- /dev/null +++ b/presentation/src/main/res/drawable/img_default_folder_dayo_logo.xml @@ -0,0 +1,35 @@ + + + + + + + + + + + + + + + +