Add GUI

packages/core/src/2d/assembler/ISpriteAssembler.ts

@@ -1,11 +1,27 @@
-import { Renderer } from "../../Renderer";
+import { Vector2, Vector3 } from "@galacean/engine-math";
+import { ISpriteRenderer } from "./ISpriteRenderer";
 
 /**
  * @internal
  */
 export interface ISpriteAssembler {
-  resetData(renderer: Renderer, vertexCount?: number): void;
-  updatePositions?(renderer: Renderer): void;
-  updateUVs?(renderer: Renderer): void;
-  updateColor?(renderer: Renderer): void;
+  resetData(renderer: ISpriteRenderer, vertexCount?: number): void;
+  updatePositions(
+    renderer: ISpriteRenderer,
+    width: number,
+    height: number,
+    pivot: Vector2,
+    flipX?: boolean,
+    flipY?: boolean
+  ): void;
+  updateUVs(renderer: ISpriteRenderer): void;
+  updateColor(renderer: ISpriteRenderer, alpha?: number): void;
+  getUVByLocalPosition(
+    renderer: ISpriteRenderer,
+    width: number,
+    height: number,
+    pivot: Vector2,
+    position: Vector3,
+    out: Vector2
+  ): boolean;
 }

packages/core/src/2d/assembler/ISpriteRenderer.ts

@@ -0,0 +1,16 @@
+import { Color } from "@galacean/engine-math";
+import { PrimitiveChunkManager } from "../../RenderPipeline/PrimitiveChunkManager";
+import { SubPrimitiveChunk } from "../../RenderPipeline/SubPrimitiveChunk";
+import { Transform } from "../../Transform";
+import { SpriteTileMode } from "../enums/SpriteTileMode";
+import { Sprite } from "../sprite";
+
+export interface ISpriteRenderer {
+  sprite: Sprite;
+  color?: Color;
+  tileMode?: SpriteTileMode;
+  tiledAdaptiveThreshold?: number;
+  _transform: Transform;
+  _subChunk: SubPrimitiveChunk;
+  _getChunkManager(): PrimitiveChunkManager;
+}

packages/core/src/2d/assembler/SimpleSpriteAssembler.ts

@@ -1,18 +1,17 @@
-import { BoundingBox, Matrix } from "@galacean/engine-math";
+import { Matrix, Vector2, Vector3 } from "@galacean/engine-math";
 import { StaticInterfaceImplement } from "../../base/StaticInterfaceImplement";
-import { SpriteMask } from "../sprite";
-import { SpriteRenderer } from "../sprite/SpriteRenderer";
 import { ISpriteAssembler } from "./ISpriteAssembler";
+import { ISpriteRenderer } from "./ISpriteRenderer";
 
 /**
  * @internal
  */
 @StaticInterfaceImplement<ISpriteAssembler>()
 export class SimpleSpriteAssembler {
-  static _rectangleTriangles = [0, 1, 2, 2, 1, 3];
-  static _worldMatrix = new Matrix();
+  private static _rectangleTriangles = [0, 1, 2, 2, 1, 3];
+  private static _worldMatrix = new Matrix();
 
-  static resetData(renderer: SpriteRenderer | SpriteMask): void {
+  static resetData(renderer: ISpriteRenderer): void {
     const manager = renderer._getChunkManager();
     const lastSubChunk = renderer._subChunk;
     lastSubChunk && manager.freeSubChunk(lastSubChunk);
@@ -21,16 +20,23 @@ export class SimpleSpriteAssembler {
     renderer._subChunk = subChunk;
   }
 
-  static updatePositions(renderer: SpriteRenderer | SpriteMask): void {
-    const { width, height, sprite } = renderer;
-    const { x: pivotX, y: pivotY } = sprite.pivot;
+  static updatePositions(
+    renderer: ISpriteRenderer,
+    width: number,
+    height: number,
+    pivot: Vector2,
+    flipX: boolean = false,
+    flipY: boolean = false
+  ): void {
+    const { sprite } = renderer;
+    const { x: pivotX, y: pivotY } = pivot;
     // Renderer's worldMatrix
     const worldMatrix = SimpleSpriteAssembler._worldMatrix;
     const { elements: wE } = worldMatrix;
     // Parent's worldMatrix
-    const { elements: pWE } = renderer.entity.transform.worldMatrix;
-    const sx = renderer.flipX ? -width : width;
-    const sy = renderer.flipY ? -height : height;
+    const { elements: pWE } = renderer._transform.worldMatrix;
+    const sx = flipX ? -width : width;
+    const sy = flipY ? -height : height;
     (wE[0] = pWE[0] * sx), (wE[1] = pWE[1] * sx), (wE[2] = pWE[2] * sx);
     (wE[4] = pWE[4] * sy), (wE[5] = pWE[5] * sy), (wE[6] = pWE[6] * sy);
     (wE[8] = pWE[8]), (wE[9] = pWE[9]), (wE[10] = pWE[10]);
@@ -53,11 +59,9 @@ export class SimpleSpriteAssembler {
       vertices[o + 1] = wE[1] * x + wE[5] * y + wE[13];
       vertices[o + 2] = wE[2] * x + wE[6] * y + wE[14];
     }
-
-    BoundingBox.transform(sprite._getBounds(), worldMatrix, renderer._bounds);
   }
 
-  static updateUVs(renderer: SpriteRenderer | SpriteMask): void {
+  static updateUVs(renderer: ISpriteRenderer): void {
     const spriteUVs = renderer.sprite._getUVs();
     const { x: left, y: bottom } = spriteUVs[0];
     const { x: right, y: top } = spriteUVs[3];
@@ -74,15 +78,43 @@ export class SimpleSpriteAssembler {
     vertices[offset + 28] = top;
   }
 
-  static updateColor(renderer: SpriteRenderer): void {
+  static updateColor(renderer: ISpriteRenderer, alpha: number = 1): void {
     const subChunk = renderer._subChunk;
     const { r, g, b, a } = renderer.color;
+    const finalAlpha = a * alpha;
     const vertices = subChunk.chunk.vertices;
     for (let i = 0, o = subChunk.vertexArea.start + 5; i < 4; ++i, o += 9) {
       vertices[o] = r;
       vertices[o + 1] = g;
       vertices[o + 2] = b;
-      vertices[o + 3] = a;
+      vertices[o + 3] = finalAlpha;
+    }
+  }
+
+  static getUVByLocalPosition(
+    renderer: ISpriteRenderer,
+    width: number,
+    height: number,
+    pivot: Vector2,
+    position: Vector3,
+    out: Vector2
+  ): boolean {
+    const sprite = renderer.sprite;
+    const normalizedX = position.x / width + pivot.x;
+    const normalizedY = position.y / height + pivot.y;
+    const positions = sprite._getPositions();
+    const { x: left, y: bottom } = positions[0];
+    const { x: right, y: top } = positions[3];
+    if (normalizedX >= left && normalizedX <= right && normalizedY >= bottom && normalizedY <= top) {
+      const uvs = sprite._getUVs();
+      const { x: uvLeft, y: uvBottom } = uvs[0];
+      const { x: uvRight, y: uvTop } = uvs[3];
+      const factorX = (normalizedX - left) / (right - left);
+      const factorY = (normalizedY - bottom) / (top - bottom);
+      out.set(uvLeft + (uvRight - uvLeft) * factorX, uvBottom + (uvTop - uvBottom) * factorY);
+      return true;
+    } else {
+      return false;
     }
   }
 }

packages/core/src/2d/assembler/SlicedSpriteAssembler.ts

@@ -1,20 +1,22 @@
-import { Matrix } from "@galacean/engine-math";
+import { Matrix, Vector2, Vector3 } from "@galacean/engine-math";
 import { StaticInterfaceImplement } from "../../base/StaticInterfaceImplement";
-import { SpriteRenderer } from "../sprite/SpriteRenderer";
 import { ISpriteAssembler } from "./ISpriteAssembler";
+import { ISpriteRenderer } from "./ISpriteRenderer";
 
 /**
  * @internal
  */
 @StaticInterfaceImplement<ISpriteAssembler>()
 export class SlicedSpriteAssembler {
-  static _rectangleTriangles = [
+  private static _rectangleTriangles = [
     0, 1, 4, 1, 5, 4, 1, 2, 5, 2, 6, 5, 2, 3, 6, 3, 7, 6, 4, 5, 8, 5, 9, 8, 5, 6, 9, 6, 10, 9, 6, 7, 10, 7, 11, 10, 8,
     9, 12, 9, 13, 12, 9, 10, 13, 10, 14, 13, 10, 11, 14, 11, 15, 14
   ];
-  static _worldMatrix = new Matrix();
+  private static _worldMatrix = new Matrix();
+  private static _row = new Array<number>(4);
+  private static _column = new Array<number>(4);
 
-  static resetData(renderer: SpriteRenderer): void {
+  static resetData(renderer: ISpriteRenderer): void {
     const manager = renderer._getChunkManager();
     const lastSubChunk = renderer._subChunk;
     lastSubChunk && manager.freeSubChunk(lastSubChunk);
@@ -23,8 +25,15 @@ export class SlicedSpriteAssembler {
     renderer._subChunk = subChunk;
   }
 
-  static updatePositions(renderer: SpriteRenderer): void {
-    const { width, height, sprite } = renderer;
+  static updatePositions(
+    renderer: ISpriteRenderer,
+    width: number,
+    height: number,
+    pivot: Vector2,
+    flipX: boolean = false,
+    flipY: boolean = false
+  ): void {
+    const { sprite } = renderer;
     const { border } = sprite;
     // Update local positions.
     const spritePositions = sprite._getPositions();
@@ -47,42 +56,36 @@ export class SlicedSpriteAssembler {
     //    column
     // ------------------------
     // Calculate row and column.
-    let row: number[], column: number[];
+    const { _row: row, _column: column } = SlicedSpriteAssembler;
     if (fixedLeft + fixedRight > width) {
       const widthScale = width / (fixedLeft + fixedRight);
-      row = [
-        expectWidth * left * widthScale,
-        fixedLeft * widthScale,
-        fixedLeft * widthScale,
-        width - expectWidth * (1 - right) * widthScale
-      ];
+      (row[0] = expectWidth * left * widthScale), (row[1] = row[2] = fixedLeft * widthScale);
+      row[3] = width - expectWidth * (1 - right) * widthScale;
     } else {
-      row = [expectWidth * left, fixedLeft, width - fixedRight, width - expectWidth * (1 - right)];
+      (row[0] = expectWidth * left), (row[1] = fixedLeft), (row[2] = width - fixedRight);
+      row[3] = width - expectWidth * (1 - right);
     }
 
     if (fixedTop + fixedBottom > height) {
       const heightScale = height / (fixedTop + fixedBottom);
-      column = [
-        expectHeight * bottom * heightScale,
-        fixedBottom * heightScale,
-        fixedBottom * heightScale,
-        height - expectHeight * (1 - top) * heightScale
-      ];
+      (column[0] = expectHeight * bottom * heightScale), (column[1] = column[2] = fixedBottom * heightScale);
+      column[3] = height - expectHeight * (1 - top) * heightScale;
     } else {
-      column = [expectHeight * bottom, fixedBottom, height - fixedTop, height - expectHeight * (1 - top)];
+      (column[0] = expectHeight * bottom), (column[1] = fixedBottom), (column[2] = height - fixedTop);
+      column[3] = height - expectHeight * (1 - top);
     }
 
     // Update renderer's worldMatrix.
-    const { x: pivotX, y: pivotY } = renderer.sprite.pivot;
-    const localTransX = renderer.width * pivotX;
-    const localTransY = renderer.height * pivotY;
+    const { x: pivotX, y: pivotY } = pivot;
+    const localTransX = width * pivotX;
+    const localTransY = height * pivotY;
     // Renderer's worldMatrix.
     const worldMatrix = SlicedSpriteAssembler._worldMatrix;
     const { elements: wE } = worldMatrix;
     // Parent's worldMatrix.
-    const { elements: pWE } = renderer.entity.transform.worldMatrix;
-    const sx = renderer.flipX ? -1 : 1;
-    const sy = renderer.flipY ? -1 : 1;
+    const { elements: pWE } = renderer._transform.worldMatrix;
+    const sx = flipX ? -1 : 1;
+    const sy = flipY ? -1 : 1;
     (wE[0] = pWE[0] * sx), (wE[1] = pWE[1] * sx), (wE[2] = pWE[2] * sx);
     (wE[4] = pWE[4] * sy), (wE[5] = pWE[5] * sy), (wE[6] = pWE[6] * sy);
     (wE[8] = pWE[8]), (wE[9] = pWE[9]), (wE[10] = pWE[10]);
@@ -111,14 +114,9 @@ export class SlicedSpriteAssembler {
         vertices[o + 2] = wE[2] * rowValue + wE[6] * columnValue + wE[14];
       }
     }
-
-    const { min, max } = renderer._bounds;
-    min.set(row[0], column[0], 0);
-    max.set(row[3], column[3], 0);
-    renderer._bounds.transform(worldMatrix);
   }
 
-  static updateUVs(renderer: SpriteRenderer): void {
+  static updateUVs(renderer: ISpriteRenderer): void {
     const subChunk = renderer._subChunk;
     const vertices = subChunk.chunk.vertices;
     const spriteUVs = renderer.sprite._getUVs();
@@ -131,15 +129,76 @@ export class SlicedSpriteAssembler {
     }
   }
 
-  static updateColor(renderer: SpriteRenderer): void {
+  static updateColor(renderer: ISpriteRenderer, alpha: number = 1): void {
     const subChunk = renderer._subChunk;
     const { r, g, b, a } = renderer.color;
+    const finalAlpha = a * alpha;
     const vertices = subChunk.chunk.vertices;
     for (let i = 0, o = subChunk.vertexArea.start + 5; i < 16; ++i, o += 9) {
       vertices[o] = r;
       vertices[o + 1] = g;
       vertices[o + 2] = b;
-      vertices[o + 3] = a;
+      vertices[o + 3] = finalAlpha;
+    }
+  }
+
+  static getUVByLocalPosition(
+    renderer: ISpriteRenderer,
+    width: number,
+    height: number,
+    pivot: Vector2,
+    position: Vector3,
+    out: Vector2
+  ): boolean {
+    const sprite = renderer.sprite;
+    const positions = sprite._getPositions();
+    const { x: left, y: bottom } = positions[0];
+    const { x: right, y: top } = positions[3];
+    const { border } = sprite;
+    const { width: expectWidth, height: expectHeight } = sprite;
+    const fixedLeft = expectWidth * border.x;
+    const fixedBottom = expectHeight * border.y;
+    const fixedRight = expectWidth * border.z;
+    const fixedTop = expectHeight * border.w;
+    const { _row: row, _column: column } = SlicedSpriteAssembler;
+    if (fixedLeft + fixedRight > width) {
+      const widthScale = width / (fixedLeft + fixedRight);
+      (row[0] = expectWidth * left * widthScale), (row[1] = row[2] = fixedLeft * widthScale);
+      row[3] = width - expectWidth * (1 - right) * widthScale;
+    } else {
+      (row[0] = expectWidth * left), (row[1] = fixedLeft), (row[2] = width - fixedRight);
+      row[3] = width - expectWidth * (1 - right);
+    }
+
+    if (fixedTop + fixedBottom > height) {
+      const heightScale = height / (fixedTop + fixedBottom);
+      (column[0] = expectHeight * bottom * heightScale), (column[1] = column[2] = fixedBottom * heightScale);
+      column[3] = height - expectHeight * (1 - top) * heightScale;
+    } else {
+      (column[0] = expectHeight * bottom), (column[1] = fixedBottom), (column[2] = height - fixedTop);
+      column[3] = height - expectHeight * (1 - top);
+    }
+
+    const x = position.x + width * pivot.x;
+    const y = position.y + height * pivot.y;
+    if (x >= row[0] && x <= row[3] && y >= column[0] && y <= column[3]) {
+      for (let i = row.length - 2; i >= 0; i--) {
+        if (x >= row[i]) {
+          for (let j = column.length - 2; j >= 0; j--) {
+            if (y >= column[j]) {
+              const uvs = sprite._getUVs();
+              const factorX = (x - row[i]) / (row[i + 1] - row[i]);
+              const factorY = (y - column[j]) / (column[j + 1] - column[j]);
+              const uvLeft = uvs[i].x;
+              const uvBottom = uvs[j].y;
+              out.set(uvLeft + (uvs[i + 1].x - uvLeft) * factorX, uvBottom + (uvs[j + 1].y - uvBottom) * factorY);
+              return true;
+            }
+          }
+        }
+      }
+    } else {
+      return false;
     }
   }
 }