Java GridBagLayout 無法正確設置我的 GUI

Question

我正在嘗試制作一個井字游戲。 對於 3x3 tictactoe 表，我使用了 9 個按鈕。 但是，按鈕上方和下方的 jtext 似乎更改了每個 3x3 按鈕的長度。 有沒有辦法可以將 3x3 按鈕設置為相同大小而不受其他組件的干擾。

import java.awt.Button;
import java.awt.Color;
import java.awt.Dimension;
import java.awt.GridBagConstraints;
import java.awt.GridBagLayout;
import java.awt.GridLayout;
import java.awt.Insets;

import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.JTextField;
import java.awt.Dimension;


public class makeGUI {

    JFrame frame;

    public void initialise() {

        frame = new JFrame();
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);


        JPanel playPanel = new JPanel();

        playPanel.setPreferredSize(new Dimension(300, 500));

        playPanel.setBackground(Color.WHITE);


        playPanel.setLayout(new GridBagLayout());
        GridBagConstraints c = new GridBagConstraints();

        JTextField field = new JTextField(5);
        field.setEditable(false);
        c.gridwidth = 2;
        c.gridx = 0;
        c.gridy = 0;
        playPanel.add(field, c);




        JButton button = new JButton("");
        //c.weightx = 0.5;  
        c.fill = GridBagConstraints.HORIZONTAL;
        c.gridx = 0;
        c.gridy = 1;
        c.gridwidth = 1;
        button.setPreferredSize(new Dimension(40, 40));
        playPanel.add(button, c);

        button = new JButton("");
        c.fill = GridBagConstraints.HORIZONTAL;
        //c.weightx = 0.5;
        c.gridx = 1;
        c.gridy = 1;
        c.gridwidth = 1;
        button.setPreferredSize(new Dimension(40, 40));
        playPanel.add(button, c);

        button = new JButton("");
        c.fill = GridBagConstraints.HORIZONTAL;
        //c.weightx = 0.5;
        c.gridx = 2;
        c.gridy = 1;
        c.gridwidth = 1;
        button.setPreferredSize(new Dimension(40, 40));
        playPanel.add(button, c);

        button = new JButton("");
        c.fill = GridBagConstraints.HORIZONTAL;
        //c.weightx = 0.5;
        c.gridx = 0;
        c.gridy = 2;
        c.gridwidth = 1;
        button.setPreferredSize(new Dimension(40, 40));
        playPanel.add(button, c);

        button = new JButton("");
        c.fill = GridBagConstraints.HORIZONTAL;
        //c.weightx = 0.5;
        c.gridx = 1;
        c.gridy = 2;
        c.gridwidth = 1;
        button.setPreferredSize(new Dimension(40, 40));
        playPanel.add(button, c);

        button = new JButton("");
        c.fill = GridBagConstraints.HORIZONTAL;
        //c.weightx = 0.5;
        c.gridx = 2;
        c.gridy = 2;
        c.gridwidth = 1;
        button.setPreferredSize(new Dimension(40, 40));
        playPanel.add(button, c);


        button = new JButton("");
        c.fill = GridBagConstraints.HORIZONTAL;
        //c.weightx = 0.5;
        c.gridx = 0;
        c.gridy = 3;
        c.gridwidth = 1;
        button.setPreferredSize(new Dimension(40, 40));
        playPanel.add(button, c);

        button = new JButton("");
        c.fill = GridBagConstraints.HORIZONTAL;
        //c.weightx = 0.5;
        c.gridx = 1;
        c.gridy = 3;
        c.gridwidth = 1;
        button.setPreferredSize(new Dimension(40, 40));
        playPanel.add(button, c);

        button = new JButton("");
        c.fill = GridBagConstraints.HORIZONTAL;
        //c.weightx = 0.5;
        c.gridx = 2;
        c.gridy = 3;
        c.gridwidth = 1;
        button.setPreferredSize(new Dimension(40, 40));
        playPanel.add(button, c);






        field = new JTextField(5);
        c.gridwidth = 1;
        c.gridx = 0;
        c.gridy = 4;
        playPanel.add(field, c);

        button = new JButton("Submit");
        c.fill = GridBagConstraints.BOTH;
        c.weightx = 0.5;
        c.gridx = 2;
        c.gridy = 4;
        playPanel.add(button, c);

        frame.add(playPanel);
        frame.setTitle("A Simple Card Game");
        frame.setSize(400, 700);
        frame.pack();
        frame.setVisible(true);

    }

}

這就是我現在所擁有的：

我想要這樣的東西：

Answer 1

這就是我將這個 GUI 分成幾個部分的方式：

• 中間的紅色邊框區域， GridLayout 。 網格布局將確保每個單元格的寬度都是它所包含的最高組件的最寬和高度。
• 底部的綠色邊框區域將是一個居中的FlowLayout 。
• 藍色邊框外面板將使用BorderLayout 。 這反過來將包含：
  • PAGE_START的標簽
  • CENTER的網格布局
  • PAGE_END的FlowLayout