Unlink mesh from control, does not align in GUI

Hello

I have a GUI image control that should normally be drawn in the centre of the screen.

When it needs to track a mesh, I link it using myImage.linkWithMesh(myMesh)

The problem is when I want to “unlink” it again and have it return to the centre of the screen. I (think) you unlink it using myImage.linkWithMesh(null) (a dedicated unlinkMesh() function might be clearer?).

This causes the image control to remain at the last position, not go back to its original centre alignment. That’s fine (if not quite what you might expect after unlinking) - the main issue is setting the control’s horizontal and vertical alignment again does not correctly position it (if it has been moved from its original position while being linked).

Here’s a playground example:
https://www.babylonjs-playground.com/indexStable.html#VKBJN#257

Press “toggle link”, move the camera a little, press “toggle link” again. The image is not centred.

As an aside, using the inspector I also see the frame total time goes from 0 to about 4 ms just by activating linkWithMesh (setting to a non-null). I’d have only expected increased CPU time when the camera or mesh was actually moving (so tracking needs updating), but even setting the mesh’s `freezeWorldMatrix’ true and making no camera movement does not seem to reduce this. I assume the tracking calculation is run every frame regardless?

Hey!

Because the link will change top and left, I encourage you to restore them to 0:
https://www.babylonjs-playground.com/indexStable.html#VKBJN#258

And you are correct regarding the tracking calculation: this is done per frame to ensure a perfect sync

1 Like