GridBagLayout not aligning jlabel and jbutton

Question

So I'm using a GridBagLayout and i'm trying to create a JButton in the center of the JPanel, and then have a JLabel at the very top of the JPanel. When I try to do this the button and label are not aligned.

Code:

package view;

import java.awt.Dimension;
import java.awt.Font;
import java.awt.GridBagConstraints;
import java.awt.GridBagLayout;
import java.awt.Insets;

import javax.swing.JButton;
import javax.swing.JLabel;
import javax.swing.JPanel;

public class StartPanel extends JPanel {

    /**
     * 
     */
    private static final long serialVersionUID = 1L;
    //Declare our global variables
    JButton btnUploadProject;
    JLabel heading;
    GridBagConstraints gbc;
    GridBagConstraints gbc2;
    /**
     * Create the panel.
     */
    public StartPanel() {
        //Set up Panel
        this.setVisible(true);
        setLayout(new GridBagLayout());

        //Create the components
        btnUploadProject = new JButton("Upload A Project");
        heading = new JLabel("Heading test");
        gbc = new GridBagConstraints();
        gbc2 = new GridBagConstraints();

        //Modify components
        btnUploadProject.setPreferredSize(new Dimension(400,100));
        btnUploadProject.setFont(new Font("Arial", Font.PLAIN, 40));
        heading.setFont(new Font("Arial", Font.PLAIN, 40));
        gbc.anchor = GridBagConstraints.CENTER;
        gbc2.anchor = GridBagConstraints.NORTH;
        gbc2.weighty = 1.0;
        //Add the buttons
        this.add(btnUploadProject, gbc);
        this.add(heading, gbc2);
    }

}

Image of the incorrect alignment:

Answer 1

I believe your "issue" comes from the wrong use of anchor parameter.

From https://docs.oracle.com/javase/tutorial/uiswing/layout/gridbag.html :

anchor: Used when the component is smaller than its display area to determine where (within the area) to place the component. Valid values (defined as GridBagConstraints constants) are CENTER (the default), PAGE_START, PAGE_END, LINE_START, LINE_END, FIRST_LINE_START, FIRST_LINE_END, LAST_LINE_END, and LAST_LINE_START.

So anchor is used to specify the position of the component in his cell.

Here you have two cells:

• The first one (x: 0, y: 0): contains your button with anchor = CENTER, your button is displayed in the center of the cell
• The second one (x: 1, y: 0): contains your label with anchor = NORTH, your label is displayed in the north part of the cell

As you can see, cells are on the same row. If you want to put your button below the label, use gridx/gridy constraints:

gridx, gridy Specify the row and column at the upper left of the component. The leftmost column has address gridx=0 and the top row has address gridy=0. Use GridBagConstraints.RELATIVE (the default value) to specify that the component be placed just to the right of (for gridx) or just below (for gridy) the component that was added to the container just before this component was added. We recommend specifying the gridx and gridy values for each component rather than just using GridBagConstraints.RELATIVE; this tends to result in more predictable layouts.

Try:

gbc.gridy = 1;
gbc2.gridy = 0;