CODEWITHSUNDEEP
javabufferedimagefadealpha
WiErD0
WiErD0

Reputation: 467

Can I have image alpha fade from left to right in java?

I am making a game and want to have a single image 'fade' from left to right with the left part of the image having an alpha of 1.0 and the right having an alpha of 0.0. (note: I do not want it to be changing what it looks like over time, like fading in or out, but just fading from left to right and staying constant). An attempt to draw what I want the end result to look like is below:

lll lll ll ll l l  l    l            l
lll lll ll ll l l  l    l            l
lll lll ll ll l l  l    l            l
lll lll ll ll l l  l    l            l
lll lll ll ll l l  l    l            l
lll lll ll ll l l  l    l            l

Where the densities of the 'l's represent the alpha

I am currently using Buffered Images of TYPE_INT_RGB, and would like to keep that the same if possible.

Is there any built in java classes that can help me do this, or at least a (relatively easy) way to do this myself that I just can't figure out?

EDIT: I don't want to have an opaque frame of any sort. I want to draw one BufferedImage (with alpha gradient) onto another BufferedImage.

Upvotes: 0

Views: 876

Answers (1)

MadProgrammer
MadProgrammer

Reputation: 347204

The basic idea is to apply a AlphaComposite mask over the original image which has been filled with a LinearGradientPaint

So, we start by loading the original image...

BufferedImage original = ImageIO.read(new File("/an/image/somewhere"));

We then create a masking image of the same size...

BufferedImage alphaMask = new BufferedImage(original.getWidth(), original.getHeight(), BufferedImage.TYPE_INT_ARGB);

We then fill the masking image with a LinearGradientPaint...

Graphics2D g2d = alphaMask.createGraphics();
LinearGradientPaint lgp = new LinearGradientPaint(
        new Point(0, 0), 
        new Point(alphaMask.getWidth(), 0), 
        new float[]{0, 1}, 
        new Color[]{new Color(0, 0, 0, 255), new Color(0, 0, 0 , 0)});
g2d.setPaint(lgp);
g2d.fillRect(0, 0, alphaMask.getWidth(), alphaMask.getHeight());
g2d.dispose();

What's important here is, we don't actually care about the physical color, only it's alpha property, as this will determine how the two images are masked together...

Then, we apply the mask...

BufferedImage faded = applyMask(original, alphaMask, AlphaComposite.DST_IN);

Which actually calls this utility method...

public static BufferedImage applyMask(BufferedImage sourceImage, BufferedImage maskImage, int method) {

    BufferedImage maskedImage = null;
    if (sourceImage != null) {

        int width = maskImage.getWidth();
        int height = maskImage.getHeight();

        maskedImage = new BufferedImage(width, height, BufferedImage.TYPE_INT_ARGB);
        Graphics2D mg = maskedImage.createGraphics();

        int x = (width - sourceImage.getWidth()) / 2;
        int y = (height - sourceImage.getHeight()) / 2;

        mg.drawImage(sourceImage, x, y, null);
        mg.setComposite(AlphaComposite.getInstance(method));

        mg.drawImage(maskImage, 0, 0, null);

        mg.dispose();
    }

    return maskedImage;

}

This basically uses a "destination in" AlphaComposite to apply the mask onto the original image, which results in...

(original on the left, alpha on the right)

Alpha

And just to proof the point, I changed the background color of the frame's content pane to RED

enter image description here

Upvotes: 5

Related Questions