trouble with GridBagLayout and panels

Question

So what I am trying to do is create this:

I am using a gridbag layout and here is what I have so far:

public class board {
public static void addComponentsToPane(Container pane) {
    pane.setLayout(new GridBagLayout());
    GridBagConstraints c = new GridBagConstraints();

    JPanel leftTop = new JPanel();
    leftTop.setPreferredSize(new Dimension(251,300));
    leftTop.setBackground(Color.black);
    c.fill = GridBagConstraints.HORIZONTAL;
    c.gridx = 0;
    c.gridy = 0;

    pane.add(leftTop, c);

    JPanel middleTop = new JPanel();
    middleTop.setPreferredSize(new Dimension(251,200));
    middleTop.setBackground(Color.green);
    c.fill = GridBagConstraints.HORIZONTAL;
    c.gridx = 1;
    c.gridy = 0;

    pane.add(middleTop, c);

    JPanel rightTop = new JPanel();
    rightTop.setPreferredSize(new Dimension(251,600));
    rightTop.setBackground(Color.blue);
    c.fill = GridBagConstraints.HORIZONTAL;
    c.gridx = 2;
    c.gridy = 0;

    pane.add(rightTop, c);

    JPanel leftBottom = new JPanel();
    leftBottom.setPreferredSize(new Dimension(251,300));
    leftBottom.setBackground(Color.red);
    c.fill = GridBagConstraints.HORIZONTAL;
    c.gridx = 0;
    c.gridy = 1;

    pane.add(leftBottom, c);

    JPanel middleBottom = new JPanel();
    middleBottom.setPreferredSize(new Dimension(251,400));
    middleBottom.setBackground(Color.yellow);
    c.fill = GridBagConstraints.HORIZONTAL;
    c.gridx = 1;
    c.gridy = 1;

    pane.add(middleBottom, c);
}

private static void createAndShowGUI() {
    JFrame frame = new JFrame("GridBagLayoutDemo");
    frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

    addComponentsToPane(frame.getContentPane());

    frame.pack();
    frame.setVisible(true);
}

public static void main(String[] args) {
    javax.swing.SwingUtilities.invokeLater(new Runnable() {
        public void run() {
            createAndShowGUI();
        }
    });
}
}

It creates something like:

How would I push up the panels so they are touching each other like in my first picture. I looked through the GridBagConstraints but I could not find anything that looked like it would work. Thanks!

Answer 1

Instead of trying to solve the complete layout problem with one layout manager, it's often simpler to nest layouts. For example, your example code could be modified to use a horizontal grid layout (to keep the columns equal width - I don't actually know if you want to force that. If not, then FlowLayout or BoxLayout would be better), and the columns use a BoxLayout each:

import java.awt.Color;
import java.awt.Container;
import java.awt.Dimension;
import java.awt.GridLayout;

import javax.swing.BoxLayout;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.SwingUtilities;

public class board {
    public static void addComponentsToPane(Container pane) {
        pane.setLayout(new GridLayout(1, 0));

        JPanel left = new JPanel();
        pane.add(left);
        left.setLayout(new BoxLayout(left, BoxLayout.Y_AXIS));

        JPanel leftTop = new JPanel();
        leftTop.setPreferredSize(new Dimension(125, 150));
        leftTop.setBackground(Color.black);
        left.add(leftTop);

        JPanel leftBottom = new JPanel();
        leftBottom.setPreferredSize(new Dimension(125, 150));
        leftBottom.setBackground(Color.red);
        left.add(leftBottom);

        JPanel middle = new JPanel();
        pane.add(middle);
        middle.setLayout(new BoxLayout(middle, BoxLayout.Y_AXIS));

        JPanel middleTop = new JPanel();
        middleTop.setPreferredSize(new Dimension(125, 100));
        middleTop.setBackground(Color.green);
        middle.add(middleTop);

        JPanel middleBottom = new JPanel();
        middleBottom.setPreferredSize(new Dimension(125, 200));
        middleBottom.setBackground(Color.yellow);
        middle.add(middleBottom);

        JPanel right = new JPanel();
        right.setPreferredSize(new Dimension(125, 300));
        right.setBackground(Color.blue);

        pane.add(right);
    }

    private static void createAndShowGUI() {
        JFrame frame = new JFrame("GridBagLayoutDemo");
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

        addComponentsToPane(frame.getContentPane());
        frame.pack();
        frame.setVisible(true);
    }

    public static void main(String[] args) {
        SwingUtilities.invokeLater(new Runnable() {
            @Override
            public void run() {
                createAndShowGUI();
            }
        });
    }
}

Results in:

(I modified the preferred sizes a bit to make the image smaller. As a further note it's usually better to override getPreferredSize() rather than use setPreferredSize(); setPreferredSize() is convenient for the quick example though)