146 lines
3.2 KiB
TypeScript
146 lines
3.2 KiB
TypeScript
/*
|
||
* @Author: WoNiu
|
||
* @Date: 2024-03-21 13:44:57
|
||
* @LastEditTime: 2024-03-25 19:42:52
|
||
* @LastEditors: WoNiu
|
||
* @Description:
|
||
*/
|
||
/*
|
||
* @Author: WoNiu
|
||
* @Date: 2024-03-21 13:44:57
|
||
* @LastEditTime: 2024-03-23 12:57:36
|
||
* @LastEditors: WoNiu
|
||
* @Description: 倒计时进度
|
||
*/
|
||
import {
|
||
_decorator,
|
||
Component,
|
||
Director,
|
||
director,
|
||
Node,
|
||
ProgressBar,
|
||
Sprite,
|
||
tween,
|
||
UITransform,
|
||
v2,
|
||
} from "cc";
|
||
import { BaseSprite } from "../../GlobalScript/CommonComponent/BaseSprite";
|
||
import { NpkImage } from "../../Tool/NPKImage";
|
||
import { LocationImportComponent } from "../../GlobalScript/CommonComponent/LocationImportComponent";
|
||
const { ccclass } = _decorator;
|
||
|
||
/// 倒计时时间进度Node
|
||
@ccclass("TimingProgressBar")
|
||
export class TimingProgressBar extends Node {
|
||
//* 进度条bar
|
||
progressBar: ProgressBar;
|
||
//* 进度条精灵
|
||
barSprite: Sprite;
|
||
|
||
//* 缓动控制
|
||
timingComponent: TimingComponent;
|
||
|
||
constructor() {
|
||
super();
|
||
|
||
this.setPosition(353.5, -355);
|
||
this.addComponent(UITransform).anchorPoint = v2(0, 1);
|
||
|
||
this.timingComponent = this.addComponent(TimingComponent);
|
||
|
||
this.initBackgrund();
|
||
this.initBarSprite();
|
||
this.initProgressBar();
|
||
}
|
||
|
||
//* 倒计时缓动开始
|
||
/**
|
||
* @description:
|
||
* @param {number} time： 时间
|
||
* @param {Function} back： 缓动完成回调
|
||
*/
|
||
tweenerStart(time:number,back:Function){
|
||
this.timingComponent.tweenerStart(time,back);
|
||
}
|
||
|
||
initBackgrund() {
|
||
const bs = this.addComponent(BaseSprite);
|
||
bs.updateSpriteFrame(NpkImage.ingame, 43);
|
||
}
|
||
|
||
initProgressBar() {
|
||
const progressBar = this.addComponent(ProgressBar);
|
||
progressBar.barSprite = this.barSprite;
|
||
progressBar.mode = ProgressBar.Mode.FILLED;
|
||
progressBar.totalLength = 280;
|
||
progressBar.progress = 1;
|
||
this.progressBar = progressBar;
|
||
}
|
||
|
||
initBarSprite() {
|
||
const node = new Node();
|
||
this.addChild(node);
|
||
node.setPosition(60, -22);
|
||
|
||
const barNode = new Node();
|
||
node.addChild(barNode);
|
||
this.barSprite = barNode.addComponent(Sprite);
|
||
|
||
const bs = barNode.addComponent(BaseSprite);
|
||
bs.updateSpriteFrame(NpkImage.ingame, 45);
|
||
|
||
this.barSprite = bs.SpriteObj;
|
||
this.barSprite.spriteFrame = bs.SpriteObj.spriteFrame;
|
||
this.barSprite.type = Sprite.Type.FILLED;
|
||
}
|
||
}
|
||
|
||
@ccclass("TimingComponent")
|
||
export class TimingComponent extends Component {
|
||
|
||
|
||
obj = { progress: 1};
|
||
|
||
onCompleteBack: Function;
|
||
|
||
start() {
|
||
|
||
}
|
||
|
||
tweenerStart(time:number,back:Function){
|
||
|
||
this.onCompleteBack = back;
|
||
|
||
tween(this.obj)
|
||
.to(
|
||
time,
|
||
{ progress: 0 },
|
||
{
|
||
easing: "linear",
|
||
onUpdate: this.onUpdate.bind(this),
|
||
onComplete: this.onComplete.bind(this),
|
||
}
|
||
)
|
||
.start();
|
||
}
|
||
|
||
//* 缓动进度
|
||
onUpdate(target: any, ratio: number){
|
||
const timingProgressBar: TimingProgressBar = this.node as TimingProgressBar;
|
||
timingProgressBar.progressBar.progress = this.obj.progress;
|
||
}
|
||
|
||
//* 缓动完成
|
||
onComplete(){
|
||
this.obj.progress = 1;
|
||
this.onCompleteBack();
|
||
/// 这一帧结束之后销毁
|
||
director.once(Director.EVENT_END_FRAME, () => {
|
||
// 销毁
|
||
this.node.destroy();
|
||
});
|
||
}
|
||
|
||
update(deltaTime: number) {}
|
||
}
|