BufferedImage producing black background

Question

Alright so I'm making a game, and I'm trying to modify the original hit marker image by adding text on it, and I'm using the following code:

import javax.swing.ImageIcon;
import javax.swing.Timer;

import java.awt.Color;
import java.awt.Font;
import java.awt.Graphics2D;
import java.awt.Image;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import java.awt.image.BufferedImage;
public class HitMarker {

    public static final Image rangeHitMarker = new ImageIcon(HitMarker.class.getResource("rangeHitMarker.png")).getImage();
    public static final Image magicHitMarker = new ImageIcon(HitMarker.class.getResource("magicHitMarker.png")).getImage();
    public static final Image monsterHitMarker = new ImageIcon(HitMarker.class.getResource("monsterHitMarker.png")).getImage();

    public static final Font font = new Font("Tahoma", Font.PLAIN, 10);

    public static final Color t = new Color(0,0,0,0);

    public Image hitMarker;
    public BufferedImage image;
    public String hit;

    public int attackStyle;

    public boolean rangeAttack;
    public int x;
    public int y;

    public Timer timer;
    public boolean remove;

    public HitMarker(int x, int y, int hit, int attackStyle){
        this.hit = String.format("%d", hit);
        this.remove = false;
        this.x = x;
        this.y = y;
        this.attackStyle = attackStyle;
        this.hitMarker = getImage();
        BufferedImage bi = new BufferedImage(35, 20, BufferedImage.TYPE_INT_RGB);
        Graphics2D g = bi.createGraphics();
        g.drawImage(hitMarker, 0, 0, null);
        g.setFont(font);
        g.setColor(Color.WHITE);
        g.drawString(this.hit, 18, 13);
        g.dispose();
        image = bi;
        timer = new Timer(800,
                new ActionListener(){
            public void actionPerformed(ActionEvent e){
                remove = true;
                timer.stop();
            }
        }
        );
        timer.setInitialDelay(800);
        timer.start();
    }

    public HitMarker(int x, int y, int hit){
        this.hit = String.format("%d", hit);
        this.remove = false;
        this.x = x;
        this.y = y;
        this.hitMarker = monsterHitMarker;
        BufferedImage bi = new BufferedImage(35, 20, BufferedImage.TYPE_INT_RGB);
        Graphics2D g = bi.createGraphics();
        g.drawImage(hitMarker, 0, 0, null);
        g.setFont(font);
        g.setColor(Color.WHITE);
        g.drawString(this.hit, 18, 13);
        g.dispose();
        image = bi;
        timer = new Timer(800,
                new ActionListener(){
            public void actionPerformed(ActionEvent e){
                remove = true;
                timer.stop();
            }
        }
        );
        timer.setInitialDelay(800);
        timer.start();
    }

    public boolean isRangeAttack(){
        return attackStyle == AttackStyleConstants.RANGE || attackStyle == AttackStyleConstants.RANGE_DEFENCE ? true : false;
    }

    public Image getImage(){
        return isRangeAttack() ? rangeHitMarker : magicHitMarker;
    }

}

Focusing particularly on either constructor: And the error that I'm having is that when I create the BufferedImage and draw the image on the buffered image, it's creating a black background automatically and I don't know why. I've tried researching on this topic and some say to change something about the AlphaComposite and the g.clearRect() method, but neither of those seem to work. By the way, the image that I'm painting on the buffered image is 35x20 (which is the dimensions of the buffered image) and it has a transparent background. If anyone can tell me how to remove this black background, it would be very much appreciated, thank you.

for better help sooner post an [SSCCE](http://sscce.org/), two reasons ---> most answerers dont going to the 3rd side links, 2) for futures readers — mKorbel, Jun 29 '12 at 16:02
@JoshM He meant to say, it is better to post the code directly here, or just the problem portion and a link to the full source, so if the link goes dead, your question won't become uselesss in the future. — Andrew, Jun 29 '12 at 16:11
Oh I see, I'm sorry for any inconvenience I might have caused. Well the problem is particularly in either constructor (where I actually create the BufferedImage) and I thought it would be good to show the whole code (considering its < 100 lines) for more information. But I guess it would just be fine to show only the constructor. — Josh M, Jun 29 '12 at 16:14

score 20 · Accepted Answer · edited Feb 18 '16 at 01:34

20

Try BufferedImage.TYPE_INT_ARGB. This will make the regions transparent instead of black.

edited Feb 18 '16 at 01:34

IvanRF

7,115
5
47
71

answered Jun 29 '12 at 16:12

Clint

8,988
1
26
40

since I am having the same problem i tried above solution not worked for me , actually I want to make background light gray instead of black. Can some one tell me how to do that as well – Lasan Jul 07 '17 at 13:22

score 4 · Answer 2 · answered Jun 29 '12 at 16:13

4

You might want to try and store the alpha channel as well,

 BufferedImage bi = new BufferedImage(35, 20, BufferedImage.TYPE_INT_ARGB);

answered Jun 29 '12 at 16:13

Andrew

13,757
13
66
84

score 1 · Answer 3 · answered Feb 18 '16 at 01:45

1

If you need a JPG with white background, you need to draw the image like this:

g.drawImage(hitMarker, 0, 0, Color.WHITE, null);

This way you avoid the black background when going from PNG to JPG.

answered Feb 18 '16 at 01:45

IvanRF

7,115
5
47
71

score 0 · Answer 4 · answered May 26 '15 at 11:03

Use png instead of jpeg. Png is much suitable for transparency operations. Here is simple png export code snippet;

        BufferedImage bImage = new BufferedImage(640, 480, BufferedImage.TYPE_INT_ARGB);
        Graphics2D g2d = (Graphics2D) bImage.getGraphics();
        DrawingContext context = new DrawingContext(g2d);
        plot.draw(context);
        ByteArrayOutputStream baos = new ByteArrayOutputStream();
        DrawableWriter wr = DrawableWriterFactory.getInstance().get("image/png");

        wr.write(plot, baos, 640, 480);
        baos.flush();

        baos.close();
        InputStream inputStream = new ByteArrayInputStream(baos.toByteArray());
        BufferedImage bufferedImage =  ImageIO.read(inputStream);

        ImageIO.write(bufferedImage,"png",new File(outputFolder.getPath()+"/result.png"));

BufferedImage producing black background

4 Answers4

Linked