Hue and Saturation?

Java 2D
#1

I was wondering if anyone here knew how to do a hue/saturation coloring effect in Java.

Basically what I’m doing is creating an avatar template where I’m making grayscale hair styles, clothing, etc., and I want to colorize these on the fly so a user can choose their own avatar’s appearance by mixing/matching elements and colors.

I could do this using PSP, but then I would need to make copies of each element in all major colors. That could wind up to be a lot of extraneous images. So I think that being able to colorize the elements on the fly would be a good idea.

Anyone have any pointers on this?

#2

You could use the ImageFilter stuff in java.awt.image to do it.

http://java.sun.com/j2se/1.3/docs/api/java/awt/image/RGBImageFilter.html

Kev

#3

I’ll give that a try, thanks! ;D

#4

Well, I tried to figure this thing out, but have had no luck. :-/ Is there any chance of getting a brief example on how to use it, or some other method?

#5

Well, if no one can help me with this…

Would it be worth it to use something like PixelGrabber to get pixel data within the overlay elements, use those values to add the color to, and then use line drawing to replace the gray shades with colorized shades?

Or am I better off just using Paint Shop Pro to make multiple copies of each image but with different colors?

#6

Sorry I didn’t get back to you.

Loosely ripped from the javadoc examples. The filter might look like this:


class HueFilter extends RGBImageFilter {
     private int red;
     private int green;
     private int blue;

     public HueFilter(int red,int green,int blue) {
      canFilterIndexColorModel = true;

                this.red = red;
                this.green = green;
                this.blue = blue;
     }

     public int filterRGB(int x, int y, int rgb) {
                int originalAlpha = (rgb & 0xFF000000) >> 24;
                int originalRed = (rgb & 0x00FF0000) >> 16;
                int originalGreen = (rgb & 0x0000FF00) >> 8;
                int originalBlue = (rgb & 0x000000FF);

                // mod colours here
                originalRed += red;
                originalGreen += green;
                originalBlue += blue;

                return (originalAlpha << 24) | (originalRed << 16) | (originalGreen << 8) | originalBlue;
     }
}

Then using it might look something like this (to increase red in this case).


    Image src = getImage("sourceimagehere");
    ImageFilter colorfilter = new HueFilter(25,0,0);
    Image img = createImage(new FilteredImageSource(src.getSource(),colorfilter));

I haven’t compiled this code, it just typed so excuse any little errors. In addition you might want to add clamping to prevent values going up over 255 which would screw the whole thing up.

You could also do this by just running through the raster of the image yourself but since the image filtering stuff already exists I thought it might be nice to use.

Again, apologies for the slow response.

Kev

#7

Thanks again, Kev! I think the main problem I had with understanding this thing was all the bitshifting. I found an article that explained how bitshifting colors worked, and that helped. I have little experience with bitwise operations. About all I have memorized is how to set, reset, and test flags.

Your example is great Kev, and much appreciated.