How to add buttons with padding in world view?

Questions
1

Hey hi,

so I have to create UI buttons on top of my meshes.

https://www.babylonjs-playground.com/#ZI9AK7#730

I have created two buttons though but I want to add more with equal distance.

now should I create more planes for each of my button but then how to add them in BABYLON.GUI.AdvancedDynamicTexture.CreateForMesh as it accepts one mesh? or can we have muktiple dynamic textures in the scene?

What should be the best approach?

For now I am able to add three buttons max using

BABYLON.GUI.Control.HORIZONTAL_ALIGNMENT_RIGHT;
BABYLON.GUI.Control.HORIZONTAL_ALIGNMENT_CENTER;
BABYLON.GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;

But I can’t add more and the distance is too much between them.

Please suggest

I did some more playaround - https://www.babylonjs-playground.com/#ZI9AK7#745

is this the correct way - disclaimer - I want such UI to be the child of different meshes in my scene

regards,
Nipun David

2

Okay,

I did a lot of experimenting and came up with this - Babylon.js Playground

but the buttons are stacking up on top of each other (I know it is stackPanel) but how to get similar alignment horizontally?

one more test - Babylon.js Playground

regards,
Nipun David

3

Just set panel2.isVertical = false; on your stack panel to stack elements horizontally.

You can indeed create several dynamic textures by calling GUI.AdvancedDynamicTexture.CreateForMesh several times and assign each texture to a different mesh.

1 Like
4

Thanks, it worked