Jetpack Compose Text mixed a suffix and an ellipsis

MixedSuffixAndEllipsisText.kt

@Composable
fun MixedSuffixAndEllipsisText(
    text: String,
    suffix: String,
) {
    Row(modifier = Modifier.padding(all = 10.dp)
    ) {
        Text(
            text = text,
            maxLines = 1,
            overflow = TextOverflow.Ellipsis,
            modifier = Modifier.weight(1f, false),
        )
        Text(
            text = suffix,
            maxLines = 1,
        )
    }
}

@Preview(showBackground = true, backgroundColor = 0xffffffff, widthDp = 240)
@Composable
private fun ShortTextPreview() {
    MixedSuffixAndEllipsisText(
        text = "0123456789".repeat(1),
        suffix = "suffix",
    )
}

@Preview(showBackground = true, backgroundColor = 0xffffffff, widthDp = 240)
@Composable
private fun LongTextPreview() {
    MixedSuffixAndEllipsisText(
        text = "0123456789".repeat(3),
        suffix = "suffix",
    )
}

Previews

References

• Jetpack Compose : Modifier.weight() の fill パラメータ