Merge pull request #5607 from TrevorDev/boundingBoxDragNoParent

no parent boundingBoxGizmo dragging

dist/preview release/what's new.md

@@ -80,6 +80,7 @@
 - Factored out `setDirection` function from `lookAt` for transform node ([bghgary](https://github.com/bghgary))
 - Add support for setting renderingGroupId and creating instances to `AxesViewer` ([bghgary](https://github.com/bghgary))
 - Invert vScale of compressed ktx textures as they are inverted in the file and UNPACK_FLIP_Y_WEBGL is not supported by ktx ([TrevorDev](https://github.com/TrevorDev))
+- Enable dragging in boundingBoxGizmo without needing a parent ([TrevorDev](https://github.com/TrevorDev))
 
 ### glTF Loader
 

inspector/src/components/sceneExplorer/entities/meshTreeItemComponent.tsx

@@ -1,4 +1,4 @@
-import { AbstractMesh, Mesh, IExplorerExtensibilityGroup } from "babylonjs";
+import { AbstractMesh, IExplorerExtensibilityGroup } from "babylonjs";
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { faCube } from '@fortawesome/free-solid-svg-icons';
 import { faEye, faEyeSlash } from '@fortawesome/free-regular-svg-icons';
@@ -44,36 +44,22 @@ export class MeshTreeItemComponent extends React.Component<IMeshTreeItemComponen
                 mesh.reservedDataStore.previousParent.reservedDataStore.detachedChildren.push(mesh);
             }
 
-            // Connect to gizmo
-            const dummy = BABYLON.BoundingBoxGizmo.MakeNotPickableAndWrapInBoundingBox(mesh as Mesh);
-            dummy.reservedDataStore = { hidden: true };
             const gizmo = new BABYLON.BoundingBoxGizmo(BABYLON.Color3.FromHexString("#0984e3"));
-            gizmo.attachedMesh = dummy;
+            gizmo.attachedMesh = mesh;
+            gizmo.enableDragBehavior();
 
             gizmo.updateBoundingBox();
 
             gizmo.fixedDragMeshScreenSize = true;
             mesh.reservedDataStore.gizmo = gizmo;
-
-            var pointerDragBehavior = new BABYLON.PointerDragBehavior();
-            pointerDragBehavior.useObjectOrienationForDragging = false;
-
-            dummy.addBehavior(pointerDragBehavior);
-
-            mesh.reservedDataStore.pointerDragBehavior = pointerDragBehavior;
-            mesh.reservedDataStore.dummy = dummy;
-
             this.setState({ isGizmoEnabled: true });
             return;
         }
 
         const previousParent = mesh.reservedDataStore.previousParent;
-        mesh.removeBehavior(mesh.reservedDataStore.pointerDragBehavior);
         mesh.reservedDataStore.gizmo.dispose();
         mesh.reservedDataStore.gizmo = null;
         mesh.setParent(previousParent);
-        mesh.reservedDataStore.dummy.dispose();
-        mesh.reservedDataStore.dummy = null;
 
         if (previousParent && previousParent.reservedDataStore) {
             previousParent.reservedDataStore.detachedChildren = null;

src/Gizmos/babylon.boundingBoxGizmo.ts

@@ -67,6 +67,10 @@ module BABYLON {
         private _anchorMesh: AbstractMesh;
         private _existingMeshScale = new Vector3();
 
+        // Dragging
+        private _dragMesh: Nullable<Mesh> = null;
+        private pointerDragBehavior = new BABYLON.PointerDragBehavior();
+
         // Stores the state of the pivot cache (_oldPivotPoint, _pivotTranslation)
         // store/remove pivot point should only be applied during their outermost calls
         private static _PivotCached = 0;
@@ -209,6 +213,7 @@ module BABYLON {
 
                         BoundingBoxGizmo._RestorePivotPoint(this.attachedMesh);
                     }
+                    this._updateDummy();
                 });
 
                 // Selection/deselection
@@ -219,6 +224,7 @@ module BABYLON {
                 _dragBehavior.onDragEndObservable.add(() => {
                     this.onRotationSphereDragEndObservable.notifyObservers({});
                     this._selectNode(null);
+                    this._updateDummy();
                 });
 
                 this._rotateSpheresParent.addChild(sphere);
@@ -271,6 +277,7 @@ module BABYLON {
 
                                 BoundingBoxGizmo._RestorePivotPoint(this.attachedMesh);
                             }
+                            this._updateDummy();
                         });
 
                         // Selection/deselection
@@ -281,6 +288,7 @@ module BABYLON {
                         _dragBehavior.onDragEndObservable.add(() => {
                             this.onScaleBoxDragEndObservable.notifyObservers({});
                             this._selectNode(null);
+                            this._updateDummy();
                         });
 
                         this._scaleBoxesParent.addChild(box);
@@ -316,6 +324,12 @@ module BABYLON {
                     this._updateRotationSpheres();
                     this._updateScaleBoxes();
                 }
+
+                // If dragg mesh is enabled and dragging, update the attached mesh pose to match the drag mesh
+                if (this._dragMesh && this.attachedMesh && this.pointerDragBehavior.dragging) {
+                    this._lineBoundingBox.position.rotateByQuaternionToRef(this._rootMesh.rotationQuaternion!, this._tmpVector);
+                    this.attachedMesh.setAbsolutePosition(this._dragMesh.position.add(this._tmpVector.scale(-1)));
+                }
             });
             this.updateBoundingBox();
         }
@@ -329,6 +343,10 @@ module BABYLON {
                 this._anchorMesh.removeChild(value);
                 BoundingBoxGizmo._RestorePivotPoint(value);
                 this.updateBoundingBox();
+
+                this.gizmoLayer.utilityLayerScene.onAfterRenderObservable.addOnce(() => {
+                    this._updateDummy();
+                });
             }
         }
 
@@ -458,6 +476,25 @@ module BABYLON {
             });
         }
 
+        private _updateDummy() {
+            if (this._dragMesh) {
+                this._dragMesh.position.copyFrom(this._lineBoundingBox.getAbsolutePosition());
+                this._dragMesh.scaling.copyFrom(this._lineBoundingBox.scaling);
+                this._dragMesh.rotationQuaternion!.copyFrom(this._rootMesh.rotationQuaternion!);
+            }
+        }
+
+        /**
+         * Enables a pointer drag behavior on the bounding box of the gizmo
+         */
+        public enableDragBehavior() {
+            this._dragMesh = BABYLON.Mesh.CreateBox("dummy", 1, this.gizmoLayer.utilityLayerScene);
+            this._dragMesh.visibility = 0;
+            this._dragMesh.rotationQuaternion = new BABYLON.Quaternion();
+            this.pointerDragBehavior.useObjectOrienationForDragging = false;
+            this._dragMesh.addBehavior(this.pointerDragBehavior);
+        }
+
         /**
          * Disposes of the gizmo
          */
@@ -467,6 +504,9 @@ module BABYLON {
             this._lineBoundingBox.dispose();
             this._rotateSpheresParent.dispose();
             this._scaleBoxesParent.dispose();
+            if (this._dragMesh) {
+                this._dragMesh.dispose();
+            }
             super.dispose();
         }