Animating GUI element property (scaleX, scaleY)

Hi.

I am creating GUI menu for selecting different materials for the mesh. So when you click on sphere you get the menu to chose material that you want. I want to be some kind of cool effect on that showing process. You can see in the example bellow that I am using the scaleX and scaleY properties of the rect1 element. My goal is to animate that effect, so looks like it is gradually scaling up to full size.

My question is how can I animate those properties, or is there some other way of doing this.

https://www.babylonjs-playground.com/#XCPP9Y#1087

In the example bellow I animated alpha property of the rect1, but I cannot find a way to animate those scaleX and scaleY properties.

https://www.babylonjs-playground.com/#XCPP9Y#1088

I figured it out. I used scene.onBeforeRender to achieve this. It was kinda obvious solution.

https://www.babylonjs-playground.com/#XCPP9Y#1089

2 Likes