I have a big JPanel which holds many TileMapping objects (TileMapping extends JPanel). I want to zoom the big JPanel and all of its components to be scaled aswell. A TileMapping has an image which of course has to be zoomed as well.

here is my TileMapping class

public class TileMapping extends JPanel {

    private double zoom = 1.0;
    private Mapping mapping;
    private int height;
    private int width;
    private int xCoord;
    private int yCoord;

    TileMapping(Mapping m, int w, int h, int x, int y) {
        super();
        mapping = m;
        height = h;
        width = w;
        this.xCoord = x;
        this.yCoord = y;
        this.setPreferredSize(new Dimension(w, h));
    }

    public int getXcoord() {
        return xCoord;
    }

    public int getYcoord() {
        return yCoord;
    }

    public Mapping getMapping() {
        return mapping;
    }

    public void setMapping(Mapping m) {
        mapping = m;
    }

    public void originalSize() {
        zoom = 1;
    }

    public void zoomIn() {
        zoom += 0.2;
    }

    public void zoomOut() {
        zoom -= 0.2;
    }

    @Override
    public void paintComponent(Graphics g) {
        Graphics2D g2d = (Graphics2D) g;
        if (mapping.getImage() != null) {
            BufferedImage bg = mapping.getImage();
            g2d.scale(zoom, zoom);
            g2d.drawImage(bg, 0, 0, width, height, this);
        } else {
            g2d.scale(zoom, zoom);
            this.setBackground(Color.white);
        }

    }
}

I need to know how i should continue this on the main JPanel which is populated using this code: This is part of a MapWindow class. if you carefully read the code you will understand what i'm talking about. Basically this is a Tile MapEditor and I am simulating a Tile as a JPanel which holds the mapping object (mapping is a binding between an ASCII character and an image) you place.

private void populateMapPanel(Map map) {
        GridBagConstraints c = new GridBagConstraints();
        mapPanel.setLayout(new GridBagLayout());

        for (int i = 0; i < map.getMapGrid().getRows(); i++) {
            for (int j = 0; j < map.getMapGrid().getColumns(); j++) {
                tile = new TileMapping(map.getMapItem(i, j), cellSize, cellSize, i, j);
                tile.setBorder(new LineBorder(Color.black));
                tile.addMouseListener(this);
                tile.addMouseMotionListener(this);
                c.gridx = i;
                c.gridy = j;
                mapPanel.add(tile, c);
            }
        }
        mapPanel.validate();
        mapPanel.repaint();
    }

I need to know how to do the following: 1. When the user presses Zoom In the mapPanel should zoom in and also all the images in the smaller panels. 2. when the user click and drag over the TileMappings an image should be painted on them and this image should get scaled of course if the mapPanel is zoomed.

Pseudo code, ideas, hints, java code ...anything would be helpful. Thank you