setColorTransform HSV mode

chipster123

@altilim, could the setColorTransform() function support the HSV model as well as the RGB model?
I want to affect the hue without changing the saturation or value, and the RCB approach doesn't support it. It just tints the overall image. Changing hue allows the grays (equal r,b,g proportions) to go untouched while changing the non-grays.

ar2rsawseen

If you only interested in Hue, then HSL will also suit you.

I've dealt with HSL recently, here's the code I used (just ported it to Gideros, didn't test thoroughly, but seems to work):

local rgb_to_hsl = function(r, g, b) r = r/255 g = g/255 b = b/255 local max = math.max(r, g, b) local min = math.min(r, g, b) local h local s local l = (max + min) / 2 if(max == min) then --achromatic h = 0 s = 0 else local d = max - min if(l > 0.5) then s = d / (2 - max - min) else s = d / (max + min) end   if max == r then if g < b then h = (g - b) / d + 6 else h = (g - b) / d end elseif max == g then h = (b - r) / d + 2 elseif max == b then h = (r - g) / d + 4 end h = h / 6 end return math.floor(h*360 + 0.5), math.floor(s*100 + 0.5), math.floor(l*100 + 0.5) end   local hsl_to_rgb = function(h, s, l) h = h/360 s = s/100 l = l/100 local r, g, b if(s == 0) then --achromatic r = 1 g = 1 b = l else local q if l < 0.5 then q = l * (1 + s) else q = l + s - l * s end local p = 2 * l - q r = hue_to_rgb(p, q, h + 1/3) g = hue_to_rgb(p, q, h) b = hue_to_rgb(p, q, h - 1/3) end return math.floor(r * 255 + 0.5), math.floor(g * 255 + 0.5), math.floor(b * 255 + 0.5) end   local hue_to_rgb = function(p, q, t) if(t < 0) then t = t + 1 end if(t > 1) then t = t - 1 end if(t < 1/6) then return p + (q - p) * 6 * t end if(t < 1/2) then return q end if(t < 2/3) then return p + (q - p) * (2/3 - t) * 6 end return p end   local h, s, l = rgb_to_hsl(35,9,34) print(h.." "..s.." "..l)

atilim

@ar2rsawseen, I think @chipster123 wants to change HSV values of a sprite. And unfortunately its not possible to achieve this effect with OpenGL ES 1.1.

chipster123

@ar2rsawseen, thanks for the code, but @atilim is correct and I am sad. =((

ar2rsawseen

I must be missing something, but,
can't you retrieve RGB using :getColorTransform() or use a default RGB value,
convert it to HSL,
modify hue,
convert back to RGB,
and use setColorTransform() to set new RGB values?

OZApps

@ar2sawseen, The RGB method will colour a sprite into one colour, where as I *GUESS* that Chipster is wanting to fade a sprite out rather than re-colour it in monochrome.

While what you are suggesting sounds fine on the surface, but it won't work the way it is intended to.

Scouser

I think @Chipster123 may want to have one set of sprites (say soldiers with a blue uniform) and then using HSV change only the uniform colour to maybe red or green. It would be an excellent feature and would save so much memory. Unfortunately as atilim says, using OpenGL ES 1.1 this is not possible. If I remember rightly, shaders are not supported in OpenGL ES 1.1 either otherwise this could maybe have been implemented as a shader program.

techdojo

If @Scouser is right about @Chipster123's intended use case then another approach would be to split the character into different elements and then create a parent "character" sprite in which the elements were recombined to make a new character. You could either then supply a set of your own "uniforms" or if the "uniform" section was white then you could colourise only the section you were interested in (and combining it with @ar2rsawseen's idea would probably give you the effect you need.

atilim

Hi,

After reading your posts (mainly @techdojo's post), I tried to implemented a simple example that displays an image with changing HSV values.

First I created 3 images by shifting their rgb channels:
1st image -> r, g, b
2nd image -> g, b, r
3rd image -> b, r, g

Then I calculated the 3x3 color transform matrix from HSV values and apply these values to these images by using setColorTransform and then render them with additive blending.

On the other hand, it seems it's not a practical way to be used in a real application.

(edit: I take the matrix from here: http://beesbuzz.biz/code/hsv_color_transforms.php)

chipster123

I'll post example images. But the gist of it is that changing hue on a color image leaves the gray parts gray and shifts the color parts however I want. This use case is to have a common set of graphics with color and gray parts then apply different hue shifts to the bitmaps for different "teams". The base application will only require one set of graphics, but the application can apply any color scheme the user wants.

OZApps

@Atilim, that is recolouring the whole sprite, almost like colouring it with RGB, Can we recolour only a particular colour, say the Toucan's beak which is Yellow, that would be nice to achieve.

chipster123

Here is the example. The original image on left, one of an "infinite" hue shifting options in middle, ugly rgb mixed approximation on right.

@OZapps, to get what you want, then I would overlay the "non modifiable" colors on the final shifted image. In this examples, the skin may be a pink color regardless of the uniform choices the user makes.

techdojo

So basically you are combining separate images to create a whole object?

Just create all of your graphics you want to colour in a white / greyscale and then apply the RGB tinting only to that layer - it'll give you the same effect. Your adding the "pink" faces on later anyway.

When "render to texture" becomes available you could replicate this process before the game starts and then just have a single sprite sheet to use.

Just my $0.02

Scouser

@Chipster123: Seeing your example and what you want to achieve then the only possibility I can see is what @techdojo suggested. You will need to store separate images for the coat and skirt (in the above example) and apply a color_transform to just them elements then add them as children to the main image. It may be a little more wasteful on graphics memory but at least you will still only need to store one set of images.

DOH!!! Ninja'd by techdojo (

techdojo

Scouser

Grrrrrrr!!!!!!!

OZApps

@Chipster123, if it is about creating composite images, then it is almost like the Paper Dolls technique, where you can recolour the base skin and then place any piece of clothing / layers on it. I thought you were wanting to change the HSV of the entire sprite.

chipster123

@OZapps, it was about changing the color parts of images. My example was simple but the idea is the same; change the colors an not the grays - hue shift gives this. I just was asking originally if it was possible for the api to support it. It's not and I'm OK with that.

keszegh

I was wondering if one can make a bitmap monochrome with some trick in Gideros. I've found this topic, from which it seems this is not possible yet, but will be possible later when opengl 2.0 support comes. can anyone confirm these infos?

ar2rsawseen

@keszegh you can using Media plugin set each pixel of an image, for example to same r g b values

keszegh

@ar2rsawseen, thanks, that's good to know.
still, it would be more convenient to work with bitmaps (media is not a bitmap, or is it? there is no freely available documentation for it and in the labs topic i did not find if it inherits from any class) especially that media is in experimental stage, so i'm still interested if opengl2 might bring this feature.

ar2rsawseen

Media basically is an image file, that then can be loaded into Bitmap.

Currently without @atilim's consult I can not confirm nor deny the possibility of feature being supported in OpenGL 2.0
But I will check with him

keszegh

i see, you can save the media to a file and then load it back as a bitmap if you like.
thanks for checking the opengl2 part.