Commit 00ec27c1 authored by wjf's avatar wjf

2.0.31

parent be66c9a8
This diff is collapsed.
This diff is collapsed.
{ {
"name": "fyge", "name": "fyge",
"version": "2.0.30", "version": "2.0.31",
"description": "canvas渲染引擎", "description": "canvas渲染引擎",
"main": "./build/fyge.min.js", "main": "./build/fyge.min.js",
"types": "./build/types.d.ts", "types": "./build/types.d.ts",
......
...@@ -393,6 +393,11 @@ ...@@ -393,6 +393,11 @@
Lottie新增时间轴LottieExpressionTrack,parseExpression函数,runExpressionNode函数 Lottie新增时间轴LottieExpressionTrack,parseExpression函数,runExpressionNode函数
Lottie文件的createLottieTracks方法里把原先分开属性修改成["o", "r", "p", "s"]数组遍历 Lottie文件的createLottieTracks方法里把原先分开属性修改成["o", "r", "p", "s"]数组遍历
2.0.31 Lottie新加xy维度分开的情况
Lottie文件里KeyData接口加了s字段
Lottie文件里LottieBaseTrack构造函数参数添加xy,setValue方法里的setValue添加xy参数
Lottie文件里setValue方法添加参数xy,且p和s里处理xy
Lottie文件里createLottieTracks方法遍历s,p,r,o里判断了k是否存在,不存在继续xy分开
大尺寸纹理首次传gpu使用时会掉帧,越大耗时越多。考虑如何处理 大尺寸纹理首次传gpu使用时会掉帧,越大耗时越多。考虑如何处理
......
...@@ -7,7 +7,7 @@ ...@@ -7,7 +7,7 @@
* @name VERSION * @name VERSION
* @type {string} * @type {string}
*/ */
export const VERSION = "2.0.30"; export const VERSION = "2.0.31";
/** /**
......
...@@ -157,7 +157,8 @@ interface KsData { ...@@ -157,7 +157,8 @@ interface KsData {
s: KeyData //缩放 s: KeyData //缩放
} }
interface KeyData { interface KeyData {
a: number,//貌似没用 a: number,//貌似没用,0表示无关键帧,1表示有
"s": boolean,//true表示区分维度,比如p的x和y分开走
k: KeyAniData[] | number[] | number, k: KeyAniData[] | number[] | number,
x: string,//可能有表达式 x: string,//可能有表达式
} }
...@@ -226,6 +227,7 @@ class LottieBaseTrack extends HashObject implements IAnimationTrack { ...@@ -226,6 +227,7 @@ class LottieBaseTrack extends HashObject implements IAnimationTrack {
private times?: KeyAniData[], private times?: KeyAniData[],
private loop?: LoopData, private loop?: LoopData,
private ip: number = 0,//偏移 private ip: number = 0,//偏移
private xy: "x" | "y" = null
) { ) {
super(); super();
this._instanceType = "LottieBaseTrack"; this._instanceType = "LottieBaseTrack";
...@@ -237,7 +239,7 @@ class LottieBaseTrack extends HashObject implements IAnimationTrack { ...@@ -237,7 +239,7 @@ class LottieBaseTrack extends HashObject implements IAnimationTrack {
setValue(time: number) { setValue(time: number) {
time -= this.ip; time -= this.ip;
// if (!this.obj.visible) return // if (!this.obj.visible) return
setValue(this.obj, this.cacValue(time), this.type) setValue(this.obj, this.cacValue(time), this.type, this.xy)
// var value = this.cacValue(time); // var value = this.cacValue(time);
// switch (this.type) { // switch (this.type) {
// case "r": // case "r":
...@@ -507,7 +509,7 @@ function getLoopData(x: string): LoopData { ...@@ -507,7 +509,7 @@ function getLoopData(x: string): LoopData {
return { loopInOrOut, type, duration: rr } return { loopInOrOut, type, duration: rr }
} }
function setValue(obj: Sprite, value: number | number[], type: "r" | "o" | "s" | "p") { function setValue(obj: Sprite, value: number | number[], type: "r" | "o" | "s" | "p", xy?: "x" | "y") {
//转下数字的为数组 //转下数字的为数组
if (typeof value == "number") value = [value]; if (typeof value == "number") value = [value];
switch (type) { switch (type) {
...@@ -518,10 +520,18 @@ function setValue(obj: Sprite, value: number | number[], type: "r" | "o" | "s" | ...@@ -518,10 +520,18 @@ function setValue(obj: Sprite, value: number | number[], type: "r" | "o" | "s" |
obj.alpha = value[0] / 100; obj.alpha = value[0] / 100;
break; break;
case "s": case "s":
obj.scale.set(value[0] / 100, value[1] / 100); if (xy) {
obj[xy == "x" ? "scaleX" : "scaleY"] = value[0] / 100;
} else {
obj.scale.set(value[0] / 100, value[1] / 100);
}
break; break;
case "p": case "p":
obj.position.set(value[0] - obj.anchorX, value[1] - obj.anchorY); if (xy) {
obj[xy] = value[0] - (xy == "x" ? obj.anchorX : obj.anchorY);
} else {
obj.position.set(value[0] - obj.anchorX, value[1] - obj.anchorY);
}
break; break;
} }
} }
...@@ -652,6 +662,25 @@ function createLottieTracks( ...@@ -652,6 +662,25 @@ function createLottieTracks(
["o", "r", "p", "s"].forEach((type: "o" | "r" | "p" | "s") => { ["o", "r", "p", "s"].forEach((type: "o" | "r" | "p" | "s") => {
let k: KeyAniData[] | number[] | number = ks[type].k; let k: KeyAniData[] | number[] | number = ks[type].k;
let expression: string = ks[type].x; let expression: string = ks[type].x;
//考虑x和y分开的情况,不会有加减
if (!k) {
//以防万一,判断下r和o
if (!ks[type].s || type == "r" || type == "o") return;
//这时候x就是维度了,不再是表达式
["x", "y"].forEach((xy: "x" | "y") => {
let kk = ks[type][xy].k;
let eexpression: string = ks[type][xy].x;
if (kk.length) {
tracks.push(
new LottieBaseTrack(c as Sprite, type, kk, getLoopData(eexpression), offset, xy)
)
} else {
setValue(c as Sprite, kk, type, xy);
//不管加减表达式
}
})
return;
}
//@ts-ignore //@ts-ignore
if (((type == "o" || type == "r") && k.length) ||//透明度和旋转,k有长度就是关键帧, if (((type == "o" || type == "r") && k.length) ||//透明度和旋转,k有长度就是关键帧,
((type == "s" || type == "p") && typeof k[0] != "number")) {//透明度和旋转,k有长度就是关键帧,位置和缩放得k的元素里不是number ((type == "s" || type == "p") && typeof k[0] != "number")) {//透明度和旋转,k有长度就是关键帧,位置和缩放得k的元素里不是number
......
...@@ -55,7 +55,7 @@ export class Euler { ...@@ -55,7 +55,7 @@ export class Euler {
this.onChangeCallback(); this.onChangeCallback();
} }
set(x, y, z, order) { set(x, y, z, order?) {
this._x = x; this._x = x;
this._y = y; this._y = y;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment