Keyboard buttons only shows when cursor hovers over

Question

I have this GUI with textfields and a keyboard made of JButtons:

But when I run it at first, it shows like this:

And the buttons for the keyboard only show when my mouse hovers over it:

Resizing the window also hides all the keyboard buttons again, and I'd still have to hover over them for it to show. Why is this?

Commenting out the code to create the textfields makes all the keyboard buttons appear on default when ran. But I'm not too sure what causes this. Is it just an issue with Swing? If it helps, I am doing this on Windows + IntelliJ. Although, I ran this code on a Mac and it's practically the same issue, except I'd have to click the buttons for it to show.

Here is the entire code for the GUI:

import javax.swing.*;
import java.awt.*;

public class GameGUI extends JFrame
{
    private final JPanel letters; // for textfields
    private final JPanel keyboard; // for buttons
    private final JTextField[][] tfs; // array for textfields
    private final JButton[] top, home, bottom; // buttons for rows
    private final String[] topRow = {"Q", "W", "E", "R", "T", "Y", "U", "I", "O", "P"};
    private final String[] homeRow = {"A", "S", "D", "F", "G", "H", "J", "K", "L"};
    private final String[] bottomRow = {"Enter", "Z", "X", "C", "V", "B", "N", "M", "Backspace"};

    public GameGUI()
    {
        setSize(200, 400);
        setDefaultCloseOperation(EXIT_ON_CLOSE);

        letters = new JPanel();
        letters.setLayout(new GridLayout(6, 5));

        // 30 textfields
        tfs = new JTextField[6][5];
        JPanel letterPlaceholder = new JPanel(new GridLayout(6, 5));
        for (int r = 0; r < tfs.length; r++)
        {
            for (int c = 0; c < tfs[r].length; c++)
            {
                tfs[r][c] = new JTextField();
                tfs[r][c].setActionCommand(r + ":" + c);
                letterPlaceholder.add(tfs[r][c]);
            }
        }
        letters.add(letterPlaceholder);

        keyboard = new JPanel();
        keyboard.setLayout(new GridLayout(3, 1));

        // top row
        top = new JButton[topRow.length];
        JPanel keys = new JPanel(new GridLayout(1, topRow.length));
        for (int i = 0; i < topRow.length; i++)
        {
            JButton topsize = new JButton(topRow[i]);
            top[i] = topsize;
            keys.add(top[i]);
        }
        keyboard.add(keys);

        // home row
        home = new JButton[homeRow.length];
        keys = new JPanel(new GridLayout(1, homeRow.length));
        for (int i = 0; i < homeRow.length; i++)
        {
            JButton homesize = new JButton(homeRow[i]);
            home[i] = homesize;
            keys.add(home[i]);
        }
        keyboard.add(keys);

        // bottom row
        bottom = new JButton[bottomRow.length];
        keys = new JPanel(new GridLayout(1, bottomRow.length));
        for (int i = 0; i < bottomRow.length; i++)
        {
            JButton bottomsize = new JButton(bottomRow[i]);
            bottom[i] = bottomsize;
            keys.add(bottom[i]);
        }
        keyboard.add(keys);

        this.getContentPane().add(letters, BorderLayout.NORTH);
        getContentPane().add(keyboard, BorderLayout.SOUTH);
        setVisible(true);
    }

    public static void main(String[] args)
    {
        new GameGUI();
    }
}

Answer 1

Seemed like a quick fix.

Changed letters.setLayout(new GridLayout(6, 5)); to letters.setLayout(new GridLayout());.

Edit:

Another (and better) way of doing it:

-removed letters panel

-added:

letterPlaceholder = new JPanel();
letterPlaceholder.setLayout(new GridLayout(0, 5));

-changed getContentPane().add(letters, BorderLayout.NORTH); to getContentPane().add(letterPlaceholder, BorderLayout.NORTH);