Scripting Helpers is winding down operations and is now read-only. More info→
Ad
Log in to vote
2

How do I make a TextLabel's background color have a flow of colors?

Asked by
Adryin 120
10 years ago

For example, like the colors tween like a rainbow and go smoothly, and algorithms you guys have?

0
Well, mess with the BackgroundColor property. It's Color3, so have a loop that would change the values 1 at a time to make it seem like a flow. Shawnyg 4330 — 10y

1 answer

Log in to vote
0
Answered by
BlueTaslem 18071 Moderation Voter Administrator Community Moderator Super Administrator
10 years ago

ROBLOX Color3 objects use the RGB color model.

A "rainbow" is parameterized in terms of hue which is not a component of the RGB color model, and which ROBLOX doesn't directly support.

There are several color models supporting hue -- HSL, HSV/HSB. Here I will describe HSV.

The Hue - Saturation - Value Color Model

Here is the Wikipedia article I am referencing

For a fully saturated (vivid color) rainbow, we use saturation S as 1 and value (brightness) V as 1 as well.

We thus get chroma C as C = S * V.

For a hue measuring between 0 and 360 degrees, we define a scaled-down version

C = S * V
Hp = H / 60

We use the intermediate value X to be the following:

X = C * (1 - math.abs( (Hp % 2) - 1 ) )

From here, we have an unfortunately complicated transformation into RGB that models the zigzags in this figure.

local f = math.floor(Hp) + 1
-- Plus since Lua's arrays are one-indexed
local Cp = {1,2,2,3,3,1}
local Xp = {2,1,3,2,1,3}

local color = {0,0,0}
color[Cp[f]] = C
color[Xp[f]] = X
R1, G1, B1 = unpack(color)

We now add an amount to each to give it its value (brightness)

m = V - C
R,G,B = R1 + m, G1 + m, B1 + m

I have confirmed that this works!


Altogether here's a function to do it, and a rainbow maker:

function RGBfromHSV(H,S,V)
    C = S * V
    Hp = H / 60
    X = C * (1 - math.abs( (Hp % 2) - 1 ) )
    local f = math.floor(Hp) + 1
    -- Plus since Lua's arrays are one-indexed
    local Cp = {1,2,2,3,3,1}
    local Xp = {2,1,3,2,1,3}
    local color = {0,0,0}
    color[Cp[f]] = C
    color[Xp[f]] = X
    R1, G1, B1 = unpack(color)
    m = V - C
    return R1 + m, G1 + m, B1 + m
end


local rainbow = {};

for i = 0, 360, 10 do
    table.insert(rainbow, Color3.new( RGBfromHSV(i,1,1) ) )
end
Ad

Answer this question