Java GridBagLayout : make component align to left

Question

I have this layout using GridBagLayout:

public class Example extends JFrame {
    public Example() {
        Border outline = BorderFactory.createLineBorder(Color.black);
        GridBagLayout gbl = new GridBagLayout();
        GridBagConstraints gbc = new GridBagConstraints();
        JPanel pane = new JPanel(gbl);

        gbc.weighty = 1.0;
        gbc.weightx = 1.0;

        JLabel unitLbl = new JLabel("Unit");
        unitLbl.setBorder(outline);
        gbc.gridx = 0;
        gbc.gridy = 0;
        gbc.ipadx = 30;
        gbc.ipady = 10;
        gbl.setConstraints(unitLbl, gbc);
        pane.add(unitLbl);

        JLabel typeLbl = new JLabel("Type");
        typeLbl.setBorder(outline);
        gbc.gridx = 0;
        gbc.gridy = 1;
        gbc.ipadx = 30;
        gbc.ipady = 10;
        gbl.setConstraints(typeLbl, gbc);
        pane.add(typeLbl);

        JTextField unitField = new JTextField();
        typeLbl.setBorder(outline);
        gbc.gridx = 1;
        gbc.gridy = 0;
        gbc.ipadx = 30;
        gbc.ipady = 10;
        gbl.setConstraints(unitField, gbc);
        pane.add(unitField);

        String[] type = {"All", "Verb", "Noun", "Adjective"};
        JComboBox<String> comboBox = new JComboBox<String>(type);
        gbc.gridx = 1;
        gbc.gridy = 1;
        gbc.ipadx = 30;
        gbc.ipady = 10;
        gbl.setConstraints(comboBox, gbc);
        pane.add(comboBox);


        add(pane, BorderLayout.CENTER);
        setSize(new Dimension(400, 300));
        getContentPane().setBackground(Color.WHITE);
        setVisible(true);
    }

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

In this example, when run, It seems that every component is at the center of the frame. But what I want is :

1. Two JLabel (unitLbl and typelbl) will be on the left of frame
2. JTextField and JComboBox will be on the right of two JLabel, respectively with a small distance between.
3. Moreover, I want to add a new JButton at location (3,0) of the grid, but the height of this location sum of two JLabel height. It means, this button height is on "two line".

How can I fix this code to achieve this goal ? Please help me.

Thanks :)

Answer 1

Something like this should do the trick:

import java.awt.BorderLayout;
import java.awt.Color;
import java.awt.Dimension;
import java.awt.GridBagConstraints;
import java.awt.GridBagLayout;
import java.awt.Insets;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;

import javax.swing.JButton;
import javax.swing.JComboBox;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JOptionPane;
import javax.swing.JPanel;
import javax.swing.JTextField;
import javax.swing.SwingUtilities;

public class Example extends JFrame {
    public Example() {
        GridBagLayout gbl = new GridBagLayout();
        GridBagConstraints gbc = new GridBagConstraints();
        JPanel pane = new JPanel(gbl);
        gbc.anchor = GridBagConstraints.WEST;

        JLabel unitLbl = new JLabel("Unit");
        gbc.gridx = 0;
        gbc.gridy = 0;
        gbc.insets = new Insets(3, 3, 3, 30);
        gbl.setConstraints(unitLbl, gbc);
        pane.add(unitLbl);

        JLabel typeLbl = new JLabel("Type");
        gbc.gridx = 0;
        gbc.gridy = 1;
        gbl.setConstraints(typeLbl, gbc);
        pane.add(typeLbl);

        gbc.weightx = 1.0;
        gbc.insets = new Insets(3, 3, 3, 3);

        JTextField unitField = new JTextField();
        gbc.gridx = 1;
        gbc.gridy = 0;
        gbc.fill = GridBagConstraints.BOTH;
        gbl.setConstraints(unitField, gbc);
        pane.add(unitField);

        String[] type = { "All", "Verb", "Noun", "Adjective" };
        JComboBox<String> comboBox = new JComboBox<String>(type);
        gbc.gridx = 1;
        gbc.gridy = 1;
        gbc.fill = GridBagConstraints.NONE;
        gbl.setConstraints(comboBox, gbc);
        pane.add(comboBox);

        final JButton someButton = new JButton("Click me");
        someButton.addActionListener(new ActionListener() {

            @Override
            public void actionPerformed(ActionEvent e) {
                JOptionPane.showMessageDialog(someButton, "You have clicked " + someButton.getText());
            }
        });

        gbc.gridx = 3;
        gbc.gridy = 0;
        gbc.gridheight = 2;
        gbc.fill = GridBagConstraints.VERTICAL;
        pane.add(someButton, gbc);
        add(pane, BorderLayout.CENTER);
        setSize(new Dimension(400, 300));
        getContentPane().setBackground(Color.WHITE);
        setVisible(true);
    }

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

• You need to use appropriately weightx/weighty (how is the extra horizontal/vertical space redistributed)
• Use the appropriate fill attribute (is the component stretched vertically/horizontally/both?)
• Use the appropriate anchor attribute (if the component is not stretched, or at least not in both direction, where should it be located within its cell)
• I usually prefer to use insets instead of padding, therefore, I prefer insets over ipadx/ipady (extra white-space should be added around the component or inside the component)

Answer 2

Some answers:

Put the anchor for unitlbl to WEST.

gbc.anchor = GridBagConstraints.WEST;

And the anchor for unitField to EAST.

gbc.anchor = GridBagConstraints.EAST;

And for the button:

JButton button = new JButton("Test");
gbc.fill = GridBagConstraints.VERTICAL;
gbc.gridx = 3;
gbc.gridy = 0;
gbc.gridwidth = 1;
gbc.gridheight = 2;
gbc.weighty = 1;
pane.add(button, gbc);

Answer 3

You want to use GridBagConsraints#anchor to define the position within the cell that you want to align the component to.

To allow a component to span over number of cells, you want to use GridBagConstraints#gridwidth and GridBagConstraints#gridheight (the default is 1)

public class TestLayout09 {

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

    public TestLayout09() {
        EventQueue.invokeLater(new Runnable() {
            @Override
            public void run() {
                try {
                    UIManager.setLookAndFeel(UIManager.getSystemLookAndFeelClassName());
                } catch (ClassNotFoundException ex) {
                } catch (InstantiationException ex) {
                } catch (IllegalAccessException ex) {
                } catch (UnsupportedLookAndFeelException ex) {
                }

                JFrame frame = new JFrame();
                frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
                frame.setLayout(new BorderLayout());
                frame.add(new LayoutPane());
                frame.setBackground(Color.WHITE);
                frame.pack();
                frame.setLocationRelativeTo(null);
                frame.setVisible(true);
            }

        });
    }

    public class LayoutPane extends JPanel {

        public LayoutPane() {
            Border outline = BorderFactory.createLineBorder(Color.black);
            setLayout(new GridBagLayout());
            GridBagConstraints gbc = new GridBagConstraints();

            // I'm not sure this really is what you want, but I may be mistaken
//            gbc.weighty = 1.0;
//            gbc.weightx = 1.0;

            JLabel unitLbl = new JLabel("Unit");
            unitLbl.setBorder(outline);
            gbc.gridx = 0;
            gbc.gridy = 0;
            gbc.ipadx = 30;
            gbc.ipady = 10;
            gbc.anchor = GridBagConstraints.WEST;
            add(unitLbl, gbc);

            JLabel typeLbl = new JLabel("Type");
            typeLbl.setBorder(outline);
            gbc.gridx = 0;
            gbc.gridy = 1;
            gbc.ipadx = 30;
            gbc.ipady = 10;
            add(typeLbl, gbc);

            JTextField unitField = new JTextField();
            typeLbl.setBorder(outline);
            gbc.gridx = 1;
            gbc.gridy = 0;
            gbc.ipadx = 30;
            gbc.ipady = 10;
            gbc.anchor = GridBagConstraints.EAST;
            add(unitField, gbc);

            String[] type = {"All", "Verb", "Noun", "Adjective"};
            JComboBox<String> comboBox = new JComboBox<String>(type);
            gbc.gridx = 1;
            gbc.gridy = 1;
            gbc.ipadx = 30;
            gbc.ipady = 10;
            add(comboBox, gbc);

            JButton btn = new JButton("Test");
            gbc.gridx = 3;
            gbc.gridy = 0;
            gbc.fill = GridBagConstraints.BOTH;
            gbc.gridheight = 2;
            add(btn, gbc);
        }
    }
}