Nesting FlowLayout Panels

Question

I'm trying to create a GUI using JAVA for a BMR calculator.

I'm having some problems with getting the GUI right so I have been experimenting with different layout managers/nesting Jpanels.

My current code has an age and gender label, both contained in separate JPanels in a flow layout, but the problem is that they appear next to eachother rather than on seperate lines as I want them to.

How can I acheive this with my code? My current laoyut is as below, I want Gender to be below age, and have been playing with this for some time but can't get it to work.

Cheers.

package v2;

import javax.swing.*;

import java.awt.GridBagConstraints;
import java.awt.GridBagLayout;
import java.awt.FlowLayout;




public class BmrCalcv2 extends JFrame {

static JFrame mainFrame;
static JPanel mainPanel;

static JMenuBar menuBar;
static JMenu fileMenu, editMenu;

static JPanel agePanel;
private JLabel ageLabel;
private JTextField ageTextField;

static JPanel genderPanel;
private JLabel genderLabel;




public BmrCalcv2() {

    // Main JFrame
    mainFrame = new JFrame("BMR/TDEE Calculator");
    mainPanel = new JPanel();


    // All JPanel declarations
    menuBar = new JMenuBar();
    agePanel = new JPanel();
    genderPanel = new JPanel();

    // JPanel layout managers
    agePanel.setLayout(new FlowLayout(10));
    genderPanel.setLayout(new FlowLayout(10));


    // Menu JPanel
    fileMenu = new JMenu("File");
    editMenu = new JMenu("Edit");
    menuBar.add(fileMenu);
    menuBar.add(editMenu);

    // Age JPanel
    ageLabel = new JLabel("Age:");
    ageTextField = new JTextField(5);
    agePanel.add(ageLabel);
    agePanel.add(ageTextField);



    // Gender JPanel
    genderLabel = new JLabel("Gender:");
    genderPanel.add(genderLabel);



    // Adding sub JPanels to main JPanel
    mainPanel.add(agePanel);
    mainPanel.add(genderPanel);


    // Adding main JPanel/menubar to JFrame
    mainFrame.setJMenuBar(menuBar);
    mainFrame.add(mainPanel);

}





public static void main(String[] args) {

    BmrCalcv2 frame = new BmrCalcv2();

    mainFrame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
    mainFrame.setVisible(true);
    mainFrame.setSize(330, 300);;
    mainFrame.setResizable(false);

    }

}

Answer 1

Something like this should do it:

import java.awt.BorderLayout;
import java.awt.GridBagConstraints;
import java.awt.GridBagLayout;

import javax.swing.ButtonGroup;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPanel;
import javax.swing.JRadioButton;
import javax.swing.JTextField;

public class GridBagLayoutExample {

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

    private static void init() {
        // create the jframe
        JFrame jframe = new JFrame("BMI Calculator");
        // create the gui elements
        JLabel ageLabel = new JLabel("Age:");
        JTextField ageTxt = new JTextField(20);
        JLabel genderLabel = new JLabel("Gender:");
        JTextField genderTxt = new JTextField(20);
        // create gridbag layout and constraints
        GridBagLayout gbl = new GridBagLayout();
        // create the panel using the gbl
        JPanel pan = new JPanel(gbl);
        // create the constraints
        GridBagConstraints cons = new GridBagConstraints();
        cons.fill = GridBagConstraints.HORIZONTAL;
        // age label
        cons.gridx = 0;
        cons.gridy = 0;
        pan.add(ageLabel, cons);
        // age text
        cons.gridx = 1;
        cons.gridy = 0;
        pan.add(ageTxt, cons);
        // gender label
        cons.gridx = 0;
        cons.gridy = 1;
        pan.add(genderLabel, cons);
        // gender text
        cons.gridx = 1;
        cons.gridy = 1;
        pan.add(genderTxt, cons);
        // add the panel to the jframe
        jframe.add(pan, BorderLayout.CENTER);
        // show the jframe
        jframe.setSize(400, 200);
        jframe.setVisible(true);
    }
}

Looks like this:

Answer 2

If you don't care about alignment:

mainFrame.getContentPane().setLayout(new BoxLayout(mainFrame.getContentPane(), BoxLayout.X_AXIS));
// quick pseudocode incoming
for(int x = 0; x < components.size(); x++) {
    JPanel j = new JPanel();
    j.setLayout(new FlowLayout(FlowLayout.CENTER)); // I think CENTER is the default anyhow
    j.add(getLabel(x));
    j.add(getField(x));
    mainFrame.add(j);
}

If you care about alignment, swap the FlowLayout for a BoxLayout along the Y_AXIS and put some horizontal glue between the label and the input field(s).