[SOLVED] element.color.set not working

https://playcanvas.com/editor/scene/671855

Changin colors of elements on runtime seems broken.

this.entity.element.color.set(0,0,0);
Not working

Instead of doing:

this.entity.element.color.set(0,0,0);

Do:

this.entity.element.color = new pc.Color(0, 0, 0);

When you update the properties of any component, you need to use an assignment operator, or the component will not know that the property has been updated.

2 Likes

@will How would this work in a tween? Having trouble with this at the moment. This is turning the color white for me

this.app
        .tween(currentColor)
        .to(new pc.Color(182,84,44,1), 1.0, pc.Linear)
        .on('update', function () {
            currentElement.color = currentColor;
        })
        .start();

Hi @Jake_Johnson,

Make sure the color RGB values are normalized between 0 - 1.

An easy way is to divide with / 255:

new pc.Color(182 / 255,84 / 255,44 / 255,1)
1 Like

@Leonidas ahhhh… that makes sense. Thank you so much. I’ve been staring at this a bit longer than I’d like to admit.

Why are the rgb values in the editor not normalized but the function that takes them is?

1 Like

I think because RGB values are usually used in photography and graphic design in the 0 - 255 range. So when people are setting color values in editor, are used to that system.

But when it comes to engine internals and shaders, color values are always expected in the 0 - 1 range.

Someone from the PlayCanvas team may have more say on this. @will @yaustar

2 Likes

Yeah pretty much what Leonidas had said

1 Like