How to add 20 pixels of white at the top of an existing image file?

Question

I have an image of size w by h. In Java, I need to create an image that is size w by h+20 where the top w by 20 pixels is white, and the rest of the image is the same as the original image.

Essentially I want to know how I can add 20 pixels of white to the top of an existing buffered image.

So it would be something like:

public static void main (String[] args) {
  BufferedImage originalImage = [the original image with a specific file path];
    ...code to create a new image 20 pixels higher...
    ...code to paint originalImage 20 pixels down on the new image
    ...code to save the new image...
}

Answer 1

Suggestion:

1. Use GraphicsConfiguration.createCompatibleImage(int width, int height) to create a BufferedImage of the same width, but with a height that's +20.
2. Use BufferedImage.createGraphics() to obtain the Graphics2D object of this image.
3. Use Graphics.setColor(Color c) and Graphics.fillRect(int x, int y, int width, int height) to draw the white top
4. Use Graphics.drawImage(Image img, int x, int y, ImageObserver observer) to draw the original image to the specified coordinates of the new image.
5. To save the new image, read the Writing/Saving an Image tutorial.

---

import java.awt.Color;
import java.awt.FlowLayout;
import java.awt.Graphics2D;
import java.awt.GraphicsConfiguration;
import java.awt.GraphicsEnvironment;
import java.awt.image.BufferedImage;
import java.io.File;
import java.io.IOException;

import javax.imageio.ImageIO;
import javax.swing.ImageIcon;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.SwingUtilities;

public class ImageManipulationDemo {
    private static BufferedImage ORIGINAL;
    private static BufferedImage ALTERED;
    private static final GraphicsConfiguration config = 
        GraphicsEnvironment.getLocalGraphicsEnvironment().getDefaultScreenDevice().getDefaultConfiguration();

    public static void main(String[] args) {
        try {
            loadImages();

            SwingUtilities.invokeLater(new Runnable(){
                @Override
                public void run() {
                    createAndShowGUI();             
                }
            });
        } catch (IOException e) {
            e.printStackTrace();
        }
    }

    private static void loadImages() throws IOException {
        ORIGINAL = ImageIO.read(
                ImageManipulationDemo.class.getResource("../resources/whitefro1.jpg"));
        ALTERED = config.createCompatibleImage(
                ORIGINAL.getWidth(), 
                ORIGINAL.getHeight() + 20);
        Graphics2D g2 = ALTERED.createGraphics();
        g2.setColor(Color.WHITE);
        g2.fillRect(0, 0, ALTERED.getWidth(), 20);
        g2.drawImage(ORIGINAL, 0, 20, null);
        g2.dispose();

        // Save image
        ImageIO.write(ALTERED, "PNG", new File("alteredImage.png"));
    }

    private static void createAndShowGUI() {
        final JFrame frame = new JFrame("Image Manipulation Demo");
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        frame.getContentPane().setBackground(Color.BLUE.darker());
        frame.getContentPane().setLayout(new FlowLayout());
        frame.getContentPane().add(new JLabel(new ImageIcon(ORIGINAL)));
        frame.getContentPane().add(new JLabel(new ImageIcon(ALTERED)));
        frame.pack();
        frame.setLocationRelativeTo(null);
        frame.setVisible(true);
    }
}

Answer 2

Yes it make sense. For example:

  public static void main (String[] args) {
      BufferedImage originalImage = [the original image with a specific file path];
      BufferedImage newImage = new BufferedImage(originalImage.getWidth() + 20 , originalImage.getHeight() + 20 , YOUR_IMAGE_TYPE);
      for (int i = 0 ; i < newImage.getHeight() ; i++){
          for (int j = 0 ; j < newImage.getWidth() ; j++){
               if (j > 20 && i > 20){
                     newImage.setRGB(i,j, originalImage.getRGB(i - 20, j - 20));
               } else{
                     newImage.setRGB(i,j, YOUR_RGB_VAL);
               }
          }
      }
    }

P.S. I hope the code is correct. I didn't test it but only wrote it on the fly.

Answer 3

This is possible, you need to investigate BufferedImage and Graphic2D. You can retrieve Graphic2D from the BufferedImage to manipulate and draw on your image.

Basically, you should create a 2nd image with greater dimension and draw the first one in it at the right position to leave white space in the 1st one.