How can I move the position of my Jcomponent after I click a button?

Question

So I want to change the position of an image which I implemented as a JComponent after I click the corresponding button, however, it does not do anything when getting clicked.

I think the problem may lay inside my paintComponent method, since I want the image to be drawn in the center of my panel in the beginning.

The panel itself has a GridBagLayout, although I think that anchoring it in the center would not help either, since I want to move the image whenever the button is clicked and only want it to show up in the center of the panel when I open the frame...

For this button in particular I want my JComponent/image to move 50 pixels to the right.

Anyway here's what I did:

@Override 
protected void paintComponent(Graphics g) {
    super.paintComponent(g);
    int x = (this.getWidth() - img.getWidth(null))/2;
    int y = (this.getHeight() - img.getHeight(null))/2;
    
    g.drawImage(img, x, y, null);
}

@Override
public void actionPerformed(ActionEvent e) {
    img.repaint(img.getX()+50, img.getY(), img.getHeight(), img.getWidth());
}

Answer 1

Currently, your paintComponent method always uses the same values for x and y, so it should come as no surprise that the image doesn’t move.

x and y are state that needs to be remembered. This is done by defining instance fields:

private int x;
private int y;

You can’t initialize them at construction time, because a component has a width and height of zero when it’s created (usually). Fortunately, there is a method which tells you when a component has been given a width and height; that method is addNotify, which you can and should override:

@Override
public void addNotify() {
    super.addNotify();

    x = (this.getWidth() - img.getWidth(this)) / 2;
    y = (this.getHeight() - img.getHeight(this)) / 2; 
}

Notice that you should pass this (your component instance) to any method which expects an ImageObserver argument, rather than null.

Now paintComponent doesn’t need to do any calculation. It just paints the image at whatever x and y happen to be:

@Override
protected void paintComponent(Graphics g) {
    super.paintComponent(g);
    g.drawImage(img, x, y, this);
}

And now that your coordinates are instance fields, you can change them directly:

@Override
public void actionPerformed(ActionEvent event) {
    x += 50;
    repaint();
}