设置Sprite的Type为FILLED模式,就可以制作一种倒计时进度条的效果,FillType可以设置为圆形,水平,垂直等
const {ccclass, property} = cc._decorator; @ccclass export default class t_FilledSpriteControl extends cc.Component { speed = 0.1 @property(cc.Sprite) horizontal:cc.Sprite = null @property(cc.Sprite) vertical:cc.Sprite = null @property(cc.Sprite) radial_round:cc.Sprite = null @property(cc.Sprite) radial_semicircle:cc.Sprite = null update (dt) { this._updataFillStart(this.horizontal, dt); this._updataFillStart(this.vertical, dt); this._updateFillRange(this.radial_round, 1, dt); this._updateFillRange(this.radial_semicircle, 0.5, dt); } _updataFillStart (sprite, dt) { var fillStart = sprite.fillStart; fillStart = fillStart > 0 ? fillStart -= (dt * this.speed) : 1; sprite.fillStart = fillStart; //控制水平垂直的进度 } _updateFillRange (sprite, range, dt) { var fillRange = sprite.fillRange; fillRange = fillRange < range ? fillRange += (dt * this.speed) : 0; sprite.fillRange = fillRange; //控制圆形的进度 } }