Resizing Graphics2D Objects with JFrame Resize

Question

I am making a GUI that has Graphics2D objects drawn on a JPanel within a JFrame. When I resize the window the Graphics2D objects reduce into a tiny rectangle. How can I set the drawing to resize with the JFrame when the user resizes the window?

I have tried using gridlayout, flowlayout, borderlayout, and settled on gridbaglayout. This helps with the resizing of btnPanel and the JButton but not for the Graphics2D objects.

Here is my self contained example:

import javax.swing.*;
import java.awt.*;
import java.awt.event.ActionEvent;
import java.awt.event.MouseAdapter;
import java.awt.event.MouseEvent;
import java.awt.geom.Ellipse2D;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.Map;

public class DrawPanelMain extends JPanel {

    /*
    * Variables used to set the value of preferred height and width
    */
    public static final double version = 0.0;
    JPanel btnPanel = new JPanel();
    JPanel switchPanel = new JPanel();

    DrawEllipses drawEllipses = new DrawEllipses(POINT_LIST);

    public static void main(String[] args) {

        SwingUtilities.invokeLater(new Runnable() {
            public void run() {
                initializePointList();
                createAndShowGui();
            }
        });
    }

    public static java.util.List<Point> POINT_LIST = new ArrayList<>();

    /*
    * This loop will initialize POINT_LIST with the set of points for drawing the ellipses.
    * The for each loop initializes points for the top row and the second for loop draws the
    * right triangle.
    */
    public static void initializePointList() {

        int ellipsePointsYCoordinate[] = {140, 200, 260, 320, 380, 440, 500, 560, 620};
        int ellipsePointsXCoordinate[] = {140, 200, 260, 320, 380, 440, 500, 560, 620, 680};
        int xx = 80;

        for (int aXt : ellipsePointsXCoordinate) {
            POINT_LIST.add(new Point(aXt, xx));
        }

        for (int i = 0; i < ellipsePointsYCoordinate.length; i++) {
            for (int j = i; j < ellipsePointsYCoordinate.length; j++) {
                POINT_LIST.add(new Point(ellipsePointsXCoordinate[i], ellipsePointsYCoordinate[j]));
            }
        }
    }

    public DrawPanelMain() {

        switchPanel.setBorder(BorderFactory.createLoweredSoftBevelBorder());
        switchPanel.setBackground(Color.DARK_GRAY);
        switchPanel.add(drawEllipses);
        switchPanel.revalidate();

        setLayout(new GridBagLayout());
        GridBagConstraints c = new GridBagConstraints();

        // first column
        c.gridx = 0;
        add(switchPanel, c);

        // second column
        c.gridx = 1;
        add(switchPanel, c);

        // first row
        c.gridy = 0;

        // second row
        c. gridy = 1;
        add(btnPanel, c);

        btnPanel.add(new JButton(new AddSwitchAction("Add Switch Panel")));
    }

    public static void createAndShowGui() {

        JFrame frame = new JFrame("RF Connection Panel " + version);

        frame.setLayout(new BorderLayout());
        frame.add(new DrawPanelMain());
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        frame.setLocationByPlatform(false);
        //frame.setLocationRelativeTo(null);
        frame.pack();
        frame.setVisible(true);
    }

    /*
    * AddSwitchAction will add a new pane to the tabbedPane when the add switch button is clicked
    */
    private class AddSwitchAction extends AbstractAction {
        public AddSwitchAction(String name) {
            super(name);
            int mnemonic = (int) name.charAt(0);
            putValue(MNEMONIC_KEY, mnemonic);
        }

        @Override
        public void actionPerformed(ActionEvent e) {
            String title = "Switch ";
            DrawEllipses tabComponent = new DrawEllipses(POINT_LIST);
            switchPanel.add(title, tabComponent);

        }
    }

}

@SuppressWarnings("serial")
class DrawEllipses extends JPanel {
    private final int PREF_W = 750; //Window width
    private final int PREF_H = 750; //Window height
    private final int OVAL_WIDTH = 30;
    private static final Color INACTIVE_COLOR = Color.RED;
    private static final Color ACTIVE_COLOR = Color.green;
    private java.util.List<Point> points;
    private java.util.List<Ellipse2D> ellipses = new ArrayList<>();
    private Map<Ellipse2D, Color> ellipseColorMap = new HashMap<>();

    /*
     * This method is used to populate "ellipses" with the initialized ellipse2D dimensions
     */
    public DrawEllipses(java.util.List<Point> points) {
        this.points = points;
        for (Point p : points) {
            int x = p.x - OVAL_WIDTH / 2;
            int y = p.y - OVAL_WIDTH / 2;
            int w = OVAL_WIDTH;
            int h = OVAL_WIDTH;
            Ellipse2D ellipse = new Ellipse2D.Double(x, y, w, h);
            ellipses.add(ellipse);
            ellipseColorMap.put(ellipse, INACTIVE_COLOR);
        }

        MyMouseAdapter mListener = new MyMouseAdapter();
        addMouseListener(mListener);
        addMouseMotionListener(mListener);
    }

    /*
     * paintComponent is used to paint the ellipses
     */
    @Override
    protected void paintComponent(Graphics g) {
        super.paintComponent(g);
        Graphics2D g2 = (Graphics2D) g;
        g2.setRenderingHint(RenderingHints.KEY_ANTIALIASING,
                RenderingHints.VALUE_ANTIALIAS_ON);
        for (Ellipse2D ellipse : ellipses) {
            g2.setColor(ellipseColorMap.get(ellipse));
            g2.fill(ellipse);
            g2.setColor(Color.BLACK);
            g2.setStroke(new BasicStroke(2));
            g2.draw(ellipse);
        }

        /*
         * Set the font characteristics, color, and draw the row labels.
         */
        g.setFont(new Font("TimesRoman", Font.BOLD, 18));
        g.setColor(Color.BLACK);

        //Along the top row
        g.drawString("External Port", 10, 50);
        g.drawString("1", 135, 50);
        g.drawString("2", 195, 50);
        g.drawString("3", 255, 50);
        g.drawString("4", 315, 50);
        g.drawString("5", 375, 50);
        g.drawString("6", 435, 50);
        g.drawString("7", 495, 50);
        g.drawString("8", 555, 50);
        g.drawString("9", 615, 50);
        g.drawString("10", 672, 50);

        //Along the Y-axis
        g.drawString("Radio 2", 40, 145);
        g.drawString("3", 90, 205);
        g.drawString("4", 90, 265);
        g.drawString("5", 90, 325);
        g.drawString("6", 90, 385);
        g.drawString("7", 90, 445);
        g.drawString("8", 90, 505);
        g.drawString("9", 90, 565);
        g.drawString("10", 90, 625);

        //Along the X-Axis
        g.drawString("1", 135, 670);
        g.drawString("2", 195, 670);
        g.drawString("3", 255, 670);
        g.drawString("4", 315, 670);
        g.drawString("5", 375, 670);
        g.drawString("6", 435, 670);
        g.drawString("7", 495, 670);
        g.drawString("8", 555, 670);
        g.drawString("9", 615, 670);

        //Draws a 3DRect around the top row of ellipse2D objects
        g2.setColor(Color.lightGray);
        g2.draw3DRect(120, 60, 580, 40, true);
        g2.draw3DRect(121, 61, 578, 38, true);
        g2.draw3DRect(122, 62, 576, 36, true);

    }

    /*
     * MouseAdapter is extended for mousePressed Event that detects if the x, y coordinates
     * of a drawn ellipse are clicked.  If the color is INACTIVE it is changed to ACTIVE and
     * vice versa.
     */
    private class MyMouseAdapter extends MouseAdapter {
        @Override
        /*
         * When mousePressed event occurs, the color is toggled between ACTIVE and INACTIVE
         */
        public void mousePressed(MouseEvent e) {
            Color c;
            for (Ellipse2D ellipse : ellipses) {
                if (ellipse.contains(e.getPoint())) {
                    c = (ellipseColorMap.get(ellipse) == INACTIVE_COLOR) ? ACTIVE_COLOR : INACTIVE_COLOR;
                    ellipseColorMap.put(ellipse, c);
                }
            }
            repaint();
        }
    }

    /*
* This method will set the dimensions of the JFrame equal to the preferred H x W
*/
    @Override
    public Dimension getPreferredSize() {
        if (isPreferredSizeSet()) {
            return super.getPreferredSize();
        }
        return new Dimension(PREF_W, PREF_H);
    }


    /*
     * Used for button click action to change all ellipses to ACTIVE_COLOR
     */
    public void activateAll(){
        for (Ellipse2D ellipse : ellipses){
            ellipseColorMap.put(ellipse, ACTIVE_COLOR);
        }
        repaint();
    }

    /*
     * Used for button click action to change all ellipses to INACTIVE_COLOR
     */
    public void deactivateAll(){
        for (Ellipse2D ellipse : ellipses){
            ellipseColorMap.put(ellipse, INACTIVE_COLOR);
        }
        repaint();
    }
}

Answer 1

Try adding your 2D object to a JLabel as BufferedImage of ImageIcon. You can do this by:

JLabel label2 = new JLabel(new ImageIcon(//Location of your Image);

Or I think you can also add Graphics2D objects directly creating them inside label bu I'm not sure about that

Answer 2

This method will set the dimensions of the JFrame equal to the preferred H x W

No it set the preferred size of the panel. The size of the frame will be the preferred size of all the components added to it plus the frame decorations (title bar, borders).

When I resize the window the Graphics2D objects reduce into a tiny rectangle.

The GridBagLayout respects the preferred size of the component. When there is not enough space to display the component it will shrink to its "minimum size".

You probably need to override the getMinimumSize() method to equal the preferred size. Then in this case the component should just be truncated if space is not available.

If you want you actually painting to shrink then you need to build the logic into your painting code so that the painting is done relative to the space available on the panel.