Java GUI why BoxLayout panel acting strange when haven another BoxLayout panel in it

Question

im trying to do kind of nested Panels inside eachother. I'm new to Java so please be patient.

The problem im facing is the pnlLogin acting wierd. it's showing all 3 panels inside of it only then they don't have a Layout set. whenever i add the Layout none of them appears.

The Nested Panels should look like this:

Jframe (GridLayout)
  |
  |-> pnlLogin (BoxLayout)
      |
      |-> pnlInput   (BoxLayout)
      |-> pnlMsg     (BoxLayout)
      |-> pnlButtons (BoxLayout)

I also have the following picture to demonstrate how it should look like:

Here is how it looks like when no Layout set:

Here is how it looks like when the got the BoxLayout

What i am doing wrong? how can i solve that?

here is my Code:

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

public class AnmeldeFenster {

private JFrame jFrame       = new JFrame();
private JPanel pnlLogin     = new JPanel();
private JPanel pnlEingabe   = new JPanel();
private JPanel pnlMelder    = new JPanel();
private JPanel pnlButtons   = new JPanel();



public AnmeldeFenster() {

    int frameWidth = 500; 
    int frameHeight = 500;

    this.jFrame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
    this.jFrame.setSize(frameWidth, frameHeight);
    this.jFrame.setLocation(400, 400);
    this.jFrame.setResizable(true);
    this.jFrame.setTitle("Anmeldefenster");
    this.jFrame.setLayout(new GridLayout());
    Container contMngr = this.jFrame.getContentPane();

    // Login Panel (Main)
    // this.pnlLogin.setBounds(0, 0, frameWidth, frameHeight);
    this.pnlLogin.setLayout(new BoxLayout(this.pnlLogin, BoxLayout.PAGE_AXIS));
    contMngr.add(this.pnlLogin);

    // Eingabe Panel
    this.pnlEingabe.setBackground(Color.BLACK);
    this.pnlEingabe.setLayout(new BoxLayout(this.pnlEingabe, BoxLayout.PAGE_AXIS));
    this.pnlEingabe.setPreferredSize(new Dimension(frameWidth, 300));
    this.pnlMelder.setAlignmentX(Component.CENTER_ALIGNMENT);
    this.pnlLogin.add(this.pnlEingabe);

    // Melder Panel
    this.pnlMelder.setBackground(Color.GREEN);
    this.pnlMelder.setLayout(new BoxLayout(this.pnlMelder, BoxLayout.PAGE_AXIS));
    this.pnlMelder.setPreferredSize(new Dimension(frameWidth, 100));
    this.pnlMelder.setAlignmentX(Component.CENTER_ALIGNMENT);
    this.pnlLogin.add(this.pnlMelder);

    // Button's Panel
    this.pnlButtons.setBackground(Color.BLUE);
    this.pnlButtons.setLayout(new BoxLayout(this.pnlButtons, BoxLayout.PAGE_AXIS));
    this.pnlButtons.setPreferredSize(new Dimension(frameWidth, 100));
    this.pnlButtons.setAlignmentX(Component.CENTER_ALIGNMENT);
    this.pnlLogin.add(this.pnlButtons);
    
    this.jFrame.setVisible(true);
}

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

The design in ASCII Draw

┌─┬───────────────────────────────────────┬─┐
│ ├───────────────────────────────────────┤ │
│ │                                       │ │
│ │                                       │ │
│ │                                       │ │
│ │                                       │ │
│ │             height 200                │ │
│ │                                       │ │
│ │                                       │ │
│ │                                       │ │
│ │                                       │ │
│ │                                       │ │
│ └───────────────────────────────────────┘ │    height 500
│           empty place                     │
│ ┌───────────────────────────────────────┐ │
│ │               height 100              │ │
│ │                                       │ │
│ └───────────────────────────────────────┘ │
│              empty place                  │
│ ┌───────────────────────────────────────┐ │
│ │              height 100               │ │
│ │                                       │ │
│ ├───────────────────────────────────────┤ │   
└─┴───────────────────────────────────────┴─┘

                width 400

1) Provide ASCII art or a simple drawing of the *intended* layout of the GUI at minimum size, and if resizable, with more width and height - to show how the extra space should be used. 2) See [Should I avoid the use of set(Preferred|Maximum|Minimum)Size methods in Java Swing?](http://stackoverflow.com/q/7229226/418556) (Yes.) — Andrew Thompson, May 27 '21 at 14:53
`height 100` does not bode well. I can see how a GUI component like a `JTextArea` might need to be '4 lines tall and 50 characters wide', but that does not translate well to 'pixels'. Set the number of columns and rows, set a `Font` (face and size) if needed, then let the Swing toolkit sort out the size! — Andrew Thompson, May 27 '21 at 15:45

camickr · Accepted Answer · 2021-05-27T16:25:49.313

Not exactly sure what is going on, but the issue appears to be that you are not adding any child components to the child panels.

Somehow the space is reserved for the preferred size of the panel, but nothing is getting painted.

I modified the code below to remove the BoxLayout from the last two panels. In the first panel I added a dummy label:

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

public class BL {

private JFrame jFrame       = new JFrame();
private JPanel pnlLogin     = new JPanel();
private JPanel pnlEingabe   = new JPanel();
private JPanel pnlMelder    = new JPanel();
private JPanel pnlButtons   = new JPanel();



public BL() {

    int frameWidth = 500;
    int frameHeight = 500;

    jFrame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
    jFrame.setSize(frameWidth, frameHeight);
    jFrame.setLocation(400, 400);
    jFrame.setResizable(true);
    jFrame.setTitle("Anmeldefenster");
    jFrame.setLayout(new GridLayout());
    Container contMngr = jFrame.getContentPane();

    // Login Panel (Main)
    // pnlLogin.setBounds(0, 0, frameWidth, frameHeight);
    pnlLogin.setLayout(new BoxLayout(pnlLogin, BoxLayout.PAGE_AXIS));
    contMngr.add(pnlLogin);

    // Eingabe Panel
    pnlEingabe.setBackground(Color.YELLOW);
    pnlEingabe.setLayout(new BoxLayout(pnlEingabe, BoxLayout.PAGE_AXIS));
    pnlEingabe.setPreferredSize(new Dimension(frameWidth, 300));
    pnlMelder.setAlignmentX(Component.CENTER_ALIGNMENT);
    pnlLogin.add(pnlEingabe);
    pnlEingabe.add( new JLabel( "testing" ) );

    // Melder Panel
    pnlMelder.setBackground(Color.GREEN);
//    pnlMelder.setLayout(new BoxLayout(pnlMelder, BoxLayout.PAGE_AXIS));
    pnlMelder.setPreferredSize(new Dimension(frameWidth, 100));
    pnlMelder.setAlignmentX(Component.CENTER_ALIGNMENT);
    pnlLogin.add(pnlMelder);

    // Button's Panel
    pnlButtons.setBackground(Color.BLUE);
//    pnlButtons.setLayout(new BoxLayout(pnlButtons, BoxLayout.PAGE_AXIS));
    pnlButtons.setPreferredSize(new Dimension(frameWidth, 100));
    pnlButtons.setAlignmentX(Component.CENTER_ALIGNMENT);
    pnlLogin.add(pnlButtons);
    
    jFrame.setVisible(true);
}

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

Maybe you will find the Relative Layout easier to work with. It allows you to assign relative sizes to each component.

Java GUI why BoxLayout panel acting strange when haven another BoxLayout panel in it

1 Answers1