Skip to content

Write flow UI based on Design QA #1099

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.

Sign up for GitHub

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

Merged
DongJun-H merged 9 commits into from
Apr 22, 2026
Merged

Write flow UI based on Design QA #1099

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
505b733
#1036 [layout] Fix image edit button text wrapping
DongJun-H Apr 19, 2026
b763963
#1037 [QA] Fix tag summary truncation in Write_tag_complete
DongJun-H Apr 19, 2026
d149375
#1038 [QA] Fix selected check icon in Write_folder_selected
DongJun-H Apr 19, 2026
2f0a8d3
#1039 [QA] Fix private folder lock icon in Write_folder_selected
DongJun-H Apr 19, 2026
f52197b
#1040 [QA] Fix default folder thumbnail in Write_folder_selected
DongJun-H Apr 19, 2026
b9943e8
#1041 [QA] Fix category bottom sheet spacing in Write_category
DongJun-H Apr 19, 2026
4dcfc9e
[QA] Unify write summary spacing
DongJun-H Apr 19, 2026
0c62b26
Disable auto mirror img_default_folder_dayo_logo.xml
DongJun-H Apr 22, 2026
1341244
Disable auto mirror ic_check_corner_round.xml
DongJun-H Apr 22, 2026
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
43 changes: 23 additions & 20 deletions presentation/src/main/java/daily/dayo/presentation/screen/write/WriteFolderScreen.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand Down Expand Up @@ -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()
Expand All @@ -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(
Expand All @@ -290,42 +297,38 @@ 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)
)
Comment thread
DongJun-H marked this conversation as resolved.
}
}
}
Spacer(modifier = Modifier.width(12.dp))
Column(
modifier = Modifier
.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,
Expand Down
47 changes: 25 additions & 22 deletions presentation/src/main/java/daily/dayo/presentation/screen/write/WriteScreen.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand Down Expand Up @@ -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
Expand Down Expand Up @@ -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(
Expand Down Expand Up @@ -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
Comment on lines +472 to +478
Copy link
Copy Markdown
Member

@yuni-ju yuni-ju Apr 20, 2026

Choose a reason for hiding this comment

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

autoSize 처리 좋네요!

)
}
}
Expand Down Expand Up @@ -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(
Expand Down Expand Up @@ -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
Expand Down Expand Up @@ -787,4 +790,4 @@ fun WriteFolderLayout(
contentDescription = stringResource(R.string.write_post_select_folder_title)
)
}
}
}
10 changes: 5 additions & 5 deletions presentation/src/main/java/daily/dayo/presentation/view/dialog/BottomSheetDialog.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand Down Expand Up @@ -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
) {
Expand All @@ -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,
Expand Down Expand Up @@ -241,4 +241,4 @@ fun PreviewMyBottomSheetDialog() {
checkedButtonIndex = 0,
)
}
}
}
15 changes: 15 additions & 0 deletions presentation/src/main/res/drawable/ic_check_corner_round.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="20dp"
android:height="17dp"
android:autoMirrored="false"
android:viewportWidth="20"
android:viewportHeight="17">
Comment thread
DongJun-H marked this conversation as resolved.

<path
android:fillColor="#00000000"
android:pathData="M1.688,7.491L7.423,14.455L17.938,1.688"
android:strokeWidth="3.375"
android:strokeColor="#ffffff"
android:strokeLineCap="round"
android:strokeLineJoin="round" />
</vector>
18 changes: 4 additions & 14 deletions presentation/src/main/res/drawable/ic_lock.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,15 +1,5 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="17dp"
android:height="16dp"
android:autoMirrored="true"
android:viewportWidth="17"
android:viewportHeight="16">
<path
android:fillColor="#ffffff"
android:pathData="M12.506,5.429H4.494C3.945,5.429 3.5,5.899 3.5,6.48V12.949C3.5,13.529 3.945,14 4.494,14H12.506C13.055,14 13.5,13.529 13.5,12.949V6.48C13.5,5.899 13.055,5.429 12.506,5.429Z" />
<path
android:fillColor="#00000000"
android:pathData="M8.506,2C9.241,2 9.946,2.27 10.466,2.751C10.986,3.233 11.278,3.885 11.278,4.566V7.714H5.722V4.566C5.722,4.228 5.794,3.893 5.934,3.581C6.074,3.269 6.28,2.986 6.538,2.747C6.797,2.509 7.104,2.32 7.442,2.192C7.779,2.064 8.141,1.999 8.506,2V2Z"
android:strokeWidth="1.35"
android:strokeColor="#ffffff" />
<vector xmlns:android="http://schemas.android.com/apk/res/android" android:autoMirrored="true" android:height="15dp" android:viewportHeight="15" android:viewportWidth="13" android:width="13dp">

<path android:fillColor="#50545B" android:pathData="M7,0C9.002,0 10.625,1.623 10.625,3.625V4.631C11.948,4.696 13,5.786 13,7.125V12.125C13,13.506 11.881,14.625 10.5,14.625H2.5C1.119,14.625 0,13.506 0,12.125V7.125C0,5.786 1.052,4.696 2.375,4.631V3.625C2.375,1.623 3.998,0 6,0H7ZM6.5,8.375C5.81,8.375 5.25,8.935 5.25,9.625C5.25,10.315 5.81,10.875 6.5,10.875C7.19,10.875 7.75,10.315 7.75,9.625C7.75,8.935 7.19,8.375 6.5,8.375ZM6,1.25C4.688,1.25 3.625,2.313 3.625,3.625V4.625H9.375V3.625C9.375,2.313 8.312,1.25 7,1.25H6Z"/>

</vector>
35 changes: 35 additions & 0 deletions presentation/src/main/res/drawable/img_default_folder_dayo_logo.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="44dp"
android:height="46dp"
android:autoMirrored="false"
android:viewportWidth="44"
android:viewportHeight="46">
Comment thread
DongJun-H marked this conversation as resolved.

<path
android:fillColor="#E8EAEE"
android:pathData="M16.845,14.909C17.031,14.983 17.213,15.059 17.396,15.148L16.693,14.844C18.377,15.569 19.964,16.51 21.415,17.643L20.817,17.166C22.205,18.264 23.449,19.536 24.522,20.954L24.053,20.342C25.229,21.911 26.205,23.626 26.958,25.446L26.66,24.729C27.343,26.376 27.854,28.091 28.185,29.847C28.269,30.298 28.342,30.751 28.403,31.208L28.297,30.408C28.538,32.136 28.553,33.888 28.342,35.619L28.447,34.819C28.316,35.848 28.053,36.855 27.666,37.814L27.964,37.098C27.703,37.727 27.367,38.322 26.965,38.87L27.434,38.261C27.054,38.764 26.612,39.216 26.121,39.608L26.719,39.13C26.285,39.466 25.813,39.747 25.312,39.966L26.016,39.663C25.565,39.855 25.093,39.986 24.609,40.054L25.394,39.947C24.99,39.997 24.581,39.997 24.177,39.947L24.963,40.054C24.533,39.995 24.112,39.879 23.711,39.71L24.414,40.014C23.971,39.821 23.553,39.573 23.171,39.273L23.769,39.751C23.368,39.43 23.006,39.061 22.691,38.652L23.16,39.261C22.832,38.829 22.559,38.356 22.346,37.855L22.644,38.571C22.446,38.09 22.31,37.585 22.238,37.069L22.344,37.871C22.273,37.312 22.273,36.745 22.344,36.185L22.238,36.985C22.326,36.323 22.502,35.676 22.759,35.061L22.461,35.777C22.736,35.133 23.087,34.526 23.507,33.969L23.038,34.578C23.478,34.003 23.987,33.485 24.552,33.038L23.955,33.515C24.625,33.001 25.355,32.574 26.128,32.242L25.425,32.546C26.334,32.161 27.288,31.898 28.264,31.765L27.479,31.872C28.581,31.735 29.697,31.747 30.797,31.906L30.011,31.798C32,32.069 33.945,32.604 35.798,33.389L35.095,33.085C36.549,33.703 37.922,34.506 39.179,35.474L38.661,35.068C39.381,35.631 40.068,36.221 41.043,36.185C41.826,36.179 42.576,35.863 43.135,35.304C43.687,34.737 43.998,33.972 44,33.174C44.001,32.415 43.72,31.685 43.212,31.13C42.562,30.524 41.856,29.985 41.102,29.52C40.343,29.013 39.55,28.564 38.727,28.175C37.265,27.475 35.742,26.915 34.178,26.504C32.815,26.152 31.426,25.912 30.025,25.787C29.263,25.72 28.495,25.73 27.734,25.816C26.735,25.907 25.747,26.099 24.785,26.389C22.908,26.973 21.186,27.981 19.746,29.338C19.066,30.006 18.47,30.756 17.971,31.571C17.469,32.385 17.075,33.263 16.798,34.182C16.695,34.525 16.616,34.875 16.564,35.23C16.459,35.823 16.399,36.424 16.383,37.026C16.396,37.624 16.455,38.22 16.562,38.808C16.613,39.132 16.691,39.452 16.796,39.763C17.063,40.623 17.459,41.437 17.968,42.175C18.287,42.637 18.639,43.074 19.021,43.484C19.421,43.872 19.849,44.229 20.301,44.551C20.569,44.752 20.854,44.928 21.153,45.077C21.645,45.332 22.158,45.543 22.686,45.707C23.23,45.851 23.786,45.943 24.346,45.982C24.683,46.011 25.021,46.005 25.357,45.965C25.936,45.915 26.51,45.81 27.071,45.652C27.617,45.475 28.148,45.251 28.658,44.984C28.967,44.825 29.263,44.641 29.542,44.434C30.014,44.097 30.462,43.727 30.883,43.326C32.265,41.911 33.26,40.153 33.772,38.227C34.04,37.211 34.219,36.172 34.305,35.123C34.372,34.459 34.404,33.791 34.401,33.124C34.376,31.233 34.153,29.351 33.735,27.509C33.244,25.318 32.5,23.193 31.519,21.18C30.44,18.951 29.04,16.899 27.366,15.09C26.378,14.043 25.303,13.084 24.154,12.225C23.129,11.443 22.035,10.757 20.888,10.178C20.081,9.77 19.246,9.411 18.409,9.075C18.03,8.951 17.625,8.933 17.237,9.022C16.846,9.038 16.466,9.161 16.137,9.378C15.461,9.781 14.969,10.442 14.771,11.214C14.572,11.987 14.682,12.808 15.077,13.498L15.546,14.106C15.903,14.485 16.351,14.762 16.845,14.909Z" />

<path
android:fillColor="#E8EAEE"
android:pathData="M5.128,16.745H0V20.156H5.128V16.745Z" />

<path
android:fillColor="#E8EAEE"
android:pathData="M11.671,22.645L10.873,26.84L14.161,27.488L14.958,23.294L11.671,22.645Z" />

<path
android:fillColor="#E8EAEE"
android:pathData="M38.504,11.575L34.458,14.166L36.241,17.053L40.286,14.462L38.504,11.575Z" />

<path
android:fillColor="#E8EAEE"
android:pathData="M25.298,0L22.128,1.1L23.724,5.872L26.893,4.772L25.298,0Z" />

<path
android:fillColor="#E8EAEE"
android:pathData="M3.576,34.165L2.927,37.511L7.274,38.386L7.924,35.041L3.576,34.165Z" />

<path
android:fillColor="#E8EAEE"
android:pathData="M8.102,3.895L5.271,8.25L8.062,10.133L10.893,5.778L8.102,3.895Z" />
</vector>
Loading