When adding JPanel to JPanel, the size of the first JPanel gets lower

Question

I am realy confused about this. I making the game "Microtrip". It's mobile game, but I am making it for PC. I have a background class who extends JPanel and it just draws a rectangle who starts from 0, 0 and have the size of the screen(my game is fullscreen). I have a main menu class who extends JPanel too. I want to to add everything for the main menu there. Then I add everything into my GameFrame class who extends JFrame. I have main class who just calls The GameFrame class. Here's my code: Background class:

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

@SuppressWarnings("serial")

public class Background extends JPanel{

    int width, height;
    Color backgroundBlue;

    public Background(int width, int height){

        this.width = width;
        this.height = height;
        backgroundBlue = new Color(25, 159, 229);

    }

    @Override

    protected void paintComponent(Graphics g){
        super.paintComponent(g);
        g.setColor(backgroundBlue);
        g.fillRect(0, 0, this.width, this.height);
    }

}

MainMenu class:

import javax.swing.*;

@SuppressWarnings("serial")

public class MainMenu extends JPanel{

    Background background;

    public MainMenu(int WW, int WH){
        //WW = window width
        //WH = widow height
        this.setLocation(0, 0);
        this.setSize(WW, WH);
        background = new Background(WW, WH);
        this.add(background);
    }

}

GameFrame class:

import main_menu.MainMenu;
import main_menu.*;

import java.awt.Dimension;
import java.awt.GraphicsDevice;
import java.awt.GraphicsEnvironment;
import java.awt.Toolkit;

import javax.swing.JFrame;

import java.awt.event.*;

@SuppressWarnings("serial")

public class GameFrame extends JFrame{

    private GraphicsDevice vc;
    private MainMenu mainMenu;
    //private Background background;

    public GameFrame(){

        Dimension screenSize = Toolkit.getDefaultToolkit().getScreenSize();
        mainMenu = new MainMenu((int)screenSize.getWidth(), (int) screenSize.getHeight());
        /*background = new Background((int)screenSize.getWidth(), (int) screenSize.getHeight());*/
        GraphicsEnvironment e = GraphicsEnvironment.getLocalGraphicsEnvironment();
        vc= e.getDefaultScreenDevice();
        this.setTitle("Mictrotrip");
        this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        this.setBounds(0, 0, (int)screenSize.getWidth(), (int)screenSize.getHeight());
        this.add(mainMenu);
        //this.add(background);
        this.setLocationRelativeTo(null);
        this.setUndecorated(true);
        this.setResizable(false);
        vc.setFullScreenWindow(this);
        addKeyListener(new KeyListener(){

            public void keyPressed(KeyEvent e){

                if(e.getKeyCode() == KeyEvent.VK_ESCAPE){
                    System.exit(0);
                }

            }

            public void keyReleased(KeyEvent e){

            }

            public void keyTyped(KeyEvent e){

            }

        });
    }

}

and my Main class:

public class Main {

    public static void main(String[] args) {

        new GameFrame();

    }

}

When I run it, it just shows a small rectangle at the top center. I did the following experiment:

I ignored the mainmenu class and directly added the background in the JFrame(the commented lines in GameFrame) and everything worked fine. Why? I read all similar questions, but no one of them helped me.

Answer 1

If you want background to fill main menu, then the problem is with MainMenu -- you're letting the JPanel use the default FlowLayout, and FlowLayouts will not respect a components size (so Jamal's solution will not work) but rather its preferred size. If you want background to fill the main menu, then give MainMenu a BorderLayout and then add your background component BorderLayout.CENTER:

public MainMenu(int WW, int WH){
    // WW = window width
    // WH = widow height
    // this.setLocation(0, 0);
    // this.setSize(WW, WH);

    setLayout(new BorderLayout());
    background = new Background(WW, WH);
    this.add(background, BorderLayout.CENTER);
}