GUI Animation: createAndStartAnimation + hex string values

Questions
1

Hi everyone,

I have been experimenting a bit with CreateAndStartAnimation, which is awesome. Thanks
to @Wingnut and his beautiful answer here I also learned how to use it with GUIs - now I am just wondering if it can be made to work with properties that have a hex string as value, such as color or background.

Any way to animate the background of a GUI control, with CASA or not?

Thanks in advance!

1 Like
2

This is not supported as the values are not float, matrices, vectors, colors or quaternions so Babylon does not know how to interpolate them.

You could nevertheless add a color property on your side and animate this one to recompute the hex value ?

2 Likes
3

Tried to throw together a very quick demo of what could this look like (press the button to animate the bottom panel’s color):
hedra example | Babylon.js Playground (babylonjs.com)

I basically combined @Wingnut 's example with this documentation example of using the evaluate function to query the values of an animation at each frame:
PGDemo | Babylon.js Playground (babylonjs.com)

5 Likes
4

Building on that, you can also do like below onBeforeRender without manually computing the time value or calling evaluate, for a simpler example. :slightly_smiling_face:

control.color = control.bColor.toHexString();

https://playground.babylonjs.com/#U5URZC#33

2 Likes
5

Thank you all <3

1 Like