2.0.29

build/FYGE.d.ts

-declare namespace FYGE{export  const VERSION = "2.0.28";
+declare namespace FYGE{export  const VERSION = "2.0.29";
 
 export  const osType: "ios" | "android" | "pc";
 
@@ -6863,6 +6863,7 @@ export  class EditableText extends TextField {
     set inputValue(v: string);
     constructor();
     private initElement;
+    destroy(): void;
 }
 
 export  class InputText extends FloatDisplay {
@@ -8693,12 +8694,36 @@ export  abstract class AnimationNode extends Container {
     /**
      * 每秒刷新帧数，没设置过直接用数据里的
      */
-    get fps(): number;
+    abstract get fps(): number;
     /**
      * 设置每秒刷新率，可能值30，60等等
      * 子类重写get方法时必须重写set方法，否则执行不到父类的set方法
      */
-    set fps(v: number);
+    abstract set fps(value: number);
+    /**
+     * 重写Container父类
+     * 获取videoWidth的宽度和缩放乘积
+     * @member {number}
+     */
+    get width(): number;
+    /**
+     * 重写父级
+     * 根据videoWidth设置自身缩放x到设置的数值
+     */
+    set width(value: number);
+    /**
+     * 获取videoHeight的高度和缩放乘积
+     * @member {number}
+     */
+    get height(): number;
+    /**
+     * 根据videoHeight设置自身缩放y到设置的数值
+     */
+    set height(value: number);
+    /**
+     * 数据更新时触发，对原先设置过宽高的需要额外处理，一般在init里面自动就行
+     */
+    protected _onRawDataUpdate(): void;
     /**
      * 用于控制动画，
      * Lottie和SvgaAni里面的按帧数计，animationClip.totalTime是总帧数，因为文件标记的是帧，而不是时间

build/types.d.ts

-export  const VERSION = "2.0.28";
+export  const VERSION = "2.0.29";
 
 export  const osType: "ios" | "android" | "pc";
 
@@ -6863,6 +6863,7 @@ export  class EditableText extends TextField {
     set inputValue(v: string);
     constructor();
     private initElement;
+    destroy(): void;
 }
 
 export  class InputText extends FloatDisplay {
@@ -8693,12 +8694,36 @@ export  abstract class AnimationNode extends Container {
     /**
      * 每秒刷新帧数，没设置过直接用数据里的
      */
-    get fps(): number;
+    abstract get fps(): number;
     /**
      * 设置每秒刷新率，可能值30，60等等
      * 子类重写get方法时必须重写set方法，否则执行不到父类的set方法
      */
-    set fps(v: number);
+    abstract set fps(value: number);
+    /**
+     * 重写Container父类
+     * 获取videoWidth的宽度和缩放乘积
+     * @member {number}
+     */
+    get width(): number;
+    /**
+     * 重写父级
+     * 根据videoWidth设置自身缩放x到设置的数值
+     */
+    set width(value: number);
+    /**
+     * 获取videoHeight的高度和缩放乘积
+     * @member {number}
+     */
+    get height(): number;
+    /**
+     * 根据videoHeight设置自身缩放y到设置的数值
+     */
+    set height(value: number);
+    /**
+     * 数据更新时触发，对原先设置过宽高的需要额外处理，一般在init里面自动就行
+     */
+    protected _onRawDataUpdate(): void;
     /**
      * 用于控制动画，
      * Lottie和SvgaAni里面的按帧数计，animationClip.totalTime是总帧数，因为文件标记的是帧，而不是时间

examples/previewLottieSvga.html

@@ -80,6 +80,7 @@
                             //     (750 - v.videoSize.width) / 2,
                             //     (stage.viewRect.height - v.videoSize.height) / 2,
                             // )
+                            window.asd.stop();
                     })
                 } else {
                     //加载
@@ -88,6 +89,7 @@
                         // l.position.set((750 - json.w) / 2, (stage.viewRect.height - json.h) / 2);
                         l.play();
                         window.asd=l;
+                        window.asd.stop();
                     }, src)
                 }
             }

package.json

 {
     "name": "fyge",
-    "version": "2.0.28",
+    "version": "2.0.29",
     "description": "canvas渲染引擎",
     "main": "./build/fyge.min.js",
     "types": "./build/types.d.ts",
@@ -34,6 +34,6 @@
         "typedoc": "^0.20.20"
     },
     "keywords": [
-        "h5，淘宝小程序，canvas，webgl，3d，gltf，spine"
+        "h5，淘宝小程序，canvas，webgl，3d，gltf，spine，lottie，svga"
     ]
 }
\ No newline at end of file

record.txt

@@ -373,8 +373,23 @@
         删除buildBezierEaserProps.ts文件
         buildBezierProps文件改成buildBezierProp，去掉原先的buildBezierProps方法
 
-
-
+2.0.29  buildLine方法里对于closedShape的判断多加一条：是多边形情况下判断closed是否为true
+        EditableText的initElement方法里加
+           style.boxSizing = "border-box";
+           style.padding = "0";
+           style.margin = "0";
+        EditableText新加destroy方法
+        AnimationNode添加宽高width，height的get、set方法，将videoWidth，videoHeight作为初始宽高处理缩放scale，类似Sprite
+           也就是Lottie和SvgaAni的宽高处理类似Sprite，同时添加_onRawDataUpdate方法供子类数据更新时调用
+        AnimationNode的fps的get、set方法变为抽象，子类自行重写
+        Lottie和SvgaAni的init方法里添加设置初始值的逻辑，tracks.forEach((t) => { t.resetValue() });
+        Lottie和SvgaAni的init方法里添加执行_onRawDataUpdate
+        Lottie文件里的LottieVisibleTrack类的resetValue方法里添加执行this.setValue(0);
+        Lottie文件里的createLottieTracks方法里实例Sprite时获取纹理的逻辑修改，textures不存在或textures里字段不存在时取全局
+
+
+
+大尺寸纹理首次传gpu使用时会掉帧，越大耗时越多。考虑如何处理
 现在不改，索引数据过大时得用Uint32Array，同时开扩展gl.getExtension( "OES_element_index_uint" )和drawElements改参数类型为gl.UNSIGNED_INT
 //现在不改，DisplayObject的getLocalBounds最后是否考虑计算一次updateTransform(不用计算自己的,为了计算子级的)
 现在不改，D3Renderer里的aSkinIndex传值用了Uint8Array，类型是gl.UNSIGNED_BYTE，估计那个外星头是因为这个

src/2d/const.ts

@@ -7,7 +7,7 @@
  * @name VERSION
  * @type {string}
  */
-export const VERSION = "2.0.28";
+export const VERSION = "2.0.29";
 
 
 /**

src/2d/graphics/geomBuild/buildLine.ts

@@ -36,7 +36,7 @@ export default function (graphicsData: GraphicsData, graphicsGeometry: Graphics)
  * @param {GraphicsData} graphicsData - The graphics object containing all the necessary properties
  * @param {GraphicsGeometry} graphicsGeometry - Geometry where to append output
  */
-function buildLine(graphicsData:GraphicsData, graphicsGeometry:Graphics) {
+function buildLine(graphicsData: GraphicsData, graphicsGeometry: Graphics) {
     const shape = graphicsData.shape;
     let points = graphicsData.points || shape.points.slice();
 
@@ -58,7 +58,7 @@ function buildLine(graphicsData:GraphicsData, graphicsGeometry:Graphics) {
     // get first and last point.. figure out the middle!
     const firstPoint = new Point(points[0], points[1]);
     const lastPoint = new Point(points[points.length - 2], points[points.length - 1]);
-    const closedShape = shape.type !== SHAPES.POLY;
+    const closedShape = shape.type !== SHAPES.POLY || shape.closed;
     const closedPath = firstPoint.x === lastPoint.x && firstPoint.y === lastPoint.y;
 
     // if the first point is the last point - gonna have issues :)

src/2d/text/EditableText.ts

@@ -135,6 +135,10 @@ export class EditableText extends TextField {
         style.outline = "none";
         style.borderWidth = "thin";
         style.borderColor = "#000";
+        //ios得加
+        style.boxSizing = "border-box";
+        style.padding = "0";
+        style.margin = "0";
         //默认文案
         htmlElement.placeholder = "";
 
@@ -171,4 +175,13 @@ export class EditableText extends TextField {
             if (s.hasEventListener(Event.INPUT)) s.dispatchEvent(Event.INPUT, e)
         }
     }
+
+    destroy() {
+        //从dom节点移除
+        if (this.htmlElement && this.htmlElement.parentNode) {
+            this.htmlElement.parentNode.removeChild(this.htmlElement);
+            this.htmlElement = null;
+        }
+        super.destroy()
+    }
 }

src/2d/ui/AnimationNode.ts

 import { AnimationClip } from "../AnimationClip";
 import { Container } from "../display";
+import { sign } from "../utils";
 
 /**
  * 抽象动画类，暂时用于SvgaAni和Lottie的基类
@@ -32,15 +33,57 @@ export abstract class AnimationNode extends Container {
     /**
      * 每秒刷新帧数，没设置过直接用数据里的
      */
-    get fps(): number {
-        return this._fps || 0
-    }
+    abstract get fps(): number;
     /**
      * 设置每秒刷新率，可能值30，60等等
      * 子类重写get方法时必须重写set方法，否则执行不到父类的set方法
      */
-    set fps(v: number) {
-        this._fps = v;
+    abstract set fps(value: number);
+    /**
+     * 重写Container父类
+     * 获取videoWidth的宽度和缩放乘积
+     * @member {number}
+     */
+    get width(): number {
+        return Math.abs(this.scale.x) * this.videoWidth;
+    }
+    /**
+     * 重写父级
+     * 根据videoWidth设置自身缩放x到设置的数值
+     */
+    set width(value: number) {
+        const s = sign(this.scale.x) || 1;
+        this.scale.x = s * value / this.videoWidth;
+        this._width = value;
+    }
+
+    /**
+     * 获取videoHeight的高度和缩放乘积
+     * @member {number}
+     */
+    get height(): number {
+        return Math.abs(this.scale.y) * this.videoHeight;
+    }
+    /**
+     * 根据videoHeight设置自身缩放y到设置的数值
+     */
+    set height(value: number) {
+        const s = sign(this.scale.y) || 1;
+        this.scale.y = s * value / this.videoHeight;
+        this._height = value;
+    }
+    /**
+     * 数据更新时触发，对原先设置过宽高的需要额外处理，一般在init里面自动就行
+     */
+    protected _onRawDataUpdate() {
+        if (this._width) {
+            this.width = this._width
+            // this.scale.x = sign(this.scale.x) * this._width / this.videoWidth;
+        }
+        if (this._height) {
+            this.height = this._height
+            // this.scale.y = sign(this.scale.y) * this._height / this.videoHeight;
+        }
     }
     /**
      * 用于控制动画，

src/2d/ui/Lottie.ts

@@ -95,12 +95,16 @@ export class Lottie extends AnimationNode {
             data.textures,
             data.compositions
         );
+        //初始值设置下
+        tracks.forEach((t) => { t.resetValue() });
         //合成所有时间轴
         if (!this.animationClip) {
             this.animationClip = new AnimationClip(tracks, this.totalFrames);
         } else {
             this.animationClip.init(tracks, this.totalFrames)
         }
+        //数据更新
+        this._onRawDataUpdate();
     }
 }
 
@@ -354,7 +358,7 @@ class LottieVisibleTrack extends HashObject implements IAnimationTrack {
         this.obj.visible = this.inTime <= time && this.outTime >= time
     }
     resetValue() {
-
+        this.setValue(0);
     }
     destroy() {
         this.obj = null
@@ -560,10 +564,9 @@ function createLottieTracks(
         else {
             c = root.addChild(new Sprite(
                 refId ?
-                    textures ?
-                        textures[refId] :
-                        TextureCache[refId] ||
-                        TextureCache[refId + ".png"] : null
+                    textures && textures[refId] ||
+                    TextureCache[refId] ||
+                    TextureCache[refId + ".png"] : null
             ) as Sprite & ILottieLater);
         }
         //遮罩数据，遮罩矩阵和c一致，所以加在c里面

src/2d/ui/SvgaAni.ts

@@ -99,12 +99,16 @@ export class SvgaAni extends AnimationNode {
                 ele.frames
             ))
         })
+        //初始值设置下
+        tracks.forEach((t) => { t.resetValue() });
         //合成所有时间轴，总时间按总帧数传，其实可能应该用this.totalFrames-1的，无所谓了，只是最后一帧停留了一帧
         if (!this.animationClip) {
             this.animationClip = new AnimationClip(tracks, this.totalFrames);
         } else {
             this.animationClip.init(tracks, this.totalFrames)
         }
+        //数据更新
+        this._onRawDataUpdate();
     }
     /**
      * 添加一个动画部件，主要用于换装添加部件

src/3d/shaders/getCusShader.ts

@@ -571,7 +571,7 @@ const FRAG = [
     '	         float dy0 = - texelSize.y * shadowRadius;',
     '	         float dx1 = + texelSize.x * shadowRadius;',
     '	         float dy1 = + texelSize.y * shadowRadius;',
-    '            shadow =(',//到底错哪了，这里先加1-处理
+    '            shadow =(',
     '               texture2DCompare( shadowMap, shadowCoord.xy + vec2( dx0, dy0 ), shadowCoord.z ) +',
     '               texture2DCompare( shadowMap, shadowCoord.xy + vec2( 0.0, dy0 ), shadowCoord.z ) +',
     '               texture2DCompare( shadowMap, shadowCoord.xy + vec2( dx1, dy0 ), shadowCoord.z ) +',
@@ -595,7 +595,7 @@ const FRAG = [
     "void main() {",
     //颜色计算，通用
     "   vec4 color = vec4( uMatColor, uMatAlpha );",
-    "   color.rgb *= color.a;",//犹豫外面纹理的都预乘了，这里也坐下，如果以后确定了，直接颜色外面算好传入
+    "   color.rgb *= color.a;",//由于外面纹理的都预乘了，这里也坐下，如果以后确定了，直接颜色外面算好传入
     //纹理颜色
     "   #ifdef USE_MAP",
     "      vec4 mapColor = texture2D( uMap, vTextureCoord );",