Jetpack Compose实现文本溢出时开头显示省略号的问题

默认的TextOverflow.Ellipsis只会在文本末尾添加省略号，要实现开头（左侧）显示省略号，可以通过文本反转+视觉反转的方式快速实现，具体如下：

实现思路 #

1. 反转原始文本内容，让原文本的开头变为反转文本的末尾
2. 给反转后的文本设置overflow = TextOverflow.Ellipsis，此时省略号会出现在反转文本的末尾（对应原文本的开头）
3. 通过文本样式设置textDirection = TextDirection.Rtl，让文本视觉上反转回来，同时调整对齐方式保证显示正常

修改后的代码 #

替换你原代码中的Text组件部分：

Text(
    text = currentWeekText.reversed(), // 反转文本内容
    style = LGAppTypography.mobileBodyMedium.copy(
        textDirection = TextDirection.Rtl // 视觉上反转文本方向
    ),
    color = colorResource(id = R.color.Color_11161D),
    fontWeight = FontWeight.W400,
    maxLines = 1,
    overflow = TextOverflow.Ellipsis,
    textAlign = TextAlign.End // 匹配反转后的文本对齐逻辑
)

注意事项 #

• 如果文本包含 emoji、双向语言字符等特殊内容，直接反转可能导致显示异常，这种场景建议使用自定义Layout组件，通过测量文本宽度手动计算截断位置并添加开头省略号，不过实现复杂度更高
• 确保父容器的布局方向（如Row的reverseLayout属性）不会干扰文本的显示逻辑

内容的提问来源于stack exchange，提问作者Nguyễn Hoàng Ấn