Add Particle 3D rotation (WON-3947)

@types/pal/pacer.d.ts

@@ -1,10 +1,9 @@
 declare module 'pal/pacer' {
-
     export class Pacer {
-        get targetFrameRate (): number;
-        set targetFrameRate (val: number);
-        onTick: (() => void) | null;
-        start (): void;
-        stop (): void;
+        get targetFrameRate(): number
+        set targetFrameRate(val: number)
+        onTick: ((stamp: number) => void) | null
+        start(): void
+        stop(): void
     }
 }

cocos/2d/assembler/label/font-utils.ts

@@ -56,7 +56,9 @@ export class CanvasPool {
 
         if (!data) {
             const canvas = ccwindow.document.createElement('canvas');
-            const context = canvas.getContext('2d');
+            const context = canvas.getContext('2d', {
+                willReadFrequently: true,
+            });
             data = {
                 canvas,
                 context,

cocos/2d/assembler/sprite/simple.ts

@@ -68,30 +68,43 @@
     private updateWorldVerts (sprite: Sprite, chunk: StaticVBChunk): void {
         const renderData = sprite.renderData;
         if (!renderData) return;
-        const vData = chunk.vb;
 
-        const dataList: IRenderData[] = renderData.data;
-        const node = sprite.node;
+        const vData = chunk.vb;
+        const dataList = renderData.data;
+        const { node } = sprite;
         const m = node.worldMatrix;
-
-        const m00 = m.m00; const m01 = m.m01; const m02 = m.m02; const m03 = m.m03;
-        const m04 = m.m04; const m05 = m.m05; const m06 = m.m06; const m07 = m.m07;
-        const m12 = m.m12; const m13 = m.m13; const m14 = m.m14; const m15 = m.m15;
+        const { m00, m01, m02, m03, m04, m05, m06, m07, m12, m13, m14, m15 } = m;
 
         const stride = renderData.floatStride;
-        let offset = 0;
         const length = dataList.length;
-        for (let i = 0; i < length; ++i) {
-            const curData = dataList[i];
-            const x = curData.x;
-            const y = curData.y;
-            let rhw = m03 * x + m07 * y + m15;
-            rhw = rhw ? 1 / rhw : 1;
-
-            offset = i * stride;
-            vData[offset + 0] = (m00 * x + m04 * y + m12) * rhw;
-            vData[offset + 1] = (m01 * x + m05 * y + m13) * rhw;
-            vData[offset + 2] = (m02 * x + m06 * y + m14) * rhw;
+        let offset = 0;
+
+        // Fast path for affine matrices
+        if (m03 === 0 && m07 === 0 && m15 === 1) {
+            for (let i = 0; i < length; ++i) {
+                const curData = dataList[i];
+                const x = curData.x;
+                const y = curData.y;
+
+                vData[offset + 0] = m00 * x + m04 * y + m12;
+                vData[offset + 1] = m01 * x + m05 * y + m13;
+                vData[offset + 2] = m02 * x + m06 * y + m14;
+                offset += stride;
+            }
+        } else {
+            // Fallback for non-affine matrices
+            for (let i = 0; i < length; ++i) {
+                const curData = dataList[i];
+                const x = curData.x;
+                const y = curData.y;
+                let rhw = m03 * x + m07 * y + m15;
+                rhw = rhw ? 1 / rhw : 1;
+
+                vData[offset + 0] = (m00 * x + m04 * y + m12) * rhw;
+                vData[offset + 1] = (m01 * x + m05 * y + m13) * rhw;
+                vData[offset + 2] = (m02 * x + m06 * y + m14) * rhw;
+                offset += stride;
+            }
         }
     }
 
@@ -190,16 +203,21 @@
 
     updateUVs (sprite: Sprite): void {
         const renderData = sprite.renderData;
-        if (!sprite.spriteFrame || !renderData) return;
+        if (!sprite.spriteFrame || !renderData) return
         const vData = renderData.chunk.vb;
         const uv = sprite.spriteFrame.uv;
         const stride = renderData.floatStride;
+        const dataLength = renderData.dataLength;
+
         let uvOffset = 3;
-        for (let i = 0; i < renderData.dataLength; ++i) {
-            const index = i * 2;
-            vData[uvOffset] = uv[index];
-            vData[uvOffset + 1] = uv[index + 1];
+        let uvIndex = 0;
+
+        for (let i = 0; i < dataLength; ++i) {  
+            vData[uvOffset] = uv[uvIndex];
+            vData[uvOffset + 1] = uv[uvIndex + 1];
+
             uvOffset += stride;
+            uvIndex += 2;
         }
     }
 

cocos/2d/assembler/utils.ts

@@ -45,6 +45,11 @@
     // convert to 0 ~ 1
     _col.set(color.r / 255, color.g / 255, color.b / 255, color.a / 255);
 
+    const colorR = _col.x;
+    const colorG = _col.y;
+    const colorB = _col.z;
+    const colorA = _col.w;
+
     let vertexOffset = 0;
     for (let i = 0; i < vertexCount; ++i) {
         const vert = dataList[i];
@@ -55,7 +60,12 @@
         vData[vertexOffset + 0] = (m00 * x + m04 * y + m12) * rhw;
         vData[vertexOffset + 1] = (m01 * x + m05 * y + m13) * rhw;
         vData[vertexOffset + 2] = (m02 * x + m06 * y + m14) * rhw;
-        Vec4.toArray(vData, _col, vertexOffset + 5);
+
+        vData[vertexOffset + 5] = colorR;
+        vData[vertexOffset + 6] = colorG;
+        vData[vertexOffset + 7] = colorB;
+        vData[vertexOffset + 8] = colorA;
+
         vertexOffset += renderData.floatStride;
     }
 
@@ -79,7 +89,7 @@
 }
 
 export function updateOpacity (renderData: RenderData, opacity: number): void {
     if(!renderData.chunk) {
         // When the allocation of chunk in StaticVBAccessor fails (when the allocated buffer is too large), chunk will be null.
         return;
     }

cocos/2d/assets/sprite-frame.ts

@@ -576,13 +576,13 @@ export class SpriteFrame extends Asset {
     public vertices: IVertices | null = null;
 
     /**
-     * @en UV for quad vertices.
-     * @zh 矩形的顶点 UV。
+     * @en The uv of the sprite frame in the original texture.
+     * @zh SpriteFrame 在原始贴图中的 UV 坐标。
      */
-    public uv: number[] = [];
-
+    public uv: Float32Array = new Float32Array(8);
     /**
-     * @deprecated since v3.7.0, this is an engine private interface that will be removed in the future.
+     * @en The packed uv of the sprite frame in the original texture.
+     * @zh SpriteFrame 在原始贴图中的打包 UV 坐标。
      */
     public unbiasUV: number[] = [];
 
@@ -1023,7 +1023,6 @@ export class SpriteFrame extends Asset {
      * @mangle
      */
     public _calculateUV (): void {
-        const arrayFill = js.array.fillItems;
         const self = this;
         const rect = self._rect;
         const uv = self.uv;
@@ -1044,42 +1043,54 @@ export class SpriteFrame extends Asset {
                 |   |
                 2 - 0
                 */
-                arrayFill(uv, r, b, r, t, l, b, l, t);
+                uv[0] = r; uv[1] = b;
+                uv[2] = r; uv[3] = t;
+                uv[4] = l; uv[5] = b;
+                uv[6] = l; uv[7] = t;
             } else if (self._isFlipUVX) {
                 /*
                 2 - 0
                 |   |
                 3 - 1
                 */
-                arrayFill(uv, r, t, r, b, l, t, l, b);
+                uv[0] = r; uv[1] = t;
+                uv[2] = r; uv[3] = b;
+                uv[4] = l; uv[5] = t;
+                uv[6] = l; uv[7] = b;
             } else if (self._isFlipUVY) {
                 /*
                 1 - 3
                 |   |
                 0 - 2
                 */
-                arrayFill(uv, l, b, l, t, r, b, r, t);
+                uv[0] = l; uv[1] = b;
+                uv[2] = l; uv[3] = t;
+                uv[4] = r; uv[5] = b;
+                uv[6] = r; uv[7] = t;
             } else {
                 /*
                 0 - 2
                 |   |
                 1 - 3
                 */
-                arrayFill(uv, l, t, l, b, r, t, r, b);
+                uv[0] = l; uv[1] = t;
+                uv[2] = l; uv[3] = b;
+                uv[4] = r; uv[5] = t;
+                uv[6] = r; uv[7] = b;
             }
 
             const ul = texw === 0 ? 0 : rect.x / texw;
             const ur = texw === 0 ? 1 : (rect.x + rect.height) / texw;
             const ut = texh === 0 ? 0 : rect.y / texh;
             const ub = texh === 0 ? 1 : (rect.y + rect.width) / texh;
             if (self._isFlipUVX && self._isFlipUVY) {
-                arrayFill(unbiasUV, ur, ub, ur, ut, ul, ub, ul, ut);
+                js.array.fillItems(unbiasUV, ur, ub, ur, ut, ul, ub, ul, ut);
             } else if (self._isFlipUVX) {
-                arrayFill(unbiasUV, ur, ut, ur, ub, ul, ut, ul, ub);
+                js.array.fillItems(unbiasUV, ur, ut, ur, ub, ul, ut, ul, ub);
             } else if (self._isFlipUVY) {
-                arrayFill(unbiasUV, ul, ub, ul, ut, ur, ub, ur, ut);
+                js.array.fillItems(unbiasUV, ul, ub, ul, ut, ur, ub, ur, ut);
             } else {
-                arrayFill(unbiasUV, ul, ut, ul, ub, ur, ut, ur, ub);
+                js.array.fillItems(unbiasUV, ul, ut, ul, ub, ur, ut, ur, ub);
             }
         } else {
             const l = texw === 0 ? 0 : rect.x / texw;
@@ -1092,41 +1103,53 @@ export class SpriteFrame extends Asset {
                 |   |
                 3 - 2
                 */
-                arrayFill(uv, r, t, l, t, r, b, l, b);
+                uv[0] = r; uv[1] = t;
+                uv[2] = l; uv[3] = t;
+                uv[4] = r; uv[5] = b;
+                uv[6] = l; uv[7] = b;
             } else if (self._isFlipUVX) {
                 /*
                 3 - 2
                 |   |
                 1 - 0
                 */
-                arrayFill(uv, r, b, l, b, r, t, l, t);
+                uv[0] = r; uv[1] = b;
+                uv[2] = l; uv[3] = b;
+                uv[4] = r; uv[5] = t;
+                uv[6] = l; uv[7] = t;
             } else if (self._isFlipUVY) {
                 /*
                 0 - 1
                 |   |
                 2 - 3
                 */
-                arrayFill(uv, l, t, r, t, l, b, r, b);
+                uv[0] = l; uv[1] = t;
+                uv[2] = r; uv[3] = t;
+                uv[4] = l; uv[5] = b;
+                uv[6] = r; uv[7] = b;
             } else {
                 /*
                 2 - 3
                 |   |
                 0 - 1
                 */
-                arrayFill(uv, l, b, r, b, l, t, r, t);
+                uv[0] = l; uv[1] = b;
+                uv[2] = r; uv[3] = b;
+                uv[4] = l; uv[5] = t;
+                uv[6] = r; uv[7] = t;
             }
             const ul = texw === 0 ? 0 : rect.x / texw;
             const ur = texw === 0 ? 1 : (rect.x + rect.width) / texw;
             const ub = texh === 0 ? 1 : (rect.y + rect.height) / texh;
             const ut = texh === 0 ? 0 : rect.y / texh;
             if (self._isFlipUVX && self._isFlipUVY) {
-                arrayFill(unbiasUV, ur, ut, ul, ut, ur, ub, ul, ub);
+                js.array.fillItems(unbiasUV, ur, ut, ul, ut, ur, ub, ul, ub);
             } else if (self._isFlipUVX) {
-                arrayFill(unbiasUV, ur, ub, ul, ub, ur, ut, ul, ut);
+                js.array.fillItems(unbiasUV, ur, ub, ul, ub, ur, ut, ul, ut);
             } else if (self._isFlipUVY) {
-                arrayFill(unbiasUV, ul, ut, ur, ut, ul, ub, ur, ub);
+                js.array.fillItems(unbiasUV, ul, ut, ur, ut, ul, ub, ur, ub);
             } else {
-                arrayFill(unbiasUV, ul, ub, ur, ub, ul, ut, ur, ut);
+                js.array.fillItems(unbiasUV, ul, ub, ur, ub, ul, ut, ur, ut);
             }
         }
 
@@ -1341,7 +1364,7 @@ export class SpriteFrame extends Asset {
             minPos: v.minPos.clone(),
             maxPos: v.maxPos.clone(),
         } : null as any;
-        sp.uv.splice(0, sp.uv.length, ...self.uv);
+        sp.uv.set(self.uv);
         sp.unbiasUV.splice(0, sp.unbiasUV.length, ...self.unbiasUV);
         sp.uvSliced.splice(0, sp.uvSliced.length, ...self.uvSliced);
         sp._rect.set(self._rect);

cocos/2d/framework/ui-transform.ts

@@ -97,16 +97,17 @@ export class UITransform extends Component {
     }
 
     set width (value) {
-        if (this._contentSize.width === value) {
+        const contentSize = this._contentSize;
+        if (contentSize.width === value) {
             return;
         }
 
         if (EDITOR) {
-            const clone = new Size(this._contentSize);
-            this._contentSize.width = value;
+            const clone = new Size(contentSize);
+            contentSize.width = value;
             this.node.emit(NodeEventType.SIZE_CHANGED, clone);
         } else {
-            this._contentSize.width = value;
+            contentSize.width = value;
             this.node.emit(NodeEventType.SIZE_CHANGED);
         }
         this._markRenderDataDirty();
@@ -123,16 +124,17 @@ export class UITransform extends Component {
     }
 
     set height (value) {
-        if (this.contentSize.height === value) {
+        const contentSize = this._contentSize;
+        if (contentSize.height === value) {
             return;
         }
 
         if (EDITOR) {
-            const clone = new Size(this._contentSize);
-            this._contentSize.height = value;
+            const clone = new Size(contentSize);
+            contentSize.height = value;
             this.node.emit(NodeEventType.SIZE_CHANGED, clone);
         } else {
-            this._contentSize.height = value;
+            contentSize.height = value;
             this.node.emit(NodeEventType.SIZE_CHANGED);
         }
         this._markRenderDataDirty();