Android Jetpack Compose如何实现Text超尺寸时的水平跑马灯滚动

原生实现路径（无需引入第三方SDK、无需直接操作Canvas） #

• 优先使用官方内置的basicMarquee修饰符
  Jetpack Compose Foundation 1.4.0 版本起，官方已经封装好了完整的跑马灯能力，仅需挂载对应修饰符即可生效。
  该修饰符默认会检测Text内容是否超出组件被约束的显示宽度，满足条件时自动启动水平循环滚动，滚动边界判断、循环重置逻辑全部由框架内部处理，不需要自行实现复杂逻辑。
  基础实现代码：

  Text(
      text = "这是一段长度超过组件显示宽度的长文本，用于演示跑马灯滚动效果",
      modifier = Modifier
          // 必须明确限定Text的显示宽度，否则不会触发内容超出判断
          .width(180.dp)
          .basicMarquee()
  )
  

  该修饰符支持全参数自定义调整效果：可配置无限循环次数、滚动速度、每轮滚动结束后的停顿时长、首次启动滚动前的等待时间，完全可以适配不同的设计效果要求。
• 自定义灵活实现方案
  如果需要对滚动逻辑做更深度的定制（比如绑定手势触发滚动、自定义滚动的插值曲线），可以基于Compose的布局偏移能力实现，全程不需要操作Canvas绘制：
  1. 测量获取Text组件内文本的实际总宽度
  2. 通过动画持续修改Text的水平偏移量，偏移范围覆盖“从初始位置到文本完全滚出可视区域的距离”
  3. 当偏移达到最大值时，自动重置偏移到初始位置，即可形成连续循环的跑马灯效果

容易踩的配置坑 #

• 必须给Text组件添加明确的宽度约束（例如通过width、fillMaxWidth等修饰符限定最大可视宽度）。如果不对Text宽度做限制，Compose会自动分配能容纳全部文本的完整宽度，永远不会出现内容超出的场景，跑马灯逻辑自然不会被触发。
• 如果项目使用的Compose Foundation版本低于1.4.0，没有内置basicMarquee修饰符，依然可以通过上述自定义布局偏移的方案实现需求，不需要引入第三方依赖或者直接操作Canvas。

内容的提问来源于stack exchange，提问作者ming chen