solved Color Picker Animation

[DylanD]

Hey everyone,

I was wondering if there was a way for me to have the color picker's outer ring slowly changing then I get the value of it and I have a nice radiantly changing material.  

But I'm not sure how to make the color picker change without changing the value.  Any ideas?

https://www.babylonjs-playground.com/#91I2RE#89

 

To be more clear I want to be able to set the value of the color picker then the outer ring slowly moves from the color I set it as.  All from code nothing through the Gui.  As in I don't want the color picker to be seen either(which I can do).

[DylanD]

kind of like this but just on the outer ring choice.

https://www.babylonjs-playground.com/#91I2RE#90

[brianzinn]

Sounds like you do not need to use the color picker at all.  Can you not just animate the color yourself on a material?
BABYLON.Animation.ANIMATIONTYPE_COLOR3
https://www.babylonjs-playground.com/#JY35MD#3

[DylanD]

4 minutes ago, brianzinn said:

Sounds like you do not need to use the color picker at all.  Can you not just animate the color yourself on a material?
BABYLON.Animation.ANIMATIONTYPE_COLOR3
https://www.babylonjs-playground.com/#JY35MD#3

although I don't fully understand this yet, I do believe you have the right idea.  Thanks! I will look into this

 

I was originally just making the color and using periodic function to make it loop but I think this will be better.

[brianzinn]

I did give you an unnecessarily complicated PG, as it was changing the light and not the material.  Here is a simpler PG that is not looping:

Material goes from Red to Yellow.  
https://www.babylonjs-playground.com/#1HECPU#68

if you are using BabylonJS 3.3, you can use promises instead of callback.

var anim = scene.beginAnimation(...);
await anim.waitAsync();

 

[DylanD]

5 minutes ago, brianzinn said:

I did give you an unnecessarily complicated PG, as it was changing the light and not the material.  Here is a simpler PG that is not looping:

Material goes from Red to Yellow.  
https://www.babylonjs-playground.com/#1HECPU#68

if you are using BabylonJS 3.3, you can use promises instead of callback.

var anim = scene.beginAnimation(...);
await anim.waitAsync();

 

Thanks, I'm still figuring everything out.  Thanks for the help!

This scene is way easier to understand.