Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to make a rounded corner image in Java

I want to make a image with rounded corners. A image will come from input and I will make it rounded corner then save it. I use pure java. How can I do that? I need a function like

public void makeRoundedCorner(Image image, File outputFile){
.....
}

Schema

Edit : Added an image for information.

like image 913
Ali Davut Avatar asked Sep 29 '11 21:09

Ali Davut


People also ask

How do you create a rounded rectangle in Java?

We can use the drawRoundRect() method that accepts x-coordinate, y-coordinate, width, height, arcWidth, and arc height to draw a rounded rectangle.

Why use rounded corners UI?

The answer to that is literally in your eye. Some experts say that rectangles with rounded corners are easier on the eyes than a rectangle with sharp edges because they take less cognitive effort to visually process. The fovea is fastest at processing circles.

How do I make rounded corners in paint?

In the upper left corner, select “Draw Filled Shape“. Draw the rounded rectangle over the area you would like to keep for your rounded corners image. Use the Magic Wand to select the area of the rounded rectangle.


2 Answers

I suggest this method that takes an image and produces an image and keeps the image IO outside:

Edit: I finally managed to make Java2D soft-clip the graphics with the help of Java 2D Trickery: Soft Clipping by Chris Campbell. Sadly, this isn't something Java2D supports out of the box with some RenderhingHint.

public static BufferedImage makeRoundedCorner(BufferedImage image, int cornerRadius) {
    int w = image.getWidth();
    int h = image.getHeight();
    BufferedImage output = new BufferedImage(w, h, BufferedImage.TYPE_INT_ARGB);

    Graphics2D g2 = output.createGraphics();
    
    // This is what we want, but it only does hard-clipping, i.e. aliasing
    // g2.setClip(new RoundRectangle2D ...)

    // so instead fake soft-clipping by first drawing the desired clip shape
    // in fully opaque white with antialiasing enabled...
    g2.setComposite(AlphaComposite.Src);
    g2.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
    g2.setColor(Color.WHITE);
    g2.fill(new RoundRectangle2D.Float(0, 0, w, h, cornerRadius, cornerRadius));
    
    // ... then compositing the image on top,
    // using the white shape from above as alpha source
    g2.setComposite(AlphaComposite.SrcAtop);
    g2.drawImage(image, 0, 0, null);
    
    g2.dispose();
    
    return output;
}

Here's a test driver:

public static void main(String[] args) throws IOException {
    BufferedImage icon = ImageIO.read(new File("icon.png"));
    BufferedImage rounded = makeRoundedCorner(icon, 20);
    ImageIO.write(rounded, "png", new File("icon.rounded.png"));
}

This it what the input/output of the above method looks like:

Input:

input image

Ugly, jagged output with setClip():

jagged with setclip

Nice, smooth output with composite trick:

smooth with composite trick

Close up of the corners on gray background (setClip() obviously left, composite right):

closeup corners on gray bacjground

like image 156
Philipp Reichart Avatar answered Sep 18 '22 07:09

Philipp Reichart


I am writing a follow up to Philipp Reichart's answer. the answer of as an answer.

To remove the white background (seems to be black in the pictures), change g2.setComposite(AlphaComposite.SrcAtop); to g2.setComposite(AlphaComposite.SrcIn);

This was a big problem for me because I have different images with transparency that I don't want to lose.

My original image:
enter image description here

If I use g2.setComposite(AlphaComposite.SrcAtop);:
enter image description here

When I use g2.setComposite(AlphaComposite.SrcIn); the background is transparent.

like image 42
ossobuko Avatar answered Sep 21 '22 07:09

ossobuko