I've made a small program that draws black rectangles on a JPanel at random places. I would like to give the user the option to save this JPanel as a .gif file, but I'm not sure where to start. The function I need to write is SaveJPanelAsGIF below on line 36. Can anyone point me in the right direction please? Thanks.

// SaveAsGIF.java

import java.awt.*;
import java.awt.event.*;
import java.io.*;
import javax.swing.*;
 
public class SaveAsGIF extends JFrame
{
    ButtonPanel buttonPanel;
    CanvasPanel canvasPanel;
    
    public static void main(String[] args) 
    {
        SaveAsGIF sag = new SaveAsGIF();
    }
    
    
    public SaveAsGIF()
    {
        this.setTitle("Save JPanel As GIF");
        this.setVisible(true);
        this.setSize(600, 600);
        this.setLayout(new BorderLayout());
        canvasPanel = new CanvasPanel(this);
        buttonPanel = new ButtonPanel(this, canvasPanel);
        this.add(buttonPanel, BorderLayout.NORTH);
        buttonPanel.setPreferredSize(new Dimension(600, 100));                
        this.add(buttonPanel, BorderLayout.NORTH);
        this.add(canvasPanel, BorderLayout.SOUTH);
        this.pack();
        this.setDefaultCloseOperation(EXIT_ON_CLOSE);
    }
    
    
    public void SaveJPanelAsGIF (JPanel jp)
    {
        // not sure what to do here.
    }
}
// ButtonPanel.java

import java.awt.*;
import java.awt.event.*;
import java.io.*;
import javax.swing.*;


public class ButtonPanel extends JPanel implements ActionListener
{
     JButton drawButton;
     JButton saveButton;
     CanvasPanel cp;
     SaveAsGIF savegif;
     
     public ButtonPanel(SaveAsGIF se, CanvasPanel canPanel)
     {
         savegif = se;
         cp = canPanel;
         this.setBackground(Color.RED);
         this.setPreferredSize(new Dimension(600, 100));
         LayoutManager lm = new GridLayout(1, 2);
         drawButton = new JButton ("Draw New Rectangle");
         saveButton = new JButton ("Save Canvas Panel as GIF");
         drawButton.addActionListener(this);
         saveButton.addActionListener(this);
         this.setLayout(lm);
         this.add(drawButton);
         this.add(saveButton);
     } 

     public void actionPerformed(ActionEvent e) 
     {
         Object obj = e.getSource();
         if (obj == drawButton)
             cp.NewDrawing();
         else if (obj == saveButton)
             savegif.SaveJPanelAsGIF(cp);
     }
}
// CanvasPanel.java

import java.awt.*;
import java.awt.event.*;
import java.io.*;
import javax.swing.*;
import java.util.*;


class CanvasPanel extends JPanel
{
    int x;
    int y;
    int length;
    int width;
    Random random;
    SaveAsGIF savegif;
    
    
    public CanvasPanel(SaveAsGIF se)
    {
        savegif = se;
        x = 100;
        y = 100;
        length = 200;
        width = 100;
        random = new Random();
        this.setBackground(Color.GREEN);
        this.setPreferredSize(new Dimension(600, 500));
    }
    

    public void paintComponent(Graphics g)
    {
        super.paintComponent(g);
        g.setColor(Color.BLACK);
        g.fillRect(x, y, width, length);
    }
    
    
    public void NewDrawing()
    {
        x = random.nextInt(100) + 50;
        y = random.nextInt(100) + 50;
        width = random.nextInt(100) + 50;
        length = random.nextInt(100) + 150;
        repaint();
    }   
}

Recommended Answers

All 5 Replies

I found some links that rendered Images to .gifs, which seemed useless at first but then I looked into the Image class and all of the "helper" classes for its methods.

I think I'll try to look into how to read the pixels on a screen into an array (or double array) of ints to produce a valid Image so that you can use the Java Image I/O API located here--

http://java.sun.com/j2se/1.4.2/docs/guide/imageio/spec/imageio_guideTOC.fm.html

--If successful then anything like a Graphics-rendered Image, or something that yields pixels on the screen (like the acm.GraphicsProgram GObjects, etc) can be written to a valid Image extension.

There are other links I found for converting strictly "Images" to .gif, etc but it's only useful if you can produce an Image out of the drawn unit.

http://www.gif4j.com/java-gif4j-pro-gif-image-encode-save.htm

http://www.acme.com/java/software/Acme.JPM.Encoders.GifEncoder.html

Hopefully someone can find a more reasonable solution to this though. I hate re-inventing the wheel!

commented: Thanks for the links. +5

Here is the code I used to dump a "colorscan" display of some sensor data to an image file so I could fiddle with it in an external image processing package. Our component was using an offscreen Image buffer to draw on and then rendering with g.drawImage() in the paintComponent method, so I already had an Image of the panel, but I fiddled with the code just a bit and the following should work for you if you don't need to save the frame decorations (title bar, etc), just the contents .
The action listener code to save:

public void actionPerformed(java.awt.event.ActionEvent e){
    try {
        File saveFile = new File(jobFile+"_colorscan@"+centerSampleIndex+".gif");
        Image img = createImage(getWidth(),getHeight());
        Graphics g = img.getGraphics();
        paint(g);
        ImageIO.write(toBufferedImage(img),"gif",saveFile);
        JOptionPane.showMessageDialog(null,"Image saved to "+saveFile.toString());
        g.dispose();
    } catch (Exception ex){
        ex.printStackTrace();
    }
}

The method to convert the Image to a BufferedImage (which I found in some example somewhere):

// This method returns a buffered image with the contents of an image
private BufferedImage toBufferedImage(Image image) {
    if (image instanceof BufferedImage) {
        return (BufferedImage)image;
    }

    // This code ensures that all the pixels in the image are loaded
    image = new ImageIcon(image).getImage();

    // Determine if the image has transparent pixels; for this method's
    // implementation, see e661 Determining If an Image Has Transparent Pixels
    boolean hasAlpha = hasAlpha(image);

    // Create a buffered image with a format that's compatible with the screen
    BufferedImage bimage = null;
    GraphicsEnvironment ge = GraphicsEnvironment.getLocalGraphicsEnvironment();
    try {
        // Determine the type of transparency of the new buffered image
        int transparency = Transparency.OPAQUE;
        if (hasAlpha) {
            transparency = Transparency.BITMASK;
        }

        // Create the buffered image
        GraphicsDevice gs = ge.getDefaultScreenDevice();
        GraphicsConfiguration gc = gs.getDefaultConfiguration();
        bimage = gc.createCompatibleImage(
                image.getWidth(null), image.getHeight(null), transparency);
    } catch (HeadlessException e) {
        // The system does not have a screen
    }

    if (bimage == null) {
        // Create a buffered image using the default color model
        int type = BufferedImage.TYPE_INT_RGB;
        if (hasAlpha) {
            type = BufferedImage.TYPE_INT_ARGB;
        }
        bimage = new BufferedImage(image.getWidth(null), image.getHeight(null), type);
    }

    // Copy image to buffered image
    Graphics g = bimage.createGraphics();

    // Paint the image onto the buffered image
    g.drawImage(image, 0, 0, image.getWidth(null), image.getHeight(null), null);
    g.dispose();

    return bimage;
}    
// This method returns true if the specified image has transparent pixels
public static boolean hasAlpha(Image image) {
    // If buffered image, the color model is readily available
    if (image instanceof BufferedImage) {
        BufferedImage bimage = (BufferedImage)image;
        return bimage.getColorModel().hasAlpha();
    }

    // Use a pixel grabber to retrieve the image's color model;
    // grabbing a single pixel is usually sufficient
     PixelGrabber pg = new PixelGrabber(image, 0, 0, 1, 1, false);
    try {
        pg.grabPixels();
    } catch (InterruptedException e) {
    }

    // Get the image's color model
    ColorModel cm = pg.getColorModel();
    return cm.hasAlpha();
}
commented: Code worked perfectly. +5
commented: Great post with lots of useful info +1
commented: You deserve a promotion, dude. Epic win. +2

Awesome. Ezzaral, it worked on the first try! Thank you. I'm still going over the code line by line to try to get my hands around it, but like I said, it worked. Alex, thank you for the links. They look similar to what Ezzaral posted. I had heard that it can be a hassle to deal with gif files since there is some patent on the compression and that Acme released something to deal with that. Looks useful and I'll give it a try. Thanks a bunch, both of you!

Glad it worked for you.

I know that the answer is already sort of given a few years ago, but for the people using this as a reference the following code is much shorter and better to comprehend:

JFileChooser fd = new JFileChooser();
        fd.showSaveDialog(this);// TODO add your handling code here:
        File file = fd.getSelectedFile();

        Dimension size = drawPanel1.getSize();  //drawPanel1 == JPanel
        BufferedImage myImage =
                new BufferedImage(size.width, size.height,
                BufferedImage.TYPE_INT_RGB);
        Graphics2D g2 = myImage.createGraphics();
        drawPanel1.paint(g2);
        try {
            OutputStream out = new FileOutputStream(file + ".jpg");
            JPEGImageEncoder encoder = JPEGCodec.createJPEGEncoder(out);
            encoder.encode(myImage);
            out.close();
        } catch (Exception e) {
            System.out.println(e);
        }
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.