@galacean/engine 0.0.0-experimental-2.0-game.8 → 0.0.0-experimental-2.0-game.9

package/dist/browser.js

@@ -7017,7 +7017,7 @@
         _inherits$2(FontAtlas, ReferResource);
         function FontAtlas(engine) {
             var _this;
-            _this = ReferResource.call(this, engine) || this, _this._charInfoMap = {}, _this._space = 1, _this._curX = 1, _this._curY = 1, _this._nextY = 1;
+            _this = ReferResource.call(this, engine) || this, _this._charInfoMap = {}, _this._space = 4, _this._curX = 4, _this._curY = 4, _this._nextY = 4;
             _this.isGCIgnored = true;
             var format = engine._hardwareRenderer.isWebGL2 ? TextureFormat.R8 : TextureFormat.Alpha8;
             var texture = new Texture2D(engine, 512, 512, format, false);
@@ -14611,6 +14611,28 @@
             // Order: cheap reference checks → mask state → tag lookup (rare opt-out)
             return preElement.subChunk.chunk === curElement.subChunk.chunk && preElement.texture === curElement.texture && preElement.material === curElement.material && maskInteraction === renderer.maskInteraction && (maskInteraction === SpriteMaskInteraction.None || preRenderer.maskLayer === renderer.maskLayer) && curElement.subShader.passes[0].getTagValue(VertexMergeBatcher._disableBatchTag) !== true;
         };
+        /**
+       * Text-specific batch check: extends sprite check with outline parity.
+       * Different outlineWidth or outlineColor must split into separate draw calls,
+       * because outline uniforms are shared per draw call.
+       */ VertexMergeBatcher.canBatchText = function canBatchText(preElement, curElement) {
+            if (!VertexMergeBatcher.canBatchSprite(preElement, curElement)) {
+                return false;
+            }
+            var preRendererAny = preElement.component;
+            var curRendererAny = curElement.component;
+            if (preRendererAny._outlineWidth !== curRendererAny._outlineWidth) {
+                return false;
+            }
+            if (preRendererAny._outlineWidth > 0) {
+                var a = preRendererAny._outlineColor;
+                var b = curRendererAny._outlineColor;
+                if (a.r !== b.r || a.g !== b.g || a.b !== b.b || a.a !== b.a) {
+                    return false;
+                }
+            }
+            return true;
+        };
         VertexMergeBatcher.canBatchSpriteMask = function canBatchSpriteMask(preElement, curElement) {
             if (preElement.subChunk.chunk !== curElement.subChunk.chunk) {
                 return false;
@@ -16130,13 +16152,18 @@
         _inherits$2(TextRenderer, Renderer);
         function TextRenderer(entity) {
             var _this;
-            _this = Renderer.call(this, entity) || this, _this._textChunks = Array(), /** @internal */ _this._subFont = null, /** @internal */ _this._dirtyFlag = 15, _this._color = new Color(1, 1, 1, 1), _this._text = "", _this._width = 0, _this._height = 0, _this._localBounds = new BoundingBox(), _this._font = null, _this._fontSize = 24, _this._fontStyle = FontStyle.None, _this._lineSpacing = 0, _this._characterSpacing = 0, _this._horizontalAlignment = TextHorizontalAlignment.Center, _this._verticalAlignment = TextVerticalAlignment.Center, _this._enableWrapping = false, _this._overflowMode = OverflowMode.Overflow;
+            _this = Renderer.call(this, entity) || this, _this._textChunks = Array(), /** @internal */ _this._subFont = null, /** @internal */ _this._dirtyFlag = 15, _this._color = new Color(1, 1, 1, 1), _this._text = "", _this._width = 0, _this._height = 0, _this._localBounds = new BoundingBox(), _this._font = null, _this._fontSize = 24, _this._fontStyle = FontStyle.None, _this._lineSpacing = 0, _this._characterSpacing = 0, _this._horizontalAlignment = TextHorizontalAlignment.Center, _this._verticalAlignment = TextVerticalAlignment.Center, _this._enableWrapping = false, _this._overflowMode = OverflowMode.Overflow, _this._outlineColor = new Color(0, 0, 0, 1), _this._outlineWidth = 0;
             var engine = _this.engine;
             _this._font = engine._textDefaultFont;
             _this._addResourceReferCount(_this._font, 1);
             _this.setMaterial(engine._basicResources.textDefaultMaterial);
+            var shaderData = _this.shaderData;
+            shaderData.setFloat(TextRenderer._outlineWidthProperty, _this._outlineWidth);
+            shaderData.setColor(TextRenderer._outlineColorProperty, _this._outlineColor);
             //@ts-ignore
             _this._color._onValueChanged = _this._onColorChanged.bind(_this);
+            // @ts-ignore
+            _this._outlineColor._onValueChanged = _this._onOutlineColorChanged.bind(_this);
             return _this;
         }
         var _proto = TextRenderer.prototype;
@@ -16158,6 +16185,7 @@
             Renderer.prototype._cloneTo.call(this, target);
             target.font = this._font;
             target._subFont = this._subFont;
+            target.outlineWidth = this._outlineWidth;
         };
         /**
        * @internal
@@ -16191,7 +16219,7 @@
         /**
        * @internal
        */ _proto._canBatch = function _canBatch(preElement, curElement) {
-            return VertexMergeBatcher.canBatchSprite(preElement, curElement);
+            return VertexMergeBatcher.canBatchText(preElement, curElement);
         };
         /**
        * @internal
@@ -16234,6 +16262,7 @@
             var distanceForSort = this._distanceForSort;
             var renderPipeline = camera._renderPipeline;
             var textChunks = this._textChunks;
+            var textTextureSize = TextRenderer._tempVec20;
             for(var i = 0, n = textChunks.length; i < n; ++i){
                 var _renderElement;
                 var _textChunks_i = textChunks[i], subChunk = _textChunks_i.subChunk, texture = _textChunks_i.texture;
@@ -16241,6 +16270,7 @@
                 renderElement.set(this, material, subChunk.chunk.primitive, subChunk.subMesh, texture, subChunk);
                 (_renderElement = renderElement).shaderData || (_renderElement.shaderData = new ShaderData(ShaderDataGroup.RenderElement));
                 renderElement.shaderData.setTexture(TextRenderer._textureProperty, texture);
+                renderElement.shaderData.setVector2(TextRenderer._textTextureSizeProperty, textTextureSize.set(texture.width, texture.height));
                 renderElement.priority = priority;
                 renderElement.distanceForSort = distanceForSort;
                 renderPipeline.pushRenderElement(context, renderElement);
@@ -16372,10 +16402,11 @@
                                 charRenderInfo.texture = charFont._getTextureByIndex(charInfo.index);
                                 charRenderInfo.uvs = charInfo.uvs;
                                 var w = charInfo.w, ascent = charInfo.ascent, descent = charInfo.descent;
-                                var left = startX * pixelsPerUnitReciprocal;
-                                var right = (startX + w) * pixelsPerUnitReciprocal;
-                                var top = (startY + ascent) * pixelsPerUnitReciprocal;
-                                var bottom = (startY - descent) * pixelsPerUnitReciprocal;
+                                var ow = this._outlineWidth * pixelsPerUnitReciprocal;
+                                var left = startX * pixelsPerUnitReciprocal - ow;
+                                var right = (startX + w) * pixelsPerUnitReciprocal + ow;
+                                var top = (startY + ascent) * pixelsPerUnitReciprocal + ow;
+                                var bottom = (startY - descent) * pixelsPerUnitReciprocal - ow;
                                 localPositions.set(left, top, right, bottom);
                                 i === firstLine && (maxY = Math.max(maxY, top));
                                 minY = Math.min(minY, bottom);
@@ -16449,6 +16480,10 @@
             var vertices = subChunk.chunk.vertices;
             var indices = subChunk.indices = [];
             var charRenderInfos = textChunk.charRenderInfos;
+            var ow = this._outlineWidth;
+            var texture = textChunk.texture;
+            var owU = ow > 0 ? ow / texture.width : 0;
+            var owV = ow > 0 ? ow / texture.height : 0;
             for(var i = 0, ii = 0, io = 0, vo = subChunk.vertexArea.start + 3; i < count; ++i, io += 4){
                 var charRenderInfo = charRenderInfos[i];
                 charRenderInfo.indexInChunk = i;
@@ -16456,10 +16491,13 @@
                 for(var j = 0; j < tempIndicesLength; ++j){
                     indices[ii++] = tempIndices[j] + io;
                 }
-                // Set uv and color for vertices
+                // Set uv and color for vertices, expand uv outward by outline width
                 for(var j1 = 0; j1 < 4; ++j1, vo += 9){
                     var uv = charRenderInfo.uvs[j1];
-                    uv.copyToArray(vertices, vo);
+                    var su = j1 === 1 || j1 === 2 ? 1 : -1;
+                    var sv = j1 >= 2 ? 1 : -1;
+                    vertices[vo] = uv.x + owU * su;
+                    vertices[vo + 1] = uv.y + owV * sv;
                     vertices[vo + 2] = r;
                     vertices[vo + 3] = g;
                     vertices[vo + 4] = b;
@@ -16488,6 +16526,9 @@
         _proto._onColorChanged = function _onColorChanged() {
             this._setDirtyFlagTrue(16);
         };
+        _proto._onOutlineColorChanged = function _onOutlineColorChanged() {
+            this.shaderData.setColor(TextRenderer._outlineColorProperty, this._outlineColor);
+        };
         _create_class$2(TextRenderer, [
             {
                 key: "color",
@@ -16674,6 +16715,35 @@
                     }
                 }
             },
+            {
+                key: "outlineWidth",
+                get: /**
+       * The outline width in pixels. 0 means outline is disabled. Clamped to [0, 8].
+       */ function get() {
+                    return this._outlineWidth;
+                },
+                set: function set(value) {
+                    value = Math.max(0, Math.min(value, 3));
+                    if (this._outlineWidth !== value) {
+                        this._outlineWidth = value;
+                        this.shaderData.setFloat(TextRenderer._outlineWidthProperty, value);
+                        this._setDirtyFlagTrue(14);
+                    }
+                }
+            },
+            {
+                key: "outlineColor",
+                get: /**
+       * The outline color. Only effective when outlineWidth > 0.
+       */ function get() {
+                    return this._outlineColor;
+                },
+                set: function set(value) {
+                    if (this._outlineColor !== value) {
+                        this._outlineColor.copyFrom(value);
+                    }
+                }
+            },
             {
                 key: "maskInteraction",
                 get: /**
@@ -16724,9 +16794,13 @@
         ]);
         return TextRenderer;
     }(exports.Renderer);
-    TextRenderer._textureProperty = ShaderProperty.getByName("renderElement_TextTexture");
+    TextRenderer._tempVec20 = new Vector2();
     TextRenderer._tempVec30 = new Vector3();
     TextRenderer._tempVec31 = new Vector3();
+    TextRenderer._textureProperty = ShaderProperty.getByName("renderElement_TextTexture");
+    TextRenderer._textTextureSizeProperty = ShaderProperty.getByName("renderElement_TextTextureSize");
+    TextRenderer._outlineColorProperty = ShaderProperty.getByName("renderer_OutlineColor");
+    TextRenderer._outlineWidthProperty = ShaderProperty.getByName("renderer_OutlineWidth");
     TextRenderer._worldPositions = [
         new Vector3(),
         new Vector3(),
@@ -16785,12 +16859,21 @@
     __decorate$1([
         assignmentClone
     ], TextRenderer.prototype, "_overflowMode", void 0);
+    __decorate$1([
+        deepClone
+    ], TextRenderer.prototype, "_outlineColor", void 0);
+    __decorate$1([
+        ignoreClone
+    ], TextRenderer.prototype, "_outlineWidth", void 0);
     __decorate$1([
         ignoreClone
     ], TextRenderer.prototype, "_onTransformChanged", null);
     __decorate$1([
         ignoreClone
     ], TextRenderer.prototype, "_onColorChanged", null);
+    __decorate$1([
+        ignoreClone
+    ], TextRenderer.prototype, "_onOutlineColorChanged", null);
     var TextChunk = function TextChunk() {
         this.charRenderInfos = new Array();
     };
@@ -29626,7 +29709,7 @@
     var spriteMaskVs = "uniform mat4 camera_VPMat;\n\nattribute vec3 POSITION;\nattribute vec2 TEXCOORD_0;\n\nvarying vec2 v_uv;\n\nvoid main()\n{\n  gl_Position = camera_VPMat * vec4(POSITION, 1.0);\n  v_uv = TEXCOORD_0;\n}\n"; // eslint-disable-line
     var spriteFs = "#include <common>\nuniform sampler2D renderer_SpriteTexture;\n\nvarying vec2 v_uv;\nvarying vec4 v_color;\n\nvoid main()\n{\n  vec4 baseColor = texture2DSRGB(renderer_SpriteTexture, v_uv);\n  gl_FragColor = baseColor * v_color;\n}\n"; // eslint-disable-line
     var spriteVs = "uniform mat4 renderer_MVPMat;\n\nattribute vec3 POSITION;\nattribute vec2 TEXCOORD_0;\nattribute vec4 COLOR_0;\n\nvarying vec2 v_uv;\nvarying vec4 v_color;\n\nvoid main()\n{\n  gl_Position = renderer_MVPMat * vec4(POSITION, 1.0);\n\n  v_uv = TEXCOORD_0;\n  v_color = COLOR_0;\n}\n"; // eslint-disable-line
-    var textFs = "uniform sampler2D renderElement_TextTexture;\nuniform vec4 renderer_UIRectClipRect;\nuniform float renderer_UIRectClipEnabled;\nuniform vec4 renderer_UIRectClipSoftness;\nuniform float renderer_UIRectClipHardClip;\n\nvarying vec2 v_uv;\nvarying vec4 v_color;\nvarying vec2 v_worldPosition;\n\nfloat getUIRectClipAlpha()\n{\n  vec4 edgeDistance = vec4(\n    v_worldPosition.x - renderer_UIRectClipRect.x,\n    v_worldPosition.y - renderer_UIRectClipRect.y,\n    renderer_UIRectClipRect.z - v_worldPosition.x,\n    renderer_UIRectClipRect.w - v_worldPosition.y\n  );\n  vec4 hardClipFactor = step(vec4(0.0), edgeDistance);\n  vec4 softness = max(renderer_UIRectClipSoftness, vec4(1e-5));\n  vec4 softClipFactor = clamp(edgeDistance / softness, 0.0, 1.0);\n  vec4 useSoftness = step(vec4(1e-5), renderer_UIRectClipSoftness);\n  vec4 clipFactor = mix(hardClipFactor, softClipFactor, useSoftness);\n  return clipFactor.x * clipFactor.y * clipFactor.z * clipFactor.w;\n}\n\nvoid main()\n{\n  float rectClipAlpha = 1.0;\n  if (renderer_UIRectClipEnabled > 0.5) {\n    rectClipAlpha = getUIRectClipAlpha();\n  }\n\n  vec4 texColor = texture2D(renderElement_TextTexture, v_uv);\n  #ifdef GRAPHICS_API_WEBGL2\n    float coverage = texColor.r;\n  #else\n    float coverage = texColor.a;\n  #endif\n  vec4 finalColor = vec4(v_color.rgb, v_color.a * coverage);\n  finalColor.a *= rectClipAlpha;\n  if (renderer_UIRectClipEnabled > 0.5 && renderer_UIRectClipHardClip > 0.5 && finalColor.a < 0.001) {\n    discard;\n  }\n  gl_FragColor = finalColor;\n}\n"; // eslint-disable-line
+    var textFs = "uniform sampler2D renderElement_TextTexture;\nuniform vec2 renderElement_TextTextureSize;\nuniform vec4 renderer_OutlineColor;\nuniform float renderer_OutlineWidth;\n\nuniform vec4 renderer_UIRectClipRect;\nuniform float renderer_UIRectClipEnabled;\nuniform vec4 renderer_UIRectClipSoftness;\nuniform float renderer_UIRectClipHardClip;\n\nvarying vec2 v_uv;\nvarying vec4 v_color;\nvarying vec2 v_worldPosition;\n\nfloat getUIRectClipAlpha()\n{\n  vec4 edgeDistance = vec4(\n    v_worldPosition.x - renderer_UIRectClipRect.x,\n    v_worldPosition.y - renderer_UIRectClipRect.y,\n    renderer_UIRectClipRect.z - v_worldPosition.x,\n    renderer_UIRectClipRect.w - v_worldPosition.y\n  );\n  vec4 hardClipFactor = step(vec4(0.0), edgeDistance);\n  vec4 softness = max(renderer_UIRectClipSoftness, vec4(1e-5));\n  vec4 softClipFactor = clamp(edgeDistance / softness, 0.0, 1.0);\n  vec4 useSoftness = step(vec4(1e-5), renderer_UIRectClipSoftness);\n  vec4 clipFactor = mix(hardClipFactor, softClipFactor, useSoftness);\n  return clipFactor.x * clipFactor.y * clipFactor.z * clipFactor.w;\n}\n\nfloat sampleCoverage(vec2 uv)\n{\n  vec4 c = texture2D(renderElement_TextTexture, uv);\n  #ifdef GRAPHICS_API_WEBGL2\n    return c.r;\n  #else\n    return c.a;\n  #endif\n}\n\nvoid main()\n{\n  float rectClipAlpha = 1.0;\n  if (renderer_UIRectClipEnabled > 0.5) {\n    rectClipAlpha = getUIRectClipAlpha();\n  }\n\n  float coverage = sampleCoverage(v_uv);\n  vec4 finalColor;\n\n  if (renderer_OutlineWidth > 0.0) {\n    vec2 texelSize = 1.0 / renderElement_TextTextureSize;\n    vec2 step = texelSize * renderer_OutlineWidth;\n    float outlineCoverage = coverage;\n    outlineCoverage = max(outlineCoverage, sampleCoverage(v_uv + vec2( step.x,  0.0)));\n    outlineCoverage = max(outlineCoverage, sampleCoverage(v_uv + vec2(-step.x,  0.0)));\n    outlineCoverage = max(outlineCoverage, sampleCoverage(v_uv + vec2( 0.0,  step.y)));\n    outlineCoverage = max(outlineCoverage, sampleCoverage(v_uv + vec2( 0.0, -step.y)));\n    outlineCoverage = max(outlineCoverage, sampleCoverage(v_uv + vec2( step.x * 0.7071,  step.y * 0.7071)));\n    outlineCoverage = max(outlineCoverage, sampleCoverage(v_uv + vec2(-step.x * 0.7071,  step.y * 0.7071)));\n    outlineCoverage = max(outlineCoverage, sampleCoverage(v_uv + vec2( step.x * 0.7071, -step.y * 0.7071)));\n    outlineCoverage = max(outlineCoverage, sampleCoverage(v_uv + vec2(-step.x * 0.7071, -step.y * 0.7071)));\n\n    vec3 rgb = mix(renderer_OutlineColor.rgb, v_color.rgb, coverage);\n    float alpha = max(coverage * v_color.a, outlineCoverage * renderer_OutlineColor.a);\n    finalColor = vec4(rgb, alpha);\n  } else {\n    finalColor = vec4(v_color.rgb, v_color.a * coverage);\n  }\n\n  finalColor.a *= rectClipAlpha;\n  if (renderer_UIRectClipEnabled > 0.5 && renderer_UIRectClipHardClip > 0.5 && finalColor.a < 0.001) {\n    discard;\n  }\n  gl_FragColor = finalColor;\n}\n"; // eslint-disable-line
     var textVs = "uniform mat4 renderer_MVPMat;\nuniform mat4 renderer_ModelMat;\n\nattribute vec3 POSITION;\nattribute vec2 TEXCOORD_0;\nattribute vec4 COLOR_0;\n\nvarying vec2 v_uv;\nvarying vec4 v_color;\nvarying vec2 v_worldPosition;\n\nvoid main()\n{\n  gl_Position = renderer_MVPMat * vec4(POSITION, 1.0);\n\n  v_uv = TEXCOORD_0;\n  v_color = COLOR_0;\n  v_worldPosition = POSITION.xy;\n}\n"; // eslint-disable-line
     var trailFs = "#include <common>\n\nvarying vec2 v_uv;\nvarying vec4 v_color;\n\nuniform vec4 material_BaseColor;\n\n#ifdef MATERIAL_HAS_BASETEXTURE\n    uniform sampler2D material_BaseTexture;\n#endif\n\nuniform mediump vec3 material_EmissiveColor;\n#ifdef MATERIAL_HAS_EMISSIVETEXTURE\n    uniform sampler2D material_EmissiveTexture;\n#endif\n\nvoid main() {\n    vec4 color = material_BaseColor * v_color;\n\n    #ifdef MATERIAL_HAS_BASETEXTURE\n        color *= texture2DSRGB(material_BaseTexture, v_uv);\n    #endif\n\n    // Emissive\n    vec3 emissiveRadiance = material_EmissiveColor;\n    #ifdef MATERIAL_HAS_EMISSIVETEXTURE\n        emissiveRadiance *= texture2DSRGB(material_EmissiveTexture, v_uv).rgb;\n    #endif\n\n    color.rgb += emissiveRadiance;\n\n    gl_FragColor = color;\n}\n\n"; // eslint-disable-line
     var trailVs = "attribute vec4 a_PositionBirthTime; // xyz: World position, w: Birth time (used by CPU only)\nattribute vec4 a_CornerTangent;     // x: Corner (-1 or 1), yzw: Tangent direction\nattribute float a_Distance;         // Absolute cumulative distance (written once per point)\n\nuniform vec4 renderer_TrailParams;    // x: TextureMode (0: Stretch, 1: Tile), y: TextureScaleX, z: TextureScaleY\nuniform vec2 renderer_DistanceParams;   // x: HeadDistance, y: TailDistance\nuniform vec3 camera_Position;\nuniform mat4 camera_ViewMat;\nuniform mat4 camera_ProjMat;\nuniform vec2 renderer_WidthCurve[4];   // Width curve (4 keyframes max: x=time, y=value)\nuniform vec4 renderer_ColorKeys[4];   // Color gradient (x=time, yzw=rgb)\nuniform vec2 renderer_AlphaKeys[4];   // Alpha gradient (x=time, y=alpha)\nuniform vec4 renderer_CurveMaxTime; // x: colorMaxTime, y: alphaMaxTime, z: widthMaxTime\n\nvarying vec2 v_uv;\nvarying vec4 v_color;\n\n#include <particle_common>\n\nvoid main() {\n    vec3 position = a_PositionBirthTime.xyz;\n    float corner = a_CornerTangent.x;\n    vec3 tangent = a_CornerTangent.yzw;\n\n    // Distance-based relative position: 0=head(newest), 1=tail(oldest)\n    float distFromHead = renderer_DistanceParams.x - a_Distance;\n    float totalDist = renderer_DistanceParams.x - renderer_DistanceParams.y;\n    float relativePos = totalDist > 0.0 ? distFromHead / totalDist : 0.0;\n\n    // Billboard: expand perpendicular to tangent and view direction\n    vec3 toCamera = normalize(camera_Position - position);\n    vec3 right = cross(tangent, toCamera);\n    float rightLenSq = dot(right, right);\n    if (rightLenSq < 0.000001) {\n        right = cross(tangent, vec3(0.0, 1.0, 0.0));\n        rightLenSq = dot(right, right);\n        if (rightLenSq < 0.000001) {\n            right = cross(tangent, vec3(1.0, 0.0, 0.0));\n            rightLenSq = dot(right, right);\n        }\n    }\n    right = right * inversesqrt(rightLenSq);\n\n    float width = evaluateParticleCurve(renderer_WidthCurve, min(relativePos, renderer_CurveMaxTime.z));\n    vec3 worldPosition = position + right * width * 0.5 * corner;\n\n    gl_Position = camera_ProjMat * camera_ViewMat * vec4(worldPosition, 1.0);\n\n    // u = position along trail (affected by textureMode), v = corner side.\n    float u = renderer_TrailParams.x == 0.0 ? relativePos : distFromHead;\n    float v = corner * 0.5 + 0.5;\n    v_uv = vec2(u * renderer_TrailParams.y, v * renderer_TrailParams.z);\n\n    v_color = evaluateParticleGradient(renderer_ColorKeys, renderer_CurveMaxTime.x, renderer_AlphaKeys, renderer_CurveMaxTime.y, relativePos);\n}\n"; // eslint-disable-line
@@ -56079,7 +56162,7 @@
     ], EXT_texture_webp);
 
     //@ts-ignore
-    var version = "0.0.0-experimental-2.0-game.8";
+    var version = "0.0.0-experimental-2.0-game.9";
     console.log("Galacean Engine Version: " + version);
     for(var key in CoreObjects){
         Loader.registerClass(key, CoreObjects[key]);