@energy8platform/game-engine 0.15.0 → 0.15.2

package/dist/index.esm.js

@@ -2944,24 +2944,29 @@ function measureChild(child, parentContentW = 0, parentContentH = 0) {
     const cfg = child._flexConfig;
     const resolvedLW = resolveDimension(cfg?.layoutWidth, parentContentW);
     const resolvedLH = resolveDimension(cfg?.layoutHeight, parentContentH);
-    if (resolvedLW !== undefined && resolvedLH !== undefined) {
-        return { w: resolvedLW, h: resolvedLH, ox: 0, oy: 0 };
-    }
-    // For FlexContainers, use their explicit or computed size
+    // FlexContainer children are top-left origin by construction, so `ox/oy = 0`
+    // is correct and we can skip the `getLocalBounds()` call entirely.
     if (child instanceof FlexContainer) {
         const fc = child;
         const w = fc._explicitWidth > 0 ? fc._explicitWidth : (fc._computedWidth > 0 ? fc._computedWidth : undefined);
         const h = fc._explicitHeight > 0 ? fc._explicitHeight : (fc._computedHeight > 0 ? fc._computedHeight : undefined);
         if (w !== undefined && h !== undefined) {
-            return { w, h, ox: 0, oy: 0 };
+            return { w: resolvedLW ?? w, h: resolvedLH ?? h, ox: 0, oy: 0 };
         }
     }
-    // Use localBounds to get the true visual extent and origin offset.
-    // This handles children with non-zero anchors (e.g. Button, Label with centered text).
+    // Use localBounds to get the true visual origin offset.
+    // We take `ox/oy` from bounds unconditionally — a user-supplied `layoutWidth/Height`
+    // overrides the SIZE used by flex (protection against pre-paint bounds of 0), but
+    // it must NOT erase the center-anchor compensation: Button/Label views are drawn at
+    // `(-w/2..w/2)` and their bounds.x = -w/2 is what lets `layoutLine` place the
+    // visible rectangle where the layout intends.
     const bounds = child.getLocalBounds();
-    const w = resolvedLW ?? bounds.width;
-    const h = resolvedLH ?? bounds.height;
-    return { w, h, ox: bounds.x, oy: bounds.y };
+    return {
+        w: resolvedLW ?? bounds.width,
+        h: resolvedLH ?? bounds.height,
+        ox: bounds.x,
+        oy: bounds.y,
+    };
 }
 /**
  * Set a child's main or cross dimension.
@@ -3450,30 +3455,35 @@ class FlexContainer extends Container {
             this._computedHeight = this._explicitHeight > 0 ? this._explicitHeight : (pt + naturalMainSize + pb);
         }
         // Position flexExclude children (absolute positioning).
-        // All position props describe the visual (bounds) rectangle, so we subtract
-        // `ox/oy` to compensate for children with a centered origin (Button, Label).
+        // All position props describe the visual (bounds) rectangle. We derive the
+        // visual rectangle directly from `getLocalBounds()` rather than the
+        // layout-config `w`/`h` returned by measureChild — those may differ from
+        // actual bounds when the user pins `layoutWidth`/`layoutHeight` to a value
+        // that doesn't match the child's real visual extent (e.g. a Button whose
+        // text overflows its configured `width`). Mixing layout size with real
+        // bounds-origin would shift the visual center off the requested point.
         // `centerX/centerY` take precedence over `left/right` / `top/bottom` on each axis.
         for (const child of this._layoutChildren) {
             if (!child._flexConfig?.flexExclude)
                 continue;
             const cfg = child._flexConfig;
-            const { w, h, ox, oy } = measureChild(child, pctRefW, pctRefH);
+            const bounds = child.getLocalBounds();
             const cw = this._computedWidth;
             const ch = this._computedHeight;
             const centerX = resolveDimension(cfg.centerX, pctRefW);
             if (centerX !== undefined)
-                child.x = centerX - w / 2 - ox;
+                child.x = centerX - bounds.x - bounds.width / 2;
             else if (cfg.left !== undefined)
-                child.x = cfg.left - ox;
+                child.x = cfg.left - bounds.x;
             else if (cfg.right !== undefined)
-                child.x = cw - w - cfg.right - ox;
+                child.x = cw - cfg.right - bounds.x - bounds.width;
             const centerY = resolveDimension(cfg.centerY, pctRefH);
             if (centerY !== undefined)
-                child.y = centerY - h / 2 - oy;
+                child.y = centerY - bounds.y - bounds.height / 2;
             else if (cfg.top !== undefined)
-                child.y = cfg.top - oy;
+                child.y = cfg.top - bounds.y;
             else if (cfg.bottom !== undefined)
-                child.y = ch - h - cfg.bottom - oy;
+                child.y = ch - cfg.bottom - bounds.y - bounds.height;
         }
     }
     /** Computed content size (after layout) */