GridBag Layout 如何将组件向北推

Question

这是我的代码

 public class HomeTopPanel extends JPanel {

//BUTTONS
private final JButton myAccountButton = new JButton("My Account");
private final JButton updatePhoto = new JButton("Update Photo");

//PANELS
private final JPanel rightPanel_1 = new JPanel(new GridBagLayout());
private final JPanel rightPanel_2 = new JPanel(new GridBagLayout());
private final JPanel logHistoryPanel = new JPanel(new GridBagLayout());

//BORDERS
private final Border homeTopPanel_LineBorder = BorderFactory.createLineBorder(Color.BLACK, 1);
private final Border rightPanel1_LineBorder = BorderFactory.createLineBorder(Color.BLACK, 1);
private final Border rightPanel2_LineBorder = BorderFactory.createLineBorder(Color.BLACK, 1);
private final TitledBorder logHistoryPanel_TitledBorder = BorderFactory.createTitledBorder("Log History");

//LABELS
private final JLabel imageContainer = new JLabel("User Image");


//CONSTRAINTS
GridBagConstraints gbc = new GridBagConstraints();

//CONSTRUCTOR
public HomeTopPanel(){
    //METHOD CALLS
    this.setLayout(new GridBagLayout()); //setting of layout should ALWAYS come first before adding constraints and components
    constructMyAccountButton();
    constructRightPanel_1();
    constructRightPanel_2();
    constructLeftPanelComponents();
    setRightPanelBorders();
}

public final void constructMyAccountButton(){
    gbc.anchor = GridBagConstraints.PAGE_START;
    gbc.insets = new Insets(5,5,5,5);
    gbc.gridx = 0; gbc.gridy = 0; 
        this.add(myAccountButton,gbc);
}

public final void constructRightPanel_1(){
    rightPanel_1.setPreferredSize(new Dimension(1000, 550));
    gbc.gridx = 1; gbc.gridy = 0; 
        this.add(rightPanel_1,gbc);
}

public final void constructRightPanel_2(){
    rightPanel_2.setPreferredSize(new Dimension(800, 300));
    gbc.gridheight = 3;
        rightPanel_1.add(rightPanel_2,gbc);
}

public final void constructLeftPanelComponents(){
    gbc.gridx = 0; gbc.gridy = 0;
    gbc.ipadx = 0;
    gbc.anchor = GridBagConstraints.PAGE_START;
        rightPanel_1.add(imageContainer,gbc);
    gbc.gridx = 0; gbc.gridy = 1;
    gbc.anchor = GridBagConstraints.CENTER;
        rightPanel_1.add(updatePhoto,gbc);
    gbc.gridx = 0; gbc.gridy = 2;
    gbc.anchor = GridBagConstraints.PAGE_END;
        logHistoryPanel.setPreferredSize(new Dimension(110, 100));
        rightPanel_1.add(logHistoryPanel,gbc);
}

private void setRightPanelBorders(){
    rightPanel_1.setBorder(rightPanel1_LineBorder);
    rightPanel_2.setBorder(rightPanel2_LineBorder);
    logHistoryPanel.setBorder(logHistoryPanel_TitledBorder);
    this.setBorder(homeTopPanel_LineBorder);
}
}

这是我得到的：

我有两个问题：

如何将这 4 个对象推到顶部？
为什么 "User Image" JLabel 占用太多 space 或者为什么它的单元格高度太高？

我想完成这个：

然后将其推到顶部。我尝试使用 insets 和 weight 但仍然无法获得我想要的结果。

如有任何帮助，我将不胜感激。至此，不知道是ipadx/ipady的问题还是weightx/weighty的问题。

Answer 1

试试这些原则：

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

    private static void test() {
        JFrame frame = new JFrame("GridBagLayoutTest");
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

        JPanel contentPane = new JPanel();
        contentPane.setBorder(BorderFactory.createEmptyBorder(5, 5, 5, 5));
        contentPane.setLayout(new GridBagLayout());

        GridBagConstraints gbc = new GridBagConstraints();

        JLabel userImageLabel = new JLabel("User Image");

        gbc.gridx = 0;
        gbc.gridy = 0;
        gbc.gridwidth = 1;
        gbc.gridheight = 1;
        gbc.weightx = 0;
        gbc.weighty = 0;
        gbc.insets.bottom = 80;
        gbc.fill = GridBagConstraints.NONE;
        gbc.anchor = GridBagConstraints.PAGE_START;

        contentPane.add(userImageLabel, gbc);

        JButton updatePhotoButton = new JButton("Update Photo");
        gbc.gridy++;
        gbc.insets.bottom = 5;
        gbc.fill = GridBagConstraints.HORIZONTAL;
        contentPane.add(updatePhotoButton, gbc);

        JPanel logHistoryPanel = new JPanel();
        logHistoryPanel.setBorder(BorderFactory.createTitledBorder("Log History"));
        logHistoryPanel.setPreferredSize(new Dimension(110, 100));
        gbc.gridy++;
        gbc.weighty = 0.001;
        gbc.insets.bottom = 0;
        contentPane.add(logHistoryPanel, gbc);

        gbc.gridy++;
        gbc.weighty = 1;
        gbc.fill = GridBagConstraints.BOTH;
        contentPane.add(Box.createVerticalGlue(), gbc);

        JPanel rightPanel = new JPanel();
        rightPanel.setBorder(BorderFactory.createLineBorder(Color.BLACK, 1));
        gbc.gridx = 1;
        gbc.gridy = 0;
        gbc.gridheight = 4;
        gbc.weightx = 1;
        gbc.insets.left = 5;
        gbc.anchor = GridBagConstraints.CENTER;
        contentPane.add(rightPanel, gbc);

        frame.setContentPane(contentPane);
        frame.setSize(new Dimension(500, 500));
        frame.setLocationRelativeTo(null);
        frame.setVisible(true);
    }
}

更新：

why it is advisable to include SwingUtilities.invokeLater(new Runnable(). Also, I noticed you put all the initialization within one method. Is this something I should be practicing instead of calling my methods within the constructor like what I did in my post?

您对图形和 UI 所做的一切都应该在 AWT thread 中执行。 SwingUtilities.invokeLater 一定会做到的。
组件的初始化与其说是规则，不如说是风格。但是，正如@user1803551所说，"I would recommend using a new GridBagConstraints for each new container (if not each new component), otherwise you are risking some nasty bugs like the ones you have."

Answer 2

How can I push all these 4 objects to top?

您需要为组件分配权重：gbc.weightx 和 gbc.weighty。

Why is the "User Image" JLabel taking too much space or rather why is it's cell height too tall?

您在添加 rightPanel_2 后忘记重置 gbc.gridheight = 1。此外，您将 gbc.anchor 值设置为 CENTER 和 PAGE_END，这会导致您的组件无法按需要堆叠。

我在你的代码中注释掉了应该删除的东西并添加了我上面解释的修复布局的代码：

public class HomeTopPanel extends JPanel {

    // BUTTONS
    private final JButton myAccountButton = new JButton("My Account");
    private final JButton updatePhoto = new JButton("Update Photo");

    // PANELS
    private final JPanel rightPanel_1 = new JPanel(new GridBagLayout()) {

        public Dimension getPreferredSize() {

            return new Dimension(1000, 550);
        };
    };
    private final JPanel rightPanel_2 = new JPanel(new GridBagLayout()) {

        public Dimension getPreferredSize() {

            return new Dimension(800, 300);
        };
    };
    private final JPanel logHistoryPanel = new JPanel(new GridBagLayout());

    // BORDERS
    private final Border homeTopPanel_LineBorder = BorderFactory.createLineBorder(Color.BLACK, 1);
    private final Border rightPanel1_LineBorder = BorderFactory.createLineBorder(Color.BLACK, 1);
    private final Border rightPanel2_LineBorder = BorderFactory.createLineBorder(Color.BLACK, 1);
    private final TitledBorder logHistoryPanel_TitledBorder = BorderFactory.createTitledBorder("Log History");

    // LABELS
    private final JLabel imageContainer = new JLabel("User Image");

    // CONSTRAINTS
    GridBagConstraints gbc = new GridBagConstraints();

    // CONSTRUCTOR
    public HomeTopPanel() {

        // METHOD CALLS
        this.setLayout(new GridBagLayout()); // setting of layout should ALWAYS come first before adding constraints and components
        constructMyAccountButton();
        constructRightPanel_1();
        constructRightPanel_2();
        constructLeftPanelComponents();
        setRightPanelBorders();
    }

    public final void constructMyAccountButton() {

        gbc.anchor = GridBagConstraints.PAGE_START;
        gbc.insets = new Insets(5, 5, 5, 5);
        gbc.gridx = 0;
        gbc.gridy = 0;
        this.add(myAccountButton, gbc);
    }

    public final void constructRightPanel_1() {

        rightPanel_1.setBackground(Color.RED);
//      rightPanel_1.setPreferredSize(new Dimension(1000, 550));
        gbc.fill = GridBagConstraints.BOTH; // Optional: used for the 2 right panels
        gbc.weightx = 1;
        gbc.weighty = 1;
        gbc.gridx = 1;
        gbc.gridy = 0;
        this.add(rightPanel_1, gbc);
    }

    public final void constructRightPanel_2() {

        rightPanel_2.setBackground(Color.BLUE);
//      rightPanel_2.setPreferredSize(new Dimension(800, 300));
        gbc.gridheight = 3;
        rightPanel_1.add(rightPanel_2, gbc);
    }

    public final void constructLeftPanelComponents() {

        gbc.fill = GridBagConstraints.NONE; // Remove if you didn't use it above
        gbc.weightx = 0;
        gbc.weighty = 0;
        gbc.gridheight = 1;
        gbc.gridx = 0;
        gbc.gridy = 0;
//      gbc.ipadx = 0;
//      gbc.anchor = GridBagConstraints.PAGE_START;
        rightPanel_1.add(imageContainer, gbc);
        gbc.gridx = 0;
        gbc.gridy = 1;
//      gbc.anchor = GridBagConstraints.CENTER;
        rightPanel_1.add(updatePhoto, gbc);
        gbc.gridx = 0;
        gbc.gridy = 2;
//      gbc.anchor = GridBagConstraints.PAGE_END;
        logHistoryPanel.setPreferredSize(new Dimension(110, 100));
        rightPanel_1.add(logHistoryPanel, gbc);
    }

    private void setRightPanelBorders() {

        rightPanel_1.setBorder(rightPanel1_LineBorder);
        rightPanel_2.setBorder(rightPanel2_LineBorder);
        logHistoryPanel.setBorder(logHistoryPanel_TitledBorder);
        this.setBorder(homeTopPanel_LineBorder);
    }

    public static void main(String[] args) {

        JFrame frame = new JFrame();
        frame.add(new HomeTopPanel());
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        frame.pack();
        frame.setVisible(true);
    }
}

（已编辑）关于 GridBagLayout 用法的说明：

@Override getPreferredSize() 而不是调用 setPreferredSize(...)。见 here and here.
我建议为每个新容器（如果不是每个新组件）使用一个新的 GridBagConstraints，否则您将面临一些像您所拥有的那些讨厌的错误。教程还提到：

As you might have guessed from the above example, it is possible to reuse the same GridBagConstraints instance for multiple components, even if the components have different constraints. However, it is recommended that you do not reuse GridBagConstraints, as this can very easily lead to you introducing subtle bugs if you forget to reset the fields for each new instance.

当您设置 GridBagConstraints 属性时，它 保持不变 。在某些时候将 gridheight 设置为 1 会影响 all add 设置后的调用，因此无需为每个调用再次设置相同的值调用。对于每次设置为 0 的 gridx 也是如此 - 实际上一次就足够了。我保留所有冗余调用的原因是有时在添加组件之前更容易看到确切位置，而不是搜索最后一次设置属性的代码。
在生产阶段为组件着色有助于查看 GUI 的真实外观。

编辑：关于您的通用代码的注释

在 EDT 上启动 GUI（参见 Concurrency in Swing）：

public static void main(String[] args) {

    SwingUtilities.invokeLater(() -> {

        JFrame frame = new JFrame();
        frame.add(new HomeTopPanel());
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        frame.pack();
        frame.setVisible(true);
    });
}

根据Java命名约定，变量名不应使用下划线（_），除非它们是常量。所以 rightPanel_1 应该是 rightPanel1.
您正在创建 3 次相同的边框，BorderFactory.createLineBorder(Color.BLACK, 1); 并且当局部变量可以时，您还将它们保留为字段。您甚至可以在 setBorder(...) 调用中创建边框。
我认为与其在一个地方设置所有的边框，不如在配置的地方设置每个组件的边框。在您的代码中，您将方法划分为匹配组件，因此在该方法中完全配置组件是有意义的。
将长方法拆分为较小的 final 方法是处理可读性的极好方法。我希望我能看到更多而不是 100 行组件初始化。但是，对于您的情况，如果您有一个共享对象（如 GridBagConstraints），那么您必须注意它在方法之间的变化。

GridBag Layout 如何将组件向北推

GridBag Layout How to push components north

java

swing

layout-manager

gridbaglayout