HarmonyOS 鸿蒙Next Marquee 组件不支持constraintSize 属性

发布于 1周前 作者 wuwangju 最后一次编辑是 5天前 来自 鸿蒙OS

HarmonyOS 鸿蒙Next Marquee 组件不支持constraintSize 属性

Marquee 组件不支持constraintSize 属性

Marquee({
        start: true,
        step: 3,
        src: `${this.viewModel.weatherLocationVo?.content ?? ''} ${this.viewModel.weatherLocationVo?.temperature ??
          ''} ℃`
      }).constraintSize({ maxWidth: $r('app.float.size_80') })

我想实现跑马灯有个最大的width，文字少于该width 则Marquee 根据文字宽度来，文字宽度超出maxWidth，则打开跑马灯特效，现在的问题是constraintSize不生效，必须设置width才行

Harmonyos Next教程
2 回复

您可以使用Text设置constraintSize，同时text组件设置

textOverflow({ overflow: TextOverflow.MARQUEE })
// 实现跑马灯的效果，
// 参考demo：
Text("minWidth200 minWidth200 minWidth200 minWidth200 minWidth200 minWidth200 minWidth200 minWidth200 minWidth200")
  .fontColor('#FFFFFF')
  .fontSize(18)
  .fontWeight(700)
  .backgroundColor('#ffeacd0a')
  .margin({ top: 20 })
  .constraintSize({
    maxWidth: 200
  })
  .textOverflow({ overflow: TextOverflow.MARQUEE })

针对HarmonyOS 鸿蒙Next Marquee 组件不支持constraintSize属性的问题，这里给出专业解答：

在HarmonyOS中，Marquee组件确实不支持constraintSize属性。constraintSize属性通常用于设置组件的布局约束尺寸，但在Marquee组件中并不生效。要实现类似的效果，可以考虑使用Text组件并设置textOverflow属性为TextOverflow.MARQUEE，同时利用constraintSize属性来控制Text组件的尺寸。这样，当文本内容超出设置的尺寸时，就会触发跑马灯效果。

例如，可以这样设置：

Text("需要滚动的文本内容")
  .constraintSize({ maxWidth: 200 }) // 设置最大宽度
  .textOverflow({ overflow: TextOverflow.MARQUEE }) // 设置跑马灯效果

通过这种方式，可以实现与Marquee组件类似的跑马灯功能，同时能够利用constraintSize属性来控制文本尺寸。

如果问题依旧没法解决请联系官网客服，官网地址是：https://www.itying.com/category-93-b0.html

回到顶部