Trying to display images in multiple JPanels

Question

I'm creating a program that features a grid of 12 JPanels. When the "add image" button is pressed, an image appears in the first JPanel in the grid and a counter is incremented by one. From then onwards, every time the "add image" is clicked again, an image would be added to the next JPanel. For some reason, the button only adds an image to the first JPanel and then stops working. Here's the code I've got so far.

public class ImageGrid extends JFrame {

static JPanel[] imageSpaces = new JPanel[12];
int imageCounter = 0;

ImageGrid() {
    this.setTitle("Image Grid");
    setSize(750, 750);
    setDefaultCloseOperation(EXIT_ON_CLOSE);

    JPanel p3 = new JPanel();
    p3.setLayout(new GridLayout(3, 4, 10, 5));
    p3.setBackground(Color.WHITE);
    p3.setOpaque(true);
    p3.setBorder(BorderFactory.createEmptyBorder(0, 5, 5, 5));

    for (int j = 0; j < imageSpaces.length; j++) {
        imageSpaces[j] = setImageSpace();

        p3.add(imageSpaces[j]);
    }

    MyButtonPanel p1 = new MyButtonPanel();

    add(p1, BorderLayout.SOUTH);
    add(p3, BorderLayout.CENTER);

}

public JPanel setImageSpace() {

    JPanel test;
    test = new JPanel();
    test.setOpaque(true);
    test.setPreferredSize(new Dimension(100, 100));
    return test;
}

class MyButtonPanel extends JPanel implements ActionListener {

    final JButton addImage = new JButton("Add Image");

    ImageIcon lorryPicture = new ImageIcon(ImageGrid.class.getResource("/resources/lorry.png"));
    JLabel lorryImage = new JLabel(lorryPicture);

    MyButtonPanel() {
        add(addImage);
        addImage.addActionListener(this);
    }

    public void actionPerformed(ActionEvent e) {

        if (e.getSource() == addImage) {
            imageSpaces[imageCounter].add(lorryImage);
            revalidate();
            repaint();
            imageCounter++;
        }
    }
}
public static void main(String[] args) {

    ImageGrid test = new ImageGrid();
    test.setVisible(true);
}
}

1) For better help sooner, post an [MCVE](http://stackoverflow.com/help/mcve) (Minimal Complete and Verifiable Example). That example would require imports and two images. 2) One way to get image(s) for an example is to hot-link to the images seen in [this answer](http://stackoverflow.com/a/19209651/418556). — Andrew Thompson, Apr 10 '14 at 15:28
`imageSpaces[imageCounter].add(lorryImage);` Where does the code ever load a *different* image? — Andrew Thompson, Apr 10 '14 at 15:31
I've only used one image to try and keep the code to a minimum, so for this program I was just trying to add the same image into each JPanel. I presumed that as the counter incremented, the same image would be added to the next JPanel within the imageSpaces Array. However this isn't working. — user3120540, Apr 10 '14 at 15:59

Paul Samsotha · Accepted Answer · 2014-04-10T16:20:22.477

You should be revalidating and repainting the panel, (which is the containter being affected by the addition), not the frame

imageSpaces[imageCounter].add(lorryImage);
imageSpaces[imageCounter].revalidate();
imageSpaces[imageCounter].repaint();

Diclaimer: This may work as a simple fix, but also note that a component (in this case your JLabel lorryImage) can only have one parent container. The reason the above fix still works is because you don't revalidate and repaint the previous panel, the label was added to. So you may want to think about doing it correctly, and adding a new JLabel to each panel.

if (e.getSource() == addImage) {
    JLabel lorryImage = new JLabel(lorryPicture);
    imageSpaces[imageCounter].add(lorryImage);
    imageSpaces[imageCounter].revalidate();
    imageSpaces[imageCounter].repaint();
    imageCounter++;
}

Disclaimer 2: You should add a check, to only add a label if the count is less than the array length, as to avoid the ArrayIndexOutOfBoundsException

Side Notes

Swing apps should be run from the Event Dispatch Thread (EDT). You can do this by wrapping the code in the main in a SwingUtilities.invokeLater(...). See more at Initial Threads
You could also just use a JLabel and call setIcon, instead of using a JPanel

Thanks! i'll take note of your advice. – user3120540 Apr 10 '14 at 16:31 — user3120540, Apr 10 '14 at 16:31

Trying to display images in multiple JPanels

1 Answers1