Cocos Creator3.8 项目实战（五）背景无限滚屏效果如何实现

/**
 * 
 * 背景无限滚屏效果实现
 *
 * 
 * */
import { _decorator, Component, Node,UITransform } from 'cc';
const { ccclass, property } = _decorator;
@ccclass('BgMoveView')
export class BgMoveView extends Component {
  /**背景数组 */
    @property({type: Node})
  bgList:Node[] = [];
  /**移动速度 */
  @property({type: Number})
  moveSpeed:number = 200;
  /**背景图片滚出屏幕的位置*/
    bottomPosition:number = 0;
  /**背景图片高度*/
  bgHeight:number = 0;
  onLoad () {
    /**注意是负值*/
    this.bottomPosition = -this.bgList[0].getComponent(UITransform).height;
    this.bgHeight = this.bgList[0].getComponent(UITransform).height;
  }
    start() {
    }
    update(deltaTime: number) {
    for(let i = 0; i < this.bgList.length; i++) {
            /**达到触发条件，改变背景图片位置*/ 
      if(this.bgList[i].position.y <= this.bottomPosition) {
                this.bgList[i].setPosition(this.bgList[i].position.x,
          this.bgList[i+1<this.bgList.length?i+1:0].position.y + this.bgHeight);
      }
          /**背景的移动*/  
      this.bgList[i].setPosition(this.bgList[i].position.x, this.bgList[i].position.y - this.moveSpeed*deltaTime);
    }
  }
}