Adding a Button array to a JPanel

Question

I have another problem with my project. I have created this GameBoard made out of JButtons (it works as it's supposed to now) but I would need to add it to a JPanel. I need to display other things (in other panels) in the window. But when I tried to add the Button Array to a panel, and add that panel to the window, crazy things started happening (the buttons were very small, the grid was completely broken etc.). How could I add this Button Array to a JPanel and put that in the center of the window? Here is my code:

package city;

import java.awt.Color;
import java.awt.Component;
import java.awt.GridLayout;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;

import javax.swing.JFrame;
import javax.swing.JPanel;

public class GameBoard extends JFrame implements ActionListener {

// The overall box count in chess board
public static final int squareCount = 64;
// The Array of buttons (the GameBoard itself)
public Button[][] button = new Button[8][8];
// Colors for all the buttons
public Color defaultColor = Color.WHITE;
public Color darkRedColor = Color.RED;
public Color darkBlueColor = Color.BLUE;
public Color lightBlueColor = Color.CYAN;
public Color lightRedColor = Color.PINK;

public GameBoard(String title) {
    // Creates the buttons in the array
    for (int i = 0; i < 8; i++) {
        for (int j = 0; j < 8; j++) {
            button[i][j] = new Button();
            add(button[i][j]);
            button[i][j].setBackground(defaultColor);
        }
    }

    // Build the window
    this.setTitle(title); // Setting the title of board
    this.setLayout(new GridLayout(8, 18)); // GridLayout will arrange elements in Grid Manager 8 X 8
    this.setSize(650, 650); // Size of the chess board
    this.setVisible(true); // Sets the board visible
    this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); // If you close the window, the program will terminate
    this.setResizable(false); //The window is not resizable anymore ;)

    // Sets some text on the buttons
    button[0][3].setText("Red's");
    button[0][4].setText("Gate");
    button[7][3].setText("Blue's");
    button[7][4].setText("Gate");

    // Colors the buttons
    newGame();

}

// Colors the buttons
public void newGame() {
    button[0][0].setBackground(lightRedColor);
    button[0][1].setBackground(lightRedColor);
    button[0][2].setBackground(lightRedColor);
    button[0][3].setBackground(darkRedColor);
    button[0][4].setBackground(lightRedColor);
    button[0][5].setBackground(lightRedColor);
    button[0][6].setBackground(lightRedColor);
    button[0][7].setBackground(lightRedColor);
    button[1][3].setBackground(darkRedColor);

    button[7][0].setBackground(lightBlueColor);
    button[7][1].setBackground(lightBlueColor);
    button[7][2].setBackground(lightBlueColor);
    button[7][3].setBackground(lightBlueColor);
    button[7][4].setBackground(darkBlueColor);
    button[7][5].setBackground(lightBlueColor);
    button[7][6].setBackground(lightBlueColor);
    button[7][7].setBackground(lightBlueColor);
    button[6][4].setBackground(darkBlueColor);
}

// The ActionListener is not yet used
public void actionPerformed(ActionEvent ae) {
    String action = ae.getActionCommand();

}

public static void main(String[] args) {

    String title = "City - A Two-Player Strategic Game";

    GameBoard gameBoard = new GameBoard(title); // Creating the instance of gameBoard
}
}

And here is a screenshot of the bad GUI that generated: Bad GUI

Thanks for any help, and good luck everyone with a similar problem!

Answer 1

Is this what you are looking for? I am not very sure what´s the problem.

This adds the buttons to a new JPanel and adds this panel to the frame.

JPanel panel = new JPanel(new GridLayout(8, 8));
    panel.setSize(650,650);
    getContentPane().add(panel, BorderLayout.CENTER);
    // Creates the buttons in the array
    for (int i = 0; i < 8; i++) {
        for (int j = 0; j < 8; j++) {
            button[i][j] = new JButton();
            panel.add(button[i][j]);
            button[i][j].setBackground(defaultColor);
        }
    }

    // Build the window
    this.setTitle(title); // Setting the title of board
    getContentPane().setLayout(new BorderLayout());
    this.setSize(650, 650); // Size of the chess board
    this.setVisible(true); // Sets the board visible
    this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); // If you close the window, the program will terminate
    this.setResizable(false); //The window is not resizable anymore ;)