Center components inside JPanel using GridBagLayout

Question

I am trying to center some components inside a JPanel, everything works when I press "Test Layout" inside "Customize Layout" option of JPanel's GridBagLayout, but it looks different when I run the program.

It should look like this:

Instead, when I run the program, it looks like this:

The program is structured like this:

So there are two problems:

The password field is larger than the email address field. I have tried setting minimum, maximum and preferred size to (14, 22) to both of them but it doesn't work.
Why are the buttons separated and how can I make them connect? (the right button has 0 left Inset)

Here is the initComponents() function:

private void initComponents()
    {
        java.awt.GridBagConstraints gridBagConstraints;

        jPanel1 = new javax.swing.JPanel();
        loginButton = new javax.swing.JButton();
        signUpLabel = new javax.swing.JLabel();
        emailTextField = new javax.swing.JTextField();
        passwordField = new javax.swing.JPasswordField();
        star1 = new javax.swing.JLabel();
        star2 = new javax.swing.JLabel();
        loginToggleButton = new javax.swing.JToggleButton();
        signUpToggleButton = new javax.swing.JToggleButton();

        setDefaultCloseOperation(javax.swing.WindowConstants.EXIT_ON_CLOSE);

        jPanel1.setBackground(new java.awt.Color(42, 46, 55));
        jPanel1.setLayout(new java.awt.GridBagLayout());

        loginButton.setFont(new java.awt.Font("Dialog", 1, 14)); // NOI18N
        loginButton.setText("Login");
        loginButton.addActionListener(new java.awt.event.ActionListener()
        {
            public void actionPerformed(java.awt.event.ActionEvent evt)
            {
                loginButtonActionPerformed(evt);
            }
        });
        gridBagConstraints = new java.awt.GridBagConstraints();
        gridBagConstraints.gridx = 0;
        gridBagConstraints.gridy = 5;
        gridBagConstraints.gridwidth = 2;
        gridBagConstraints.ipadx = 42;
        gridBagConstraints.ipady = 14;
        gridBagConstraints.anchor = java.awt.GridBagConstraints.NORTHWEST;
        gridBagConstraints.insets = new java.awt.Insets(79, 116, 0, 0);
        jPanel1.add(loginButton, gridBagConstraints);

        signUpLabel.setFont(new java.awt.Font("Dialog", 1, 13)); // NOI18N
        signUpLabel.setText("Don't have an account?");
        signUpLabel.setPreferredSize(new java.awt.Dimension(149, 12));
        signUpLabel.addMouseListener(new java.awt.event.MouseAdapter()
        {
            public void mouseClicked(java.awt.event.MouseEvent evt)
            {
                signUpLabelMouseClicked(evt);
            }
            public void mouseEntered(java.awt.event.MouseEvent evt)
            {
                signUpLabelMouseEntered(evt);
            }
            public void mouseExited(java.awt.event.MouseEvent evt)
            {
                signUpLabelMouseExited(evt);
            }
        });
        gridBagConstraints = new java.awt.GridBagConstraints();
        gridBagConstraints.gridx = 0;
        gridBagConstraints.gridy = 6;
        gridBagConstraints.gridwidth = 3;
        gridBagConstraints.anchor = java.awt.GridBagConstraints.NORTHWEST;
        gridBagConstraints.insets = new java.awt.Insets(18, 100, 42, 0);
        jPanel1.add(signUpLabel, gridBagConstraints);

        emailTextField.setMaximumSize(new java.awt.Dimension(14, 22));
        emailTextField.setMinimumSize(new java.awt.Dimension(14, 22));
        emailTextField.setPreferredSize(new java.awt.Dimension(14, 22));
        emailTextField.addFocusListener(new java.awt.event.FocusAdapter()
        {
            public void focusGained(java.awt.event.FocusEvent evt)
            {
                emailTextFieldFocusGained(evt);
            }
            public void focusLost(java.awt.event.FocusEvent evt)
            {
                emailTextFieldFocusLost(evt);
            }
        });
        gridBagConstraints = new java.awt.GridBagConstraints();
        gridBagConstraints.gridx = 0;
        gridBagConstraints.gridy = 1;
        gridBagConstraints.gridwidth = 6;
        gridBagConstraints.gridheight = 2;
        gridBagConstraints.ipadx = 199;
        gridBagConstraints.ipady = 10;
        gridBagConstraints.anchor = java.awt.GridBagConstraints.NORTHWEST;
        gridBagConstraints.insets = new java.awt.Insets(97, 70, 0, 0);
        jPanel1.add(emailTextField, gridBagConstraints);

        passwordField.setMaximumSize(new java.awt.Dimension(14, 22));
        passwordField.addFocusListener(new java.awt.event.FocusAdapter()
        {
            public void focusGained(java.awt.event.FocusEvent evt)
            {
                passwordFieldFocusGained(evt);
            }
            public void focusLost(java.awt.event.FocusEvent evt)
            {
                passwordFieldFocusLost(evt);
            }
        });
        passwordField.addActionListener(new java.awt.event.ActionListener()
        {
            public void actionPerformed(java.awt.event.ActionEvent evt)
            {
                passwordFieldActionPerformed(evt);
            }
        });
        gridBagConstraints = new java.awt.GridBagConstraints();
        gridBagConstraints.gridx = 0;
        gridBagConstraints.gridy = 3;
        gridBagConstraints.gridwidth = 6;
        gridBagConstraints.gridheight = 2;
        gridBagConstraints.ipadx = 199;
        gridBagConstraints.ipady = 10;
        gridBagConstraints.anchor = java.awt.GridBagConstraints.NORTHWEST;
        gridBagConstraints.insets = new java.awt.Insets(18, 70, 0, 0);
        jPanel1.add(passwordField, gridBagConstraints);

        star1.setForeground(new java.awt.Color(255, 0, 0));
        star1.setText("*");
        gridBagConstraints = new java.awt.GridBagConstraints();
        gridBagConstraints.gridx = 6;
        gridBagConstraints.gridy = 1;
        gridBagConstraints.anchor = java.awt.GridBagConstraints.NORTHWEST;
        gridBagConstraints.insets = new java.awt.Insets(106, 10, 0, 49);
        jPanel1.add(star1, gridBagConstraints);

        star2.setForeground(new java.awt.Color(255, 0, 0));
        star2.setText("*");
        gridBagConstraints = new java.awt.GridBagConstraints();
        gridBagConstraints.gridx = 6;
        gridBagConstraints.gridy = 3;
        gridBagConstraints.anchor = java.awt.GridBagConstraints.NORTHWEST;
        gridBagConstraints.insets = new java.awt.Insets(25, 10, 0, 49);
        jPanel1.add(star2, gridBagConstraints);

        loginToggleButton.setBackground(new java.awt.Color(0, 224, 208));
        loginToggleButton.setText("Log In");
        gridBagConstraints = new java.awt.GridBagConstraints();
        gridBagConstraints.gridx = 1;
        gridBagConstraints.gridy = 0;
        gridBagConstraints.gridwidth = 4;
        gridBagConstraints.ipadx = 34;
        gridBagConstraints.ipady = 8;
        gridBagConstraints.anchor = java.awt.GridBagConstraints.NORTHWEST;
        gridBagConstraints.insets = new java.awt.Insets(44, 0, 0, 0);
        jPanel1.add(loginToggleButton, gridBagConstraints);

        signUpToggleButton.setBackground(new java.awt.Color(48, 199, 32));
        signUpToggleButton.setText("Sign Up");
        signUpToggleButton.addActionListener(new java.awt.event.ActionListener()
        {
            public void actionPerformed(java.awt.event.ActionEvent evt)
            {
                signUpToggleButtonActionPerformed(evt);
            }
        });
        gridBagConstraints = new java.awt.GridBagConstraints();
        gridBagConstraints.gridx = 0;
        gridBagConstraints.gridy = 0;
        gridBagConstraints.ipadx = 25;
        gridBagConstraints.ipady = 8;
        gridBagConstraints.anchor = java.awt.GridBagConstraints.NORTHWEST;
        gridBagConstraints.insets = new java.awt.Insets(44, 80, 0, 0);
        jPanel1.add(signUpToggleButton, gridBagConstraints);

        javax.swing.GroupLayout layout = new javax.swing.GroupLayout(getContentPane());
        getContentPane().setLayout(layout);
        layout.setHorizontalGroup(
            layout.createParallelGroup(javax.swing.GroupLayout.Alignment.LEADING)
            .addComponent(jPanel1, javax.swing.GroupLayout.DEFAULT_SIZE, javax.swing.GroupLayout.DEFAULT_SIZE, Short.MAX_VALUE)
        );
        layout.setVerticalGroup(
            layout.createParallelGroup(javax.swing.GroupLayout.Alignment.LEADING)
            .addComponent(jPanel1, javax.swing.GroupLayout.PREFERRED_SIZE, javax.swing.GroupLayout.DEFAULT_SIZE, javax.swing.GroupLayout.PREFERRED_SIZE)
        );

        pack();
    }// </editor-fold>

1) *"Edited"* In your next edit, be sure to include an MCVE. An uncompilable code snippet is not an MCVE. An MCVE requires imports, a `main` method etc. - everything needed to put it on-screen. 2) See [Should I avoid the use of set(Preferred|Maximum|Minimum)Size methods in Java Swing?](http://stackoverflow.com/q/7229226/418556) (Yes.) To provide appropriate size hints to a layout manager, one might set the number of columns for a text field. — Andrew Thompson, Aug 16 '18 at 07:24

camickr · Answer 1 · 2018-08-15T15:01:49.413

Don't use setPreferredSize().

Each Swing component will determine its own size based on the properties of the component. In many cases this will be based on the text of the component.

For text fields that don't have default text you should create the components like:

//emailTextField = new javax.swing.JTextField();
//passwordField = new javax.swing.JPasswordField();
emailTextField = new javax.swing.JTextField(20);
passwordField = new javax.swing.JPasswordField(10);

So the component can determine its preferred size to display 20/10 characters. (It actually sizes itself to display "W" characters).

Also, there is generally no need to set the min/max size of the component as GridBagLayout will repect the preferred size unless you fill the cell.

Najmaoui Yassir · Answer 2 · 2018-08-15T11:51:07.670

Have you tried to use a different gridBagConstraints variable? As not doing so for two different components might cause some problems.

public class TestStack {
private static JTextField txtOne;
private static JTextField txtTwo;

public static void main(String[] args) {
    JFrame frame = new JFrame();
    GridBagLayout gridBagLayout = new GridBagLayout();
    gridBagLayout.columnWidths = new int[]{0, 0};
    gridBagLayout.rowHeights = new int[]{0, 0, 0, 0};
    gridBagLayout.columnWeights = new double[]{1.0, Double.MIN_VALUE};
    gridBagLayout.rowWeights = new double[]{0.0, 0.0, 0.0, Double.MIN_VALUE};
    frame.getContentPane().setLayout(gridBagLayout);

    txtOne = new JTextField();
    txtOne.setHorizontalAlignment(SwingConstants.CENTER);
    txtOne.setText("one");
    GridBagConstraints gbc_txtOne = new GridBagConstraints();
    gbc_txtOne.insets = new Insets(0, 0, 5, 0);
    gbc_txtOne.gridx = 0;
    gbc_txtOne.gridy = 0;
    frame.getContentPane().add(txtOne, gbc_txtOne);
    txtOne.setColumns(10);

    txtTwo = new JTextField();
    txtTwo.setHorizontalAlignment(SwingConstants.CENTER);
    txtTwo.setText("twodwqadadsadasdsa");
    GridBagConstraints gbc_txtTwo = new GridBagConstraints();
    gbc_txtTwo.insets = new Insets(0, 0, 5, 0);
    gbc_txtTwo.gridx = 0;
    gbc_txtTwo.gridy = 1;
    frame.getContentPane().add(txtTwo, gbc_txtTwo);
    txtTwo.setColumns(10);

    JLabel lblThree = new JLabel("three");
    lblThree.setHorizontalAlignment(SwingConstants.CENTER);
    GridBagConstraints gbc_lblThree = new GridBagConstraints();
    gbc_lblThree.gridx = 0;
    gbc_lblThree.gridy = 2;
    frame.getContentPane().add(lblThree, gbc_lblThree);
    frame.setVisible(true);
}
}

Try it

I've set the GridBagLayout from the design, and that is the auto-generated code. — , Aug 15 '18 at 11:43
Edited: Here's what I have so far with two different variables for a constraint (Or maybe something else important is different). This gives me two JTextFields with same sizes. — Najmaoui Yassir, Aug 15 '18 at 11:50

score 0 · Answer 3 · answered Aug 15 '18 at 11:59

I'm not sure about the password field but for the separated buttons, you may create a new panel with a box layout. Then, you can put your buttons in there. After that, you can put your new panel inside your main panel. That worked in my current project. Hope it'd also work for yours.

Center components inside JPanel using GridBagLayout

3 Answers3