Image Element mask fix (#7341)

* Fixed unmask mesh instance handling and cleanup when toggling * Added proper cleanup of mesh instance
playcanvas · Feb 11, 2025 · a2c8a2d · a2c8a2d
1 parent 63a45fa
commit a2c8a2d
Showing 1 changed file with 14 additions and 4 deletions.
diff --git a/src/framework/components/element/image-element.js b/src/framework/components/element/image-element.js
@@ -66,7 +66,10 @@ class ImageRenderable {
         this.model = null;
         this.node = null;
         this.mesh = null;
+        this.meshInstance?.destroy();
         this.meshInstance = null;
+        this.unmaskMeshInstance?.destroy();
+        this.unmaskMeshInstance = null;
         this._entity = null;
         this._element = null;
     }
@@ -88,6 +91,11 @@ class ImageRenderable {
     setMask(mask) {
         if (!this.meshInstance) return;
 
+        // remove model to remove mesh instance from layers
+        if (this._entity.enabled && this._element.enabled) {
+            this._element.removeModelFromLayers(this.model);
+        }
+
         if (mask) {
             this.unmaskMeshInstance = new MeshInstance(this.mesh, this.meshInstance.material, this.node);
             this.unmaskMeshInstance.name = `Unmask: ${this._entity.name}`;
@@ -107,15 +115,17 @@ class ImageRenderable {
             if (idx >= 0) {
                 this.model.meshInstances.splice(idx, 1);
             }
-
-            this.unmaskMeshInstance = null;
         }
 
-        // remove model then re-add to update to current mesh instances
+        // re-add to update to current mesh instances
         if (this._entity.enabled && this._element.enabled) {
-            this._element.removeModelFromLayers(this.model);
             this._element.addModelToLayers(this.model);
         }
+
+        if (!mask) {
+            this.unmaskMeshInstance?.destroy();
+            this.unmaskMeshInstance = null;
+        }
     }
 
     setMaterial(material) {