Is this possible to do?

[colin shuker]

Hi, is it possible to draw an image inside a JPanel or something similar, then draw over it with say a circle, and then get a circle to move over the image without repainting the image.

Thanks for any help

[Craig Wood]

Yes. One easy way is to use a non–opaque cover component in an OverlayLayout.

JPanle panel = new JPanel();
OverlayLayout overlay = new OverlayLayout(panel);
panel.setLayout(overlay);
panel.add(nonOpaqueCover);  // maybe reversed
panel.add(imageComponent);  // order here

You can draw on the overlay component, move the graphics with mouse code or animation code.
Another way, with j2se 1.5+, is to use a Container and set the z-order on the components.
You would use a null layout and position the components with setBounds.
Another is to use a JLayeredPane which supports z–order.

[Ilja Preuss]

Note that Swing actually *will* need to repaint (parts of) the image with that solution.

[colin shuker]

Excellent, I tried it and it works.

I'm not sure I can apply double buffering though using this method, since for double buffering I need to draw a picture into an Image/BufferedImage's getGrapics() object which will be rectangular.

Then inside the JPanel which needs to be drawn above the background, I need to paint this image to screen through its paintComponent(Graphics g) method.

Then for the background, I have a separate class extending JPanel,
where the paintComponent method uses drawImage to draw the background image.

So basically, when I set up the double buffering:

offscreen=new BufferedImage(500,500,BufferedImage.TYPE_INT_RGB);
bufferGraphics=(Graphics2D)(offscreen.getGraphics());

The offscreen BufferedImage is initially a black square, so using bufferGraphics.drawImage(...) will draw a black square(+whats inside square), which won't work the same as just drawing a circle on screen on top of the old background.

Any ideas?
Thanks

[Craig Wood]

I feel like I don't have a clear understanding of your question so I'll try restating.
You are considering using a BufferedImage to draw in the paintComponent method of the top/overlay component. In this BufferedImage you want to draw a circle.
If this is correct and all you want to do is to move the circle around in the component you could eliminate the BufferedImage and draw the circle directly in the paintComponent method. Swing uses double buffering by default. So using a single component, drawing the background image and drawing the (moving) circle above it will be double buffered. Only the parts of the background image that had parts of the circle drawn above it in the last animation frame will need to be redrawn. The same applies to the overlay scheme, bits of the background that were covered/re-exposed will be redrawn.
Using double buffering may not be necessary.
Back to the question of how to make a BufferedImage that will only show a circle you can try something like this (pseudo)

int w = 75;
int h = 75;
int type = BufferedImage.INT_ARGB_PRE;
BufferedImage topImage = new BufferedImage(w, h, type);
Graphics2D g2 = topImage.creatGraphics();
g2.setRenderingHint(...
// You should have a transparent background at this point.
g2.setPaint(Color.red);
g2.fill(circle);
g2.dispose();

If you want to use BufferedImage.TYPE_INT_ARGB you can try

g2.setBackground(new Color(0,0,0,0);   // transparent color
g2.clearRect(0,0,w,h);
// setPaint and draw ellipse as before.

BufferedImage graphics has a default color of black so you have to fill in the background with the color you want.

[colin shuker]

Thanks, I'll try and explain my problem...

I have an applet
foto cube
It is signed, but thats just so you can save and load cubes.

Anyway the cube, uses double-buffering and is on a blue background...
(Just using 1 JPanel, no OverlayLayout here)

IN CONSTRUCTOR OF JPANEL:
offscreen=new BufferedImage(450,450,BufferedImage.TYPE_INT_ARGB);
bufferGraphics=(Graphics2D)(offscreen.getGraphics());
 

public void paintComponent(Graphics g)
{
    super.paintComponent(g);
    bufferGraphics.setRenderingHint(RenderingHints.KEY_STROKE_CONTROL,
            RenderingHints.VALUE_STROKE_PURE);
    bufferGraphics.clearRect(0,0,500,500);
    bufferGraphics.setColor(new Color(0x1E90FF)); // nice blue colour
    bufferGraphics.fillRect(0,0,500,500);
 
    bufferGraphics...(draw in rest of foto cube)
 
    g.drawImage(offscreen,0,0,this);
    g.dispose();
}

This works well... I noticed problems when I didn't use double buffering, there was some flickering when the cube was moving.

I noticed you can pass 'true' into the constructor to get double-buffering, but I don't think it worked when I tried is last.

My problem is:
Where I have the blue background(500 by 500), I would like to use an image/bufferedimage of the same size.

Clearly I can just put the line...

bufferGraphics.drawImage(background,0,0,this);

in above, but I tried this before, and it seemed to be a bit of a drag on the cpu which is already busy twisting and rotating the cube.

This is the reason I wanted to try and just paint the background image once(eg with OverlayLayout), then just repaint the cube on top.

The thing with a circle was just a test to see if I could do it, but its now got a bit confusing with all this doublebuffering stuff.

I'm not sure what the ideal solution to this is.
Hope this makes it clearer.

Thanks for any help