fix(GUI): UITransform will be updated correctly (#288)

UITransform will be updated correctly
Orillusion · Sep 1, 2023 · 7a30945 · 7a30945
1 parent 1321153
commit 7a30945
Show file tree

Hide file tree

Showing 3 changed files with 50 additions and 32 deletions.
diff --git a/src/components/Transform.ts b/src/components/Transform.ts
@@ -286,9 +286,19 @@ export class Transform extends ComponentBase {
     }
 
     public set localRotQuat(value: Quaternion) {
-        this._localRotQuat = value;
-        this._localRotQuat.getEulerAngles(this._localRot);
-        this.localRotation = this._localRot;
+        if (value.x != this._localRotQuat.x
+            || value.y != this._localRotQuat.y
+            || value.z != this._localRotQuat.z
+            || value.w != this._localRotQuat.w) {
+            this._localRotQuat.copyFrom(value);
+            this._localRotQuat.getEulerAngles(this._localRot);
+            this.notifyLocalChange();
+            this.onRotationChange?.();
+
+            if (this.eventRotationChange) {
+                this.eventDispatcher.dispatchEvent(this.eventRotationChange);
+            }
+        }
     }
 
     /**
@@ -390,7 +400,6 @@ export class Transform extends ComponentBase {
 
         transform.localScale.copyFrom(prs[2]);
         transform.localScale = transform.localScale;
-        // this.updateWorldMatrix();
         return this;
     }
 
@@ -586,14 +595,14 @@ export class Transform extends ComponentBase {
     }
 
     public set localPosition(v: Vector3) {
-        this._localPos.x = v.x;
-        this._localPos.y = v.y;
-        this._localPos.z = v.z;
-        this.notifyLocalChange();
-        this.onPositionChange?.();
+        if (this._localPos.x != v.x || this._localPos.y != v.y || this._localPos.z != v.z) {
+            this._localPos.copyFrom(v);
+            this.notifyLocalChange();
+            this.onPositionChange?.();
 
-        if (this.eventPositionChange) {
-            this.eventDispatcher.dispatchEvent(this.eventPositionChange);
+            if (this.eventPositionChange) {
+                this.eventDispatcher.dispatchEvent(this.eventPositionChange);
+            }
         }
     }
     /**
@@ -605,14 +614,14 @@ export class Transform extends ComponentBase {
     }
 
     public set localRotation(v: Vector3) {
-        this.rotationX = v.x;
-        this.rotationY = v.y;
-        this.rotationZ = v.z;
-        this.notifyLocalChange();
-        this.onRotationChange?.();
+        if (this._localRot.x != v.x || this._localRot.y != v.y || this._localRot.z != v.z) {
+            this._localRot.copyFrom(v);
+            this.notifyLocalChange();
+            this.onRotationChange?.();
 
-        if (this.eventRotationChange) {
-            this.eventDispatcher.dispatchEvent(this.eventRotationChange);
+            if (this.eventRotationChange) {
+                this.eventDispatcher.dispatchEvent(this.eventRotationChange);
+            }
         }
     }
 
@@ -625,15 +634,16 @@ export class Transform extends ComponentBase {
     }
 
     public set localScale(v: Vector3) {
-        this.scaleX = v.x;
-        this.scaleY = v.y;
-        this.scaleZ = v.z;
-        this.notifyLocalChange();
-        this.onScaleChange?.();
+        if (this._localScale.x != v.x || this._localScale.y != v.y || this._localScale.z != v.z) {
+            this._localScale.copyFrom(v);
+            this.notifyLocalChange();
+            this.onScaleChange?.();
 
-        if (this.eventScaleChange) {
-            this.eventDispatcher.dispatchEvent(this.eventScaleChange);
+            if (this.eventScaleChange) {
+                this.eventDispatcher.dispatchEvent(this.eventScaleChange);
+            }
         }
+
     }
     /**
      *

diff --git a/src/components/gui/uiComponents/UITransform.ts b/src/components/gui/uiComponents/UITransform.ts
@@ -36,9 +36,14 @@ export class UITransform extends ComponentBase {
 
     public init(param?: any): void {
         super.init(param);
+        this.transform.eventDispatcher.addEventListener(this.transform.eventLocalChange.type, this.onTransformChange, this);
         this.onParentChange(null, this.object3D.parent?.object3D);
     }
 
+    private onTransformChange(e) {
+        this.onChange = true;
+    }
+
     public addUIInteractive(item: IUIInteractive): this {
         this._uiInteractiveList ||= [];
         this._uiInteractiveList.push(item);
@@ -208,7 +213,7 @@ export class UITransform extends ComponentBase {
                 //notice: The component list contains corresponding components that belong to the current Object 3D
                 let components = this.object3D.getComponents(UITransform, this._tempTransforms, true);
                 for (let component of components) {
-                    component['_onChange'] = true;
+                    component._onChange = true;
                     component.needUpdateQuads = true;
                 }
             }
@@ -257,12 +262,12 @@ export class UITransform extends ComponentBase {
         let rot = this.object3D.rotationZ;
         if (this.parent) {
             mtx.updateScaleAndRotation(this.object3D.scaleX, this.object3D.scaleY, rot, rot);
+            mtx.tx = this.object3D.x;
+            mtx.ty = this.object3D.y;
         } else {
             //it's ui panel root
-            mtx.updateScaleAndRotation(1, 1, rot, rot);
+            mtx.updateScaleAndRotation(1, 1, 0, 0);
         }
-        mtx.tx = this.object3D.x;
-        mtx.ty = this.object3D.y;
 
         //if (this.pivotX != 0 || this.pivotY!= 0 )
         //    m.$preMultiplyInto(help_mat3_0.setTo(1, 0, 0, 1, -this.pivotX / 1.5, -this.pivotY / 1.5), m);
@@ -291,4 +296,9 @@ export class UITransform extends ComponentBase {
         self._onChange = false;
         return worldMtx;
     }
+
+    public beforeDestroy(force?: boolean): void {
+        this.transform.eventDispatcher.addEventListener(this.transform.eventLocalChange.type, this.onTransformChange, this);
+        super.beforeDestroy?.(force);
+    }
 }
diff --git a/src/core/entities/Entity.ts b/src/core/entities/Entity.ts
@@ -149,9 +149,7 @@ export class Entity extends CEventDispatcher {
 
         let index = this.entityChildren.indexOf(child);
         if (index == -1) {
-            if (child.transform.parent) {
-                child.transform.parent.object3D.removeChild(child);
-            }
+            child.removeFromParent();
             child.transform.parent = this.transform;
             this.entityChildren.push(child);
             this._numChildren = this.entityChildren.length;