How can you draw on an image?

[darrinps]

I have a JApplet that loads images from a jar file. This applet can scale the images, and move them left right, up and down. All this works fine today, but now I just want to be able to draw a line on top of the images and then erase it if needed.

How do I do this?

Currently, I have a the jpg images loaded into an Image, which is then converted to an ImageIcon, which is then used to create a JLabel, which is used to create a JScrollPane which finally gets added as a tab on a JTabbedPane.

I was told to use BufferedImage but that didn't help me. Here is what I have currently:

private void draw()
{
int nIndex = m_tabbedPane.getSelectedIndex();

//The images repeat so that is why the mod oper.
Image cached = cachedImages[ nIndex % fileList.length ];

int nHeight = cached.getHeight(m_tabbedPane);
int nWidth = cached.getWidth(m_tabbedPane);

Image image = cached;

BufferedImage bi = new BufferedImage(image.getWidth(null),
image.getHeight(null),
BufferedImage.TYPE_INT_RGB);

Graphics2D g2 = bi.createGraphics();
g2.drawImage(image, 0, 0, this);

//Tried it both with and without this line
g2.drawImage(bi, null, 0, 0);

g2.setColor(Color.white);
g2.setStroke(new BasicStroke(5.0f));

g2.drawLine(10, 10, 300, 300);


//I use this to test and make sure I have the
//correct image..if it scales, I have the right one
//and yes it scales just fine.
image = image.getScaledInstance(100,
100,
java.awt.Image.SCALE_SMOOTH);


ImageIcon newIcon = new ImageIcon(image);

//Now put the image back into the tabbed pane
JScrollPane jsp = (JScrollPane)m_tabbedPane.getComponentAt(nIndex);

JViewport port = jsp.getViewport();

GrabAndScrollLabel gnsLabel = (GrabAndScrollLabel) port.getView();

gnsLabel.setIcon(newIcon);

port.setView(gnsLabel);

jsp.setViewport(port);

getRootPane().revalidate();
getRootPane().repaint();
}


Please help. I can't believe it has to be this difficult to draw a little line. BTW, I see the scale work just fine, it is only the line draw that I do not see.

Thanks!

[darrinps]

I have a little more insight into my problem.

I built a sample form Sun (the Map_Line sample). It looks like this:

public class Map_Line extends Applet
{
private BufferedImage bi;

public Map_Line()
{
setBackground(Color.white);

Image img = getToolkit().getImage("bld.jpg");

try
{
MediaTracker tracker = new MediaTracker(this);
tracker.addImage(img, 0);
tracker.waitForID(0);
}
catch (Exception e)
{
}

int iw = img.getWidth(this);
int ih = img.getHeight(this);
bi = new BufferedImage(iw, ih, BufferedImage.TYPE_INT_RGB);

Graphics2D big = bi.createGraphics();
big.drawImage(img, 0, 0, this);
}

public void paint(Graphics g)
{
Graphics2D g2 = (Graphics2D) g;
int w = getSize().width;
int h = getSize().height;
int bw = bi.getWidth(this);
int bh = bi.getHeight(this);

g2.drawImage(bi, null, 0, 0);
g2.setColor(Color.white);
g2.setStroke(new BasicStroke(5.0f));
g2.drawLine(10, 10, bw - 10, bh - 10);
}

public static void main(String[] s)
{
WindowListener l = new WindowAdapter()
{
public void windowClosing(WindowEvent e)
{
System.exit(0);
}
};

Frame f = new Frame("Map_Line");
f.addWindowListener(l);
f.add("Center", new Map_Line());
f.pack();
f.setSize(new Dimension(350, 250));
f.show();
}
}

Note how the drawing is done in paint. This applet works just fine for me.

The difference is that I'm trying to use the BufferedImage to get my Graphics2D object where as this one gets it from paint (casts Graphics to Graphics2D).

This applet works just fine, but if you try to use the Graphics2D that comes back from the BufferedImage, it doesn't work!.

For example, if I create a member variable:
Graphics2D big;

And then in paint do this:

//Graphics2D g2 = (Graphics2D) g;
Grahics2D g2 = big;


It no longer works!

So, it looks like I need to use something other than the
BufferedImage.createGraphics() to get the Graphics2D object I need.

Does this seem right?

Thanks!

[darrinps]

OK, I've given up doing this outside of paint and now I get a drawing, but I need to be able to pull the redrawn image back out so I can put it into the right place (back into the scroll pane, on the tab...).

So how can I get the image back out after I do this:

private void draw()
{
JScrollPane jsp = (JScrollPane) m_tabbedPane.getSelectedComponent();
JViewport port = jsp.getViewport();
GrabAndScrollLabel gnsLabel = (GrabAndScrollLabel) port.getView();
ImageIcon ii = (ImageIcon) gnsLabel.getIcon();
Image tempImage = ii.getImage();

m_buffIm = new BufferedImage (tempImage.getWidth(null),
tempImage.getHeight(null),
BufferedImage.TYPE_INT_RGB);

Graphics2D big = m_buffIm.createGraphics();
big.drawImage(tempImage, 0, 0, this);

getRootPane().revalidate();
getRootPane().repaint();
}

public void paint(Graphics g)
{
super.paint(g);

Graphics2D g2 = (Graphics2D) g;

if(m_buffIm != null)
{
int w = getSize().width;
int h = getSize().height;
int bw = m_buffIm.getWidth(this);
int bh = m_buffIm.getHeight(this);

g2.drawImage(m_buffIm, null, 0, 0);
g2.setColor(Color.white);
g2.setStroke(new BasicStroke(5.0f));
g2.drawLine(10, 10, bw - 10, bh - 10);

That g2 holds a m_buffIM that has the image with the line through it, and I see it being displayed in the upper right hand corner, but I need to place it back into the label, on the scrollpane on the tab!

How do I get the image back?

Thanks.