HolographicButton, Button3D .... sizes

Questions
1

Hi all.

I am new to Babylon. Till beginning this week I did develop my application in parallel, Babylon and Three.js to find out which fits better for me.
Seems I stick to Babylon.js becasue it is more easy. I am also new to JavaScript (1/2 year), did write C and Assemblr the last 30 years :slight_smile:

I am making a software to design buildings with pre-defined blocks. The 2D floorplan I draw with papers.js.
I am already drawing the walls, and can add doors with double click in Babylon.js
But the doubleclick is just for test, especially the link between papers.js and Babylon. All works well.

There should be more functions than adding a simple door to a wall element. Like adding winddows or adding terracedoor which is different from normal door…and so on.

I thought about a kind of menu/icons ON the walls, which appear when mous hover on elements where such funcins are possible.

I did find Babylon GUI Elements like Button3D, HolographicButton and seems some more. They would basically exactly do what I want.

But all of this buttons or icons have a HUGE margin/padding.

I did not find any way to remove this margins.

It is the same for icon buttons and for text buttons.

My applicatin needs Papers.js, and a mySql Database. Therefore would be hard to post my code on the playground.

2

If you mean with “margin” and “padding” the width and height of the button here is an other topic with a solution to this problem - a bit of hack is needed:

How to change size/shape of Holographic button? - Questions - Babylon.js (babylonjs.com)

3

Regarding Button3D, you can add support for custom width/height/depth like this:

1 Like
4

Thanks to both of you

Yesterday before my pos was released I had another idea:
Like this: I can put a plane with a texture to my objects and merge the meshes

based on this solutuon: https://playground.babylonjs.com/#HJZBRG#191

I made small changes like this: Babylon.js Playground

but the icon button moves out and out after each click, the original example does not do this.

Seems I am blind today and cannot see why.

anyway it shows the idea

I am not sure which solution is better. HolographicButton or adding a plane to the mesh.

thanks all for the super help.

5

The default pointerUpAnimation event handler of MeshButton3D is scaling the mesh up. So, you should override it to remove the scaling:

6

This PR will make it easier to define the dimensions of Button3D:

1 Like