Search code examples
javaswinglayout-managergridbaglayoutboxlayout

Why is the vertical gap of GridLayout keeping on increasing?


I'm new to JAVA and GUI. I'm making a GUI screen for my project.

I made a GridLayout with 2 rows. First row has a FlowLayout and 2nd row has a BoxLayout. The panel with the FlowLayout will be constant throughout the program, whereas the panel with BoxLayout might vary. I've enclosed another panel inside the BoxLayout panel with a GridBagLayout. Whenever I'm adding another panel to the BoxLayout, the space between the 1st row and the 2nd row of the GridLayout is increasing.

  1. Can anyone tell me what should I do to stop this from happening?

  2. Is there any way such that the radioButton can be placed in the centre of the panel?

Here is the code:

 * To change this license header, choose License Headers in Project Properties.
 * To change this template file, choose Tools | Templates
 * and open the template in the editor.
 */
import javax.swing.*;
import java.awt.*;
import java.awt.event.*;
import java.util.*;
/**
 *
 * @author arindamchowdhury
 */
public class ScreenTwo {
     JRadioButton[] radioButton;


    public ScreenTwo() {
        start();
    }

    private void start() {
        JFrame frame = new JFrame();
        JPanel panel1 = new JPanel();
        frame.getContentPane().add(panel1);
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

        // Added a panel to the frame with GridLayout. It has 2 rows, and 1 column.
        panel1.setLayout(new GridLayout(2, 1, 1, 1));
        Font font =  new Font("Times New Roman", Font.PLAIN, 25);

        JPanel panel2 = new JPanel();
        panel2.setLayout(new FlowLayout(FlowLayout.CENTER, 50, 1));

        // *** Making a header section using FlowLayout *** //
        panel2.add(new JLabel("Flight ID"));
        panel2.add(new JLabel("Departure"));
        panel2.add(new JLabel("Arrival"));
        panel2.add(new JLabel("Total Duration                       "));        
        changeFont(panel2, font);
        panel1.add(panel2);

        // Making the 2nd row of GridLayout, a BoxLayout, so that components are added vertically.
        JPanel panel3 = new JPanel();
        panel3.setLayout(new BoxLayout(panel3, BoxLayout.Y_AXIS));
        panel3.setBorder(BorderFactory.createLineBorder(Color.BLACK));        
        GridBagConstraints c = new GridBagConstraints();

        // When I increase comboSize, the space increases
        int comboSize = 1, i;
        JPanel panelCombo[] = new JPanel[comboSize];
        ButtonGroup group = new ButtonGroup();
        radioButton = new JRadioButton[comboSize];
        for(i=0; i<comboSize; i++) {
            panelCombo[i] = new JPanel();
            panelCombo[i].setLayout(new GridBagLayout());
            c.gridx = 0;            
            c.gridy = 0;
            c.insets = new Insets(0, 0, 0, 100);
            panelCombo[i].add(new JLabel("Hi"), c);

            c.gridx++;
            panelCombo[i].add(new JLabel("Hi"), c);

            c.gridx++;
            panelCombo[i].add(new JLabel("Hi"), c);

            c.gridx++;
            c.gridheight = 4;
            panelCombo[i].add(new JLabel("Hi"), c);

            // ***  Added a RadioButton *** //
            c.gridx++;         
            radioButton[i] = new JRadioButton();
            panelCombo[i].add(radioButton[i]);
            group.add(radioButton[i]);

            c.gridheight = 1;
            c.gridx = 1;
            c.gridy++;
            panelCombo[i].add(new JLabel("Hi"), c);

            c.gridx++;
            panelCombo[i].add(new JLabel("Hi"), c);

            c.gridx = 0;
            c.gridy++;
            panelCombo[i].add(new JLabel("Hi"), c);

            c.gridx++;
            panelCombo[i].add(new JLabel("Hi"), c);

            c.gridx++;
            panelCombo[i].add(new JLabel("Hi"), c);

            c.gridx = 1;
            c.gridy++;
            panelCombo[i].add(new JLabel("Hi"), c);

            c.gridx++;
            panelCombo[i].add(new JLabel("Hi"), c);

            panel3.add(panelCombo[i]);
            changeFont(panelCombo[i], font);
            panelCombo[i].setBorder(BorderFactory.createLineBorder(Color.BLACK));
        }            
        panel1.add(panel3);

        frame.pack();
        frame.setVisible(true);

    }

    // *** A function to change the font of all components of a container *** //
    private void changeFont ( Component component, Font font ) {
        component.setFont ( font );
        if ( component instanceof Container )
        {
            for ( Component child : ( ( Container ) component ).getComponents () )
            {
                changeFont ( child, font );
            }
        }
    }

    public static void main(String[] args)
    {
        ScreenTwo sc = new ScreenTwo();
    }
} 

This is what's happening: This is what's happening

When comboSize is equal to 1: When comboSize is equal to 1


Solution

  • Whenever I'm adding another panel to the BoxLayout, the space between the 1st row and the 2nd row of the GridLayout is increasing.

    The GridLayout of the top level panel spaces components evenly. That means that the top panel with FlowLayout will always have the same space as the bottom panel with BoxLayout, which is the combined space of all the GridBagLayout panels you put in.

    Visually, vertical space of red panel = vertical space of blue + green + yellow panels:

    enter image description here

    As you can see, it's not the space between the 1st and 2nd row that's increasing (that space is 1px and you can actually see it), it's the space of the top panel.

    If you want the space of the top panel to remain constant, you would need to add the GridBagLayout panels directly to the top level GridLayout panel without the need for the bottom BoxLayout panel:

    gridPanel.setLayout(new GridLayout(0, 1, 1, 1));
    // ...
    gridPanel.add(topFlowPanel);
    // ...
    for (...) {
        // ...
        gridPanel.add(panelCombo[i]);
        // ...
    }
    

    enter image description here

    Note that the vertical gap of 1px is added between all rows now.

    Is there any way such that the radioButton can be placed in the CENTRE of the panel?

    If you mean center it vertically then you just forgot to add the GridBagConstraints when adding it to the panel:

    panelCombo[i].add(radioButton[i], c);
                                      ^