鸿蒙封装了跑马灯组件Marquee,使用起来确实很简单。需要注意的是想要让跑马灯效果动起来,需要设置start为true。并且父组件的宽度要小于Marquee的宽度。
@Entry
@Component
struct OfficialMarqueePage {
build() {
Column() {
Row() {
Marquee({src:'我爱你中国',
start:true, //开始
step:20, //速度,默认6
loop:10, //循环次数
})
.fontColor(Color.White)
.fontSize(100)
//开始
.onStart(() => {
console.info('Marquee onStart')
})
//文本播放一次结束
.onBounce(() => {
console.info('Marquee onBounce')
})
//完成
.onFinish(() => {
console.info('Marquee onFinish')
})
}
//设置父组件的宽度小于文本宽度
.width(200)
.height(100)
.backgroundColor(Color.Black)
}
.width('100%')
.height('100%')
}
}