HarmonyOS 鸿蒙Next类似弹幕效果如何实现

参考demo如下，需要自行封装

import { KeyboardAvoidMode } from '@kit.ArkUI'
class ControllerClass{
  add = (title:string){}
}
@Entry
@Component
struct DanMuPage {
  aboutToAppear(): void {
    this.getUIContext().setKeyboardAvoidMode(KeyboardAvoidMode.RESIZE)
  }
  @State nowInput:string = ''
  @State controllerClassIns:ControllerClass = new ControllerClass()
  build() {
    Column () {
      DanMu({dmController:this.controllerClassIns })
      Row().layoutWeight(1)
      Flex({justifyContent:FlexAlign.SpaceAround}){
        TextInput({text:$$this.nowInput}).width('80%')
        Button('发送').onClick(() =>{
          this.controllerClassIns.add(this.nowInput)
        })
      }.padding(20)
    }
    .height('100%')
  }
}
@Observed
class dmItemClass {
  textDm:string = ''
}
@Component
struct DanMu {
  @Link dmController:ControllerClass
  @State dmItemList:dmItemClass[] = []
  aboutToAppear(): void {
    this.dmController.add = (title:string)=>{
      this.addText(title)
    }
  }
  build() {
    Column(){
      ForEach(this.dmItemList,(dmItem:dmItemClass,index) =>{
        Row(){
          DanMuItem({dmItem:dmItem})
            .onAppear(() =>{
              console.info("进入onAppear")
            })
        }.width('100%')
        .position({x:0,y:0})
      },(item:dmItemClass,index) =>index.toString())
    }
  }
  /**
   * 增加弹幕
   */
  addText(title:string){
    let ins = new dmItemClass()
    ins.textDm = title
    this.dmItemList.push(ins)
    console.info("进入增加弹幕")
  }
}
@Component
struct DanMuItem{
  @ObjectLink dmItem:dmItemClass
  positionY:number = Math.random() * 200
  build() {
    Row(){
      Row(){
        Text('用户xxx:')
          .fontColor('#FFA500')
        Text(this.dmItem.textDm)
          .fontColor('#FFFFFF')
      }
      .border({width:1})
      .borderColor('#33FFFFFF')
      .borderRadius(15)
      .backgroundColor('#22333333')
      .height(30)
      .padding(5)
    }
    .width('100%')
    .height(40)
    .align(Alignment.Center)
    .translate({x:'-100%'})
    .transition(
      TransitionEffect.translate({x:'200%'}).animation({duration:4000,curve: Curve.Linear})
    )
    .position({
      y:this.positionY?this.positionY:0
    })
  }
}