Roku Developer Program

Developers and content creators—a complete solution for growing an audience directly.
cancel
Showing results for 
Search instead for 
Did you mean: 
Romans_I_XVI
Level 7

HSVA to RGBA function

I decided I wanted to be able to adjust color with a single slider like you would on the "hue" bar in GIMP ( or Photoshop or whatever ). The colors are created with a combination of Hue, Saturation, and Value. Instead of Red, Blue, Green.

So just in case somebody wants to do this too here is your function - h = hue , s = saturation, v = value, a = alpha


Function HSVAtoRGBA(h%,s%,v%,a%) As Integer
' Romans_I_XVI port (w/ a few tweaks) of:
' http://schinckel.net/2012/01/10/hsv-to-rgb-in-javascript/

h% = h% MOD 360

rgb = [ 0, 0, 0 ]
if s% = 0 then
rgb = [v%/100, v%/100, v%/100]
else
s = s%/100 : v = v%/100 : h = h%/60 : i = int(h)

data = [v*(1-s), v*(1-s*(h-i)), v*(1-s*(1-(h-i)))]

if i = 0 then
rgb = [v, data[2], data[0]]
else if i = 1 then
rgb = [data[1], v, data[0]]
else if i = 2 then
rgb = [data[0], v, data[2]]
else if i = 3 then
rgb = [data[0], data[1], v]
else if i = 4 then
rgb = [data[2], data[0], v]
else
rgb = [v, data[0], data[1]]
end if
end if

for c = 0 to rgb.count()-1 : rgb[c] = int(rgb[c] * 255) : end for
color% = (rgb[0] << 24) + (rgb[1] << 16) + (rgb[2] << 8) + a%

return color%
End Function


I converted a Javascript function that I found to work for BrightScript.

Cheers.

Edit: I've changed the code to use dev42's code which solves the problem with the color getting clipped off at a baby blue and not continuing all the way back to red. Thank you very much Dev42!
0 Kudos
38 Replies
Komag
Level 9

Re: HSVA to RGBA function

That looks useful - maybe i could be Cint(h) to be a bit more accurate
0 Kudos
squirreltown
Level 8

Re: HSVA to RGBA function

Thanks for posting this I'm totally stealing it.
Kinetics Screensavers
0 Kudos
Romans_I_XVI
Level 7

Re: HSVA to RGBA function

Glad I could help.

And Komag - the original javascript function was using a floor function. Here is what I based it on.
http://schinckel.net/2012/01/10/hsv-to- ... avascript/
0 Kudos
dev42
Level 7

Re: HSVA to RGBA function

oooh oooh oooh! I wanna steal it too! I wanna steal it too!

OK, but a question... why not return hex value in the first place?
It's not that I didn't read THIS, I just didn't catch it at first.
... and I wanted to do bit shifting and keep things hexy.
0 Kudos
Romans_I_XVI
Level 7

Re: HSVA to RGBA function

Glad you like it dev42 . How were you planning on implementing it though? I'm currently jumping through about 3 hoops. But it doesn't matter too much because I'm not running these functions often.

I start with that original HSVAtoRGBA function, which gives me a decimal. Then I have to pass it through this function.


function decToHex (dec) as string
hexTab = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "A", "B", "C", "D", "E", "F"]
hex = ""
while dec > 0
hex = hexTab [dec mod 16] + hex
dec = dec / 16
end while
if hex = "" return "0" else return hex
end function


Then I'm left with a string that I finally turn back into hex like so.

val(hexstring,16)


In my Brightscript I'm doing it like this.

 some_hex_color = val(decTohex(HSVAtoRGBA(hue,sat,100,255)),16)
0 Kudos
dev42
Level 7

Re: HSVA to RGBA function

"Romans_I_XVI" wrote:
How were you planning on implementing it though?

Pardon my ignorance, and I'm not as nimble as others here, but why do you need the hex codes? I thought TheEndless' comment was that you could just use the color as an Integer/roInteger?

It's hard to say how I'd do it... Smiley LOL Warning! Continue at your own peril.

Options include, but are not limited to:
  • using roByteArray.toHexString()

  • convert each color channel into a Hex String and concatenate them together

  • make a Look Up table... Just a spectrum bitmap & a percentage ...

  • can colors be read from screen?


The huge numbers that you are multiplying by work. So why change it? But I'd prefer, "R << 24 + G << 16 + B << 8 + a" or whatever they are supposed to be.

edit: Supposedly they should be: "(R << 24) + (G << 16) + (B << 8 ) + a"
I don't know order of operations apparently. ( extra space lest I get a smiley instead of an 8 )
0 Kudos
Romans_I_XVI
Level 7

Re: HSVA to RGBA function

Ic. For me the integers only worked up to a certain number, then the color stopped changing. I have no idea why, all I know is I got it to work by doing what's in my previous post.
0 Kudos
dev42
Level 7

Re: HSVA to RGBA function

[spoiler=tiny updates to HSVAtoRGBA v3:2n1w1e57]
Function HSVAtoRGBA(h%,s%,v%,a%) As Integer
' Romans_I_XVI port (w/ a few tweaks) of:
' http://schinckel.net/2012/01/10/hsv-to-rgb-in-javascript/
h% = h% MOD 360

rgb = [ 0, 0, 0 ]
if s% = 0 then
rgb = [v, v, v]
else
s = s%/100 : v = v%/100 : h = h%/60 : i = int(h)

data = [v*(1-s), v*(1-s*(h-i)), v*(1-s*(1-(h-i)))]

if i = 0 then
rgb = [v, data[2], data[0]]
else if i = 1 then
rgb = [data[1], v, data[0]]
else if i = 2 then
rgb = [data[0], v, data[2]]
else if i = 3 then
rgb = [data[0], data[1], v]
else if i = 4 then
rgb = [data[2], data[0], v]
else
rgb = [v, data[0], data[1]]
end if
end if

for c = 0 to rgb.count()-1 : rgb[c] = int(rgb[c] * 255) : end for
color% = (rgb[0] << 24) + (rgb[1] << 16) + (rgb[2] << 8) + a%

return color%
End Function
[/spoiler:2n1w1e57]
And my incredibly detailed/painstakingly laborious testing:
for hue = 0 to 360
scr.DrawLine(100,100+hue,200,100+hue, HSVAtoRGBA(hue,100,100,255))
end for

TO DO: maybe add some bounds checking on the h, s, v, a params?
0 Kudos
Romans_I_XVI
Level 7

Re: HSVA to RGBA function

Nice code dev42. Please try this with draw object. I promise you, once your integer gets greater than 2147483647 the color will stop changing. I have no idea why, or maybe I'm wrong and I was half asleep when I was doing this stuff. But I'm 99% sure, that if I just omitted all of these functions we're working with, and just plugged in an integer to drawobject , the color stops changing at 2147483647

Let me know if you get these same results.
0 Kudos