|
@@ -3,93 +3,78 @@ import { TweenEasing } from "./TweenEasing";
|
|
|
const { ccclass, property, executeInEditMode, playOnFocus } = cc._decorator;
|
|
const { ccclass, property, executeInEditMode, playOnFocus } = cc._decorator;
|
|
|
/**
|
|
/**
|
|
|
* 缓动数据
|
|
* 缓动数据
|
|
|
- * @author
|
|
|
|
|
|
|
+ * @author 薛鸿潇
|
|
|
*/
|
|
*/
|
|
|
@ccclass("PropsData")
|
|
@ccclass("PropsData")
|
|
|
export class PropsData {
|
|
export class PropsData {
|
|
|
- @property({ tooltip: "坐标" })
|
|
|
|
|
- public position: cc.Vec2 = cc.Vec2.ZERO;
|
|
|
|
|
- @property({ tooltip: "旋转" })
|
|
|
|
|
- public angle: number = 0;
|
|
|
|
|
- @property({ tooltip: "缩放" })
|
|
|
|
|
- public scale: number = 1;
|
|
|
|
|
|
|
+ @property({ displayName: "坐标" }) public position: cc.Vec2 = cc.Vec2.ZERO;
|
|
|
|
|
+ @property({ displayName: "旋转" }) public angle: number = 0;
|
|
|
|
|
+ @property({ displayName: "缩放" }) public scale: number = 1;
|
|
|
}
|
|
}
|
|
|
/**
|
|
/**
|
|
|
* 缓动数据
|
|
* 缓动数据
|
|
|
- * @author
|
|
|
|
|
|
|
+ * @author 薛鸿潇
|
|
|
*/
|
|
*/
|
|
|
-@ccclass//("TweenData")
|
|
|
|
|
|
|
+@ccclass("TweenData")
|
|
|
export class TweenData {
|
|
export class TweenData {
|
|
|
- // @property({ tooltip: "属性数据", type: PropsData })
|
|
|
|
|
- // public propsData: PropsData = new PropsData();
|
|
|
|
|
- @property({ tooltip: "坐标" })
|
|
|
|
|
- public position: cc.Vec2 = cc.Vec2.ZERO;
|
|
|
|
|
- @property({ tooltip: "旋转" })
|
|
|
|
|
- public angle: number = 0;
|
|
|
|
|
- @property({ tooltip: "缩放" })
|
|
|
|
|
- public scale: number = 1;
|
|
|
|
|
-
|
|
|
|
|
- @property({ tooltip: "持续时间,单位为秒" })
|
|
|
|
|
- public duration: number = 0.3;
|
|
|
|
|
- @property({ tooltip: "延迟时间,单位为秒" })
|
|
|
|
|
- public delay: number = 0;
|
|
|
|
|
- @property({ tooltip: "是否为差值" })
|
|
|
|
|
- public isOffset: boolean = false;
|
|
|
|
|
- @property({ tooltip: "当缓动动作完成时触发", type: cc.Component.EventHandler })
|
|
|
|
|
- public onComplete: cc.Component.EventHandler = new cc.Component.EventHandler();
|
|
|
|
|
- @property({ tooltip: "当缓动动作启动时触发", type: cc.Component.EventHandler })
|
|
|
|
|
- public onStart: cc.Component.EventHandler = new cc.Component.EventHandler();
|
|
|
|
|
- @property({ tooltip: "当缓动动作更新时触发", type: cc.Component.EventHandler })
|
|
|
|
|
- public onUpdate: cc.Component.EventHandler = new cc.Component.EventHandler();
|
|
|
|
|
|
|
+ @property({ displayName: "属性数据", type: PropsData }) public propsData: PropsData = new PropsData();
|
|
|
|
|
+ @property({ displayName: "持续时间", tooltip: '单位:秒' }) public duration: number = 0.3;
|
|
|
|
|
+ @property({ displayName: "延迟时间", tooltip: '单位:秒' }) public delay: number = 0;
|
|
|
|
|
+ @property({ displayName: "是否为差值" }) public isOffset: boolean = false;
|
|
|
|
|
+ @property({ displayName: '完成回调', tooltip: "当缓动动作完成时触发", type: cc.Component.EventHandler }) public onComplete: cc.Component.EventHandler = new cc.Component.EventHandler();
|
|
|
|
|
+ @property({ displayName: '开始回调', tooltip: "当缓动动作启动时触发", type: cc.Component.EventHandler }) public onStart: cc.Component.EventHandler = new cc.Component.EventHandler();
|
|
|
|
|
+ @property({ displayName: '过程回调', tooltip: "当缓动动作更新时触发", type: cc.Component.EventHandler }) public onUpdate: cc.Component.EventHandler = new cc.Component.EventHandler();
|
|
|
}
|
|
}
|
|
|
/**
|
|
/**
|
|
|
* 缓动组件,目前只支持节点的三个基础属性
|
|
* 缓动组件,目前只支持节点的三个基础属性
|
|
|
- * 目前改动类后会导致编辑器内的属性记录丢失,请不要使用
|
|
|
|
|
- * @author
|
|
|
|
|
|
|
+ * @author 薛鸿潇
|
|
|
*/
|
|
*/
|
|
|
-@ccclass//('UITween')
|
|
|
|
|
|
|
+@ccclass
|
|
|
@executeInEditMode()
|
|
@executeInEditMode()
|
|
|
@playOnFocus()
|
|
@playOnFocus()
|
|
|
export class UITween extends cc.Component {
|
|
export class UITween extends cc.Component {
|
|
|
- @property
|
|
|
|
|
- private err = '属性记录会丢失,请不要使用'
|
|
|
|
|
- @property({ tooltip: "节点初始属性", type: PropsData })
|
|
|
|
|
- public fromData: PropsData = new PropsData();
|
|
|
|
|
- @property({ tooltip: "节点目标属性", type: TweenData, serializable: false })//, serializable: false
|
|
|
|
|
- public targetData: TweenData[] = [];//new TweenData()
|
|
|
|
|
- @property({ tooltip: "要播放缓动动画的目标,不填则是当前节点", type: cc.Node })
|
|
|
|
|
- public target: cc.Node = null;
|
|
|
|
|
- @property({ tooltip: "缓动效果", type: cc.Enum(TweenEasing) })
|
|
|
|
|
- public tweenEasing: TweenEasing = TweenEasing.linear;
|
|
|
|
|
- @property({ tooltip: "执行次数,为0则一直重复执行" })
|
|
|
|
|
- public repeat: number = 1;
|
|
|
|
|
- @property({ tooltip: "单次缓动序列执行完毕时触发", type: cc.Component.EventHandler })
|
|
|
|
|
- public onOneRepeatComplete: cc.Component.EventHandler = new cc.Component.EventHandler();
|
|
|
|
|
- @property({ tooltip: "是否在缓动组件运行时自动播放缓动动画" })
|
|
|
|
|
- public playOnLoad: boolean = false;
|
|
|
|
|
|
|
+ @property({ displayName: "节点初始属性", type: PropsData }) public fromData: PropsData = new PropsData();
|
|
|
|
|
+ @property({ displayName: "节点目标属性", type: TweenData }) public targetData: TweenData[] = [];
|
|
|
|
|
+ @property({ displayName: '缓动节点', tooltip: "要播放缓动动画的目标,不填则是当前节点", type: cc.Node }) public target: cc.Node = null;
|
|
|
|
|
+ @property({ displayName: "缓动效果", type: cc.Enum(TweenEasing) }) public tweenEasing: TweenEasing = TweenEasing.linear;
|
|
|
|
|
+ @property({ displayName: '执行次数', tooltip: "为0则一直重复执行" }) public repeat: number = 1;
|
|
|
|
|
+ @property({ displayName: "单次完成回调", tooltip: '单次缓动序列执行完毕时触发', type: cc.Component.EventHandler }) public onOneRepeatComplete: cc.Component.EventHandler = new cc.Component.EventHandler();
|
|
|
|
|
+ @property({ displayName: "自动播放" }) public playOnLoad: boolean = false;
|
|
|
|
|
+
|
|
|
|
|
+ private _edit_play: boolean = false;
|
|
|
@property({ displayName: "编辑器预览" })
|
|
@property({ displayName: "编辑器预览" })
|
|
|
- public _playOnEdit: boolean = false;
|
|
|
|
|
- @property({ displayName: "编辑器预览" })//, editorOnly: true
|
|
|
|
|
- get playOnEdit(): boolean {
|
|
|
|
|
- if (this._playOnEdit) {
|
|
|
|
|
- this.play()
|
|
|
|
|
|
|
+ get edit_play(): boolean {
|
|
|
|
|
+ if (this._edit_play && !this.edit_playing) {
|
|
|
|
|
+ this.edit_playing = true;
|
|
|
|
|
+ this.play();
|
|
|
}
|
|
}
|
|
|
- return this._playOnEdit;
|
|
|
|
|
|
|
+ return this._edit_play;
|
|
|
}
|
|
}
|
|
|
- set playOnEdit(v: boolean) {
|
|
|
|
|
- this._playOnEdit = v;
|
|
|
|
|
|
|
+ set edit_play(v: boolean) {
|
|
|
|
|
+ this._edit_play = v;
|
|
|
|
|
+ if (this.target && v) {
|
|
|
|
|
+ this.target.stopAllActions();
|
|
|
|
|
+ }
|
|
|
|
|
+ if (!v) this.edit_playing = false;
|
|
|
}
|
|
}
|
|
|
|
|
+ /** 编辑器是否正在播放 */
|
|
|
|
|
+ private edit_playing = false;
|
|
|
|
|
+
|
|
|
public start() {
|
|
public start() {
|
|
|
- // if (CC_EDITOR && !this._playOnEdit) return;
|
|
|
|
|
!this.target && (this.target = this.node);
|
|
!this.target && (this.target = this.node);
|
|
|
this.target = this.target || this.node;
|
|
this.target = this.target || this.node;
|
|
|
this.currentRepeat = this.repeat;
|
|
this.currentRepeat = this.repeat;
|
|
|
- this.playOnLoad && this.play();
|
|
|
|
|
|
|
+ if (CC_EDITOR) {
|
|
|
|
|
+ this._edit_play && this.play();
|
|
|
|
|
+ } else {
|
|
|
|
|
+ this.playOnLoad && this.play();
|
|
|
|
|
+ }
|
|
|
}
|
|
}
|
|
|
private t: cc.Tween<any>;
|
|
private t: cc.Tween<any>;
|
|
|
|
|
+ /** 剩余播放次数 */
|
|
|
private currentRepeat: number;
|
|
private currentRepeat: number;
|
|
|
public play() {
|
|
public play() {
|
|
|
- if (CC_EDITOR && !this._playOnEdit) return;
|
|
|
|
|
|
|
+ if (CC_EDITOR && !this.edit_playing) return;
|
|
|
if (this.repeat == 0) {
|
|
if (this.repeat == 0) {
|
|
|
this.t = cc.tween(this.target);
|
|
this.t = cc.tween(this.target);
|
|
|
this.readyPlay();
|
|
this.readyPlay();
|
|
@@ -121,14 +106,14 @@ export class UITween extends cc.Component {
|
|
|
this.t = this.t.delay(targetData.delay);
|
|
this.t = this.t.delay(targetData.delay);
|
|
|
}
|
|
}
|
|
|
let toData = {
|
|
let toData = {
|
|
|
- position: targetData.position,
|
|
|
|
|
- scale: targetData.scale,
|
|
|
|
|
- angle: targetData.angle
|
|
|
|
|
|
|
+ position: targetData.propsData.position,
|
|
|
|
|
+ scale: targetData.propsData.scale,
|
|
|
|
|
+ angle: targetData.propsData.angle
|
|
|
}
|
|
}
|
|
|
if (targetData.isOffset) {
|
|
if (targetData.isOffset) {
|
|
|
- toData.position = this.node.getPosition().add(targetData.position);
|
|
|
|
|
- toData.scale = this.node.scale + targetData.scale;
|
|
|
|
|
- toData.angle = this.node.angle + targetData.angle;
|
|
|
|
|
|
|
+ toData.position = this.node.getPosition().add(targetData.propsData.position);
|
|
|
|
|
+ toData.scale = this.node.scale + targetData.propsData.scale;
|
|
|
|
|
+ toData.angle = this.node.angle + targetData.propsData.angle;
|
|
|
}
|
|
}
|
|
|
this.t = this.t.to(
|
|
this.t = this.t.to(
|
|
|
targetData.duration,
|
|
targetData.duration,
|
|
@@ -137,6 +122,8 @@ export class UITween extends cc.Component {
|
|
|
easing: TweenEasing[this.tweenEasing] as any,
|
|
easing: TweenEasing[this.tweenEasing] as any,
|
|
|
onComplete: (target: cc.Node) => {
|
|
onComplete: (target: cc.Node) => {
|
|
|
targetData.onComplete && targetData.onComplete.emit([target]);
|
|
targetData.onComplete && targetData.onComplete.emit([target]);
|
|
|
|
|
+ this.edit_playing = false;
|
|
|
|
|
+ this._edit_play = false;
|
|
|
},
|
|
},
|
|
|
onStart: (target: cc.Node) => { targetData.onStart && targetData.onStart.emit([target]) },
|
|
onStart: (target: cc.Node) => { targetData.onStart && targetData.onStart.emit([target]) },
|
|
|
onUpdate: (target: cc.Node, ratio: number) => { targetData.onUpdate && targetData.onUpdate.emit([target, ratio]) }
|
|
onUpdate: (target: cc.Node, ratio: number) => { targetData.onUpdate && targetData.onUpdate.emit([target, ratio]) }
|