Translate/Rotate/Move a graphics object without messing up the whole screen

Question

I'm coding a GUI that will be doing some graphics translations/rotations, etc.

My problem is that when I try to translate my graphics,

(a) The entire screen translates instead of my one little painted area

(b) The old paint stays there, leaving a big paint blob instead of a translated image

(c) If I use the clearRect method to allow me to avoid (b), the entire screen goes white and (a) is still a problem

my DrawPanel class (I called it "LaunchTubeImage" for whatever reason)

private class LaunchTubeImage extends JPanel {

    private Color colour;


    public LaunchTubeImage(Color color) {
        super();
        this.colour = color;
    }

    public void paintComponent(Graphics g) {
        Graphics2D gg = (Graphics2D)g;
        double theta = (double)angle.getValue(); 
        theta = Math.toRadians(theta);
        gg.rotate(theta,tubeImage.getSize().width/2 + 10,
            tubeImage.getSize().height - 50);

        g.setColor(colour);

        g.clearRect(0,0,getWidth(),getHeight());
        g.fillRect(tubeImage.getSize().width/2,
            tubeImage.getSize().height - 100 , 10, 50);
    }
}

where this is called in my code

tubeImage = new LaunchTubeImage(Color.MAGENTA);


angle.addChangeListener(new ChangeListener(){
    public void stateChanged(ChangeEvent e) {
        tubeImage.repaint();
    }
});

Case 1: Comment out clearRect in that 1st block of code I posted

http://i58.tinypic.com/2d1l5w2_th.png Black background as desired. Not rotated yet. Looks good so far.

http://oi60.tinypic.com/1zw1sm.jpg Rotated it with my JSpinner... you see that the previous location was not removed (and note how my buttons randomly doubled and put themselves at the top of the screen).

Case 2: Keeping in the clearRect method

oi57.tinypic.com/2s84307.jpg Layout is fine so far, but I wanted the background to be black

oi57.tinypic.com/4rde8x.jpg Yay! It rotated. But note the weird behavior of that random "15" that appeared in my top right corner

oi58.tinypic.com/vymljm.jpg And finally... when I resize the window you see that my entire screen was rotated - not just the pink image I wanted to rotate

Tips/fixes/advice? Thanks!! I hope I've provided enough information (P.s. if you insist on us asking clear/useful questions.... then DON'T limit the number of images you can post... :/ )

Answer 1

The first line of an overridden paintComponent method should usually be super.paintComponent(g). On a JPanel, this will cause the drawing area to be cleared with the background color. If you want to clear the background with a different color, you can do this by manually filling a rectangle (clearRect is discouraged, see the JavaDoc), but of course, this has to be done before applying any transform.

So your method should probably look like this:

@Override 
protected void paintComponent(Graphics g) {
    super.paintComponent(g);

    g.setColor(colour);
    g.fillRect(0,0,getWidth(),getHeight());

    Graphics2D gg = (Graphics2D)g;

    double theta = (double)angle.getValue(); 
    theta = Math.toRadians(theta);
    gg.rotate(theta,tubeImage.getSize().width/2 + 10,tubeImage.getSize().height - 50);
    gg.fillRect(tubeImage.getSize().width/2,tubeImage.getSize().height - 100 , 10, 50);
}