Trying to use a GridBagLayout to manage JPanels in Java

Question

I am currently making my first steps with GUIs and am right now just trying to make a JFrame with two JPanel containers according to my work of art here:

I chose the GridBagLayout since I want it to be resizeable later but keep the given proportions, yet I'm having a hard time understanding how all of this works.

My current code looks like this:

import java.awt.*;
import javax.swing.*;

public class MyFrame extends JFrame {

     private JPanel contentPane;
         
    public JPanel getContentPane() {
        return contentPane;
    }

    public void setContentPane(JPanel contentPane) {
        this.contentPane = contentPane;
    }

    public MyFrame (){

        contentPane = new JPanel();
        contentPane.setLayout(new GridBagLayout());
        GridBagConstraints gbc = new GridBagConstraints();

        gbc.gridx = 0;
        gbc.gridy = 0;
        gbc.gridwidth = 2;
        gbc.gridheight = 3;
        JPanel blue = new JPanel();
        blue.setBackground(Color.BLUE);

        contentPane.add(blue, gbc);


        gbc.gridx = 2;
        gbc.gridy = 0;
        gbc.gridwidth = 1;
        gbc.gridheight = 3;
        JPanel gruen = new JPanel();
        gruen.setBackground(Color.green);
        contentPane.add(gruen, gbc);

        this.setPreferredSize(new Dimension(630, 650));
        this.pack();
        this.setLocationRelativeTo(null);
        this.setDefaultCloseOperation(EXIT_ON_CLOSE);
        this.setVisible(true);
        this.setContentPane(contentPane);
    }

    public static void main(String[] args) {
        new MyFrame();
    }
}

Which gives me this empty window:

If someone could tell me what I'm doing wrong that would be great.

Answer 1

1. First of all, you need to remove this:

public JPanel getContentPane() {
    return contentPane;
}

public void setContentPane(JPanel contentPane) {
    this.contentPane = contentPane;
}

because you basically override the base logic of JFrame, hence you may (and likely will) break something.

2. The second thing is that putting component to the grid cells with constraints does not automatically stretch them across the area. If to refer to the documentation, you will see that:

Essentially, GridBagLayout places components in rectangles (cells) in a grid, and then uses the components' preferred sizes to determine how big the cells should be.

3. Automatic stretching can be achieved with fill property of constraints. But you still need to declare the required sizes somehow.

4. The sizes specification can be set up with weightx and weighty properties of constraints.

Weights are used to determine how to distribute space among columns (weightx) and among rows (weighty); this is important for specifying resizing behavior.

So in your simple case you basically have two columns where one have 0.7 of x weight and another have 0.3.

The below code demonstrates the complete solution:

class MyFrame extends JFrame {

    private JPanel contentPane;

    public MyFrame (){
        contentPane = new JPanel();
        contentPane.setLayout(new GridBagLayout());

        GridBagConstraints gbc = new GridBagConstraints();
        gbc.gridx = 0;
        gbc.gridy = 0;
        gbc.gridwidth = 1;
        gbc.gridheight = 1;
        gbc.weightx = 0.2/0.3;
        gbc.weighty = 1;
        gbc.fill = GridBagConstraints.BOTH;
        JPanel blue = new JPanel();
        blue.setBackground(Color.BLUE);
        contentPane.add(blue, gbc);

        gbc.gridx = 1;
        gbc.gridy = 0;
        gbc.gridwidth = 1;
        gbc.gridheight = 1;
        gbc.weightx = 0.1/0.3;
        gbc.weighty = 1;
        JPanel green = new JPanel();
        green.setBackground(Color.green);
        contentPane.add(green, gbc);

        setContentPane(contentPane);
        setPreferredSize(new Dimension(630, 650));
        pack();
        this.setDefaultCloseOperation(EXIT_ON_CLOSE);
        this.setVisible(true);
    }

    public static void main(String[] args) {
        new MyFrame();
    }
}