Skip to content

Instantly share code, notes, and snippets.

@simbo1905
Last active November 6, 2018 22:06
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save simbo1905/2c42087edcc78c347979ab47b79611e8 to your computer and use it in GitHub Desktop.
Save simbo1905/2c42087edcc78c347979ab47b79611e8 to your computer and use it in GitHub Desktop.
This Java code renders the text "Houcine Salma Bendor" as jpg or png it renders differently
public static final String FORMAT_NAME = "jpg"; // change me to png!
public final static void generateImage(final String text, final String fileNameWithoutExt) throws Exception {
/*
Because font metrics is based on a graphics context, we need to create
a small, temporary image so we can ascertain the width and height
of the final image
*/
BufferedImage img = new BufferedImage(1, 1, BufferedImage.TYPE_INT_ARGB);
Graphics2D g2d = img.createGraphics();
Font font = new Font("Arial", Font.PLAIN, 48);
g2d.setFont(font);
FontMetrics fm = g2d.getFontMetrics();
int width = fm.stringWidth(text);
int height = fm.getHeight();
g2d.dispose();
img = new BufferedImage(width, height, BufferedImage.TYPE_INT_ARGB);
g2d = img.createGraphics();
g2d.setRenderingHint(RenderingHints.KEY_ALPHA_INTERPOLATION, RenderingHints.VALUE_ALPHA_INTERPOLATION_QUALITY);
g2d.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
g2d.setRenderingHint(RenderingHints.KEY_COLOR_RENDERING, RenderingHints.VALUE_COLOR_RENDER_QUALITY);
g2d.setRenderingHint(RenderingHints.KEY_DITHERING, RenderingHints.VALUE_DITHER_ENABLE);
g2d.setRenderingHint(RenderingHints.KEY_FRACTIONALMETRICS, RenderingHints.VALUE_FRACTIONALMETRICS_ON);
g2d.setRenderingHint(RenderingHints.KEY_INTERPOLATION, RenderingHints.VALUE_INTERPOLATION_BILINEAR);
g2d.setRenderingHint(RenderingHints.KEY_RENDERING, RenderingHints.VALUE_RENDER_QUALITY);
g2d.setRenderingHint(RenderingHints.KEY_STROKE_CONTROL, RenderingHints.VALUE_STROKE_PURE);
g2d.setFont(font);
g2d.setBackground(Color.white);
fm = g2d.getFontMetrics();
g2d.setColor(Color.white);
g2d.drawString(text, 0, fm.getAscent());
g2d.dispose();
ImageIO.write(img, FORMAT_NAME, new File(fileNameWithoutExt+"."+FORMAT_NAME));
}
@simbo1905
Copy link
Author

simbo1905 commented Nov 6, 2018

If I render as "png" on Internet Explorer I get white text on a white background. In Chrome I get white text on a black background. If I render as "jpg" in Internet Explorer I get orange/pink text on a black background and the same in Chrome. This is unexpected as there is g2d.setBackground(Color.white).

@RustyKnight
Copy link

RustyKnight commented Nov 6, 2018

You need to stop "assuming" what the API functionality does and start reading the JavaDocs

Sets the background color for the Graphics2D context. The background color is used for clearing a region. When a Graphics2D is constructed for a Component, the background color is inherited from the Component. Setting the background color in the Graphics2D context only affects the subsequent clearRect calls and not the background color of the Component. To change the background of the Component, use appropriate methods of the Component.

You should be using setColor and something like fillRect to fill the image area with the specified color you want, which kind of defeats the purpose of using a transparent PNG.

Alternatively, and probably a better solution, would be to change the background color of the HTML page into which the image is going to be rendered.

If your prefer not to have a transparent image, then you should change img = new BufferedImage(width, height, BufferedImage.TYPE_INT_ARGB); to img = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB); and make sure you fill the image with the preferred background color BEFORE rendering the image

As to the JPG colouring issue. This is a know, and sadly, common issue where an attempt is made to save a image with a alpha channel to the JPG format, which doesn't support alpha channels. See https://stackoverflow.com/questions/4386446/issue-using-imageio-write-jpg-file-pink-background for more details

Also, understand that the original intention of the code snippet you've copied, was to generate a transparent image, hence the reason it uses a PNG file format

Currently, this is neither a problem with ImageIO, AWT, BufferedImage or Chrome, but a misunderstanding of how the APIs work

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment