Java GridBagLayout

Question

I've been tasked with designing a basic UI in Java using Swing but I'm stuck with laying it out. I want to create something similar to this but my attempts at using GridBagLayout have resulted in something very messy. Can anyone offer some tips on how I can lay out my GUI like this?

I have a JTabbedPane to which I add two tabs, and to each of those two tabs I add a JPanel containing my controls.

Answer 1

Here's some code...I couldn't get the JTextFields to display correctly so you'll have to fix that.

Main:

    import javax.swing.SwingUtilities;

public class Main {

    public static void main(String [] args) {

        SwingUtilities.invokeLater(new Runnable() {

            @Override
            public void run() {

                Panel panel = new Panel();
            }

        });

    }

}

Panel:

import java.awt.GridBagConstraints;
import java.awt.GridBagLayout;

import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPanel;
import javax.swing.JTable;
import javax.swing.JTextField;

public class Panel extends JPanel{

    private JFrame frame; 

    private JLabel label1;
    private JLabel label2; 
    private JLabel label3;

    private JTextField textField1;
    private JTextField textField2;
    private JTextField textField3;

    private JButton button1;
    private JButton button2;
    private JButton button3;

    private JTable table;


    public Panel() {

        label1 = new JLabel("label1");
        label2 = new JLabel("label2");
        label3 = new JLabel("label3");

        textField1 = new JTextField("textField1", 20);
        textField2 = new JTextField("textField2", 20);
        textField3 = new JTextField("textField3", 100);

        button1 = new JButton("Hello");
        button2 = new JButton("Goodbye");
        button3 = new JButton("Love");

        table = new JTable(20,20);

        frame = new JFrame("My application");
        frame.setSize(1000, 1000);
        frame.setDefaultCloseOperation(frame.EXIT_ON_CLOSE);
        frame.setVisible(true);
        this.setOpaque(true);

        setLayout(new GridBagLayout());

        GridBagConstraints gc = new GridBagConstraints();

        gc.weightx = 1;
        gc.weighty =1;
        gc.fill = GridBagConstraints.NONE;

        gc.gridx = 0;
        gc.gridy = 0;
    //  gc.anchor = GridBagConstraints.WEST;
        add(label1, gc);

        gc.gridx = 2;
        gc.gridy = 0;
        //gc.anchor = GridBagConstraints.EAST;
        add(textField1, gc);

        gc.gridx = 0;
        gc.gridy = 1;

        //gc.anchor = GridBagConstraints.WEST;
        add(label2, gc);

        gc.gridx = 2;
        gc.gridy = 1;
        //gc.anchor = GridBagConstraints.EAST;
        add(textField2, gc);

        gc.gridx = 0;
        gc.gridy = 2;
        //gc.anchor = GridBagConstraints.WEST;
        add(label3, gc);

        gc.gridx = 2;
        gc.gridy = 2;
        //gc.anchor = GridBagConstraints.EAST;
        add(textField3, gc);

        gc.gridx = 0;
        gc.gridy = 3;
        //gc.anchor = GridBagConstraints.WEST;
        add(button1, gc);

        gc.gridx = 1;
        gc.gridy = 3;
        gc.anchor = GridBagConstraints.CENTER;
        add(button2, gc);

        gc.gridx = 2;
        gc.gridy = 3;
    //  gc.anchor = GridBagConstraints.EAST;
        add(button3, gc);

        gc.gridx = 1;
        gc.gridy = 4;
        gc.anchor = GridBagConstraints.CENTER;
        add(table, gc);

        frame.add(this);
    }

}

Answer 2

There is a component, the JTable, that wants to occupy all the available space in the window. That means that a BorderLayout will be needed, with a JScrollPane that contains the JTable in the BorderLayout.CENTER of that BorderLayout. The other components will be inside another JPanel in the BorderLayout.PAGE_START

In this new JPanel, there is no component that needs to adjust its size vertically, so i don't see the necessity of a BorderLayout. I would compose it with a vertical BoxLayout. Insert in this panel two more, one GridBagLayout for the labels and text fields, and below one FlowLayout for the buttons, with center alignment and some horizontal gap. I prefer FlowLayout insetad of GridLayout for the buttons because if you resize the main panel, with a FlowLayout the buttons will keep the same distance between them.

Answer 3

Here's what I would recommend:

• Use a JPanel pTextBox with GridLayout(3, 2) to hold all of your labels + textboxes
• Use a JPanel pButtons with GridLayout(1, 3) or BoxLayout(horizontal) hold all of your buttons
• Use a JPanel pAll with BoxLayout(vertical) to hold pTextBox, pButtons and the Table.
• Use struts, glues, and min/max/prefererd sizes to adjust spacing / resizing behaviour.

Also check out: http://docs.oracle.com/javase/tutorial/uiswing/layout/visual.html to compare exactly what you are looking for.

Answer 4

I would recommend that

• the overall GUI use BorderLayout,
• the JTable be in a JScrollPane and this should be placed BorderLayout.CENTER.
• The top JPanel holding labels, fields, and buttons be placed BorderLayout.PAGE_START.
• The top JPanel also can use BorderLayout and can hold the buttons in the BorderLayout.PAGE_END position.
• The buttons would be held by a GridLayout(1, 0, x, 0) using JPanel where x is the gap between buttons
• The labels and JTextFields be in a JPanel that uses GridBagLayout and that is placed in the top JPanel in the BorderLayout.CENTER position.
• that you not follow these recommendations blindly but instead that you experiment with and play with different combinations of nested JPanels, each using its own layout.
• that you also check out this link