How can I align elements in JPanels / JFrames?

user2067364 picture user2067364 · Feb 17, 2013 · Viewed 29.6k times · Source

I'm completely new to using the GUI in java, so I'm having a bit of trouble figuring out how to align everything that I need to. I have to panels in my JFrame that I need to align (One to the left, one to the right) and a few buttons in one of the panels that I need to be centered in the panel. Here is my code.

package application;

import javax.swing.*;
import java.awt.event.*;
import java.awt.*;
import java.io.*;
import java.nio.*;
import java.util.*;

public class Main extends JPanel 
{
    public static void main(String[] args)
    { 
        //set the ui to the native OS
        try
        { 
            UIManager.setLookAndFeel(UIManager.getSystemLookAndFeelClassName());
        }catch(ClassNotFoundException | InstantiationException | IllegalAccessException 
        | UnsupportedLookAndFeelException e)                                   
        {
        }

        JFrame frame = new JFrame("Application Name");
        Menu menu = new Menu();
        JPanel iconPanel = new JPanel();
        final JPanel grid = new JPanel(new FlowLayout());
        JButton firewallButton = new JButton("Firewall");
        JButton networkButton = new JButton("Network");
        JButton printerButton = new JButton("Printer");

        int iconPanelSizeX;
        int iconPanelSizeY;
        int gridSizeX;
        int gridSizeY;
        int gridPosition;

        //frame setting
        frame.setSize(800, 600);
        frame.setMinimumSize(new Dimension(800, 600));
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        frame.setLocationRelativeTo(null);
        frame.setVisible(true);

        //add grid and iconPanel JPanels to the frame
        frame.add(iconPanel);
        iconPanel.add(firewallButton);
        iconPanel.add(networkButton);
        iconPanel.add(printerButton);
        frame.add(grid);        

        //iconPanel settings
        iconPanel.setBorder(BorderFactory.createLoweredSoftBevelBorder());
        iconPanel.setBackground(Color.gray);
        iconPanel.setLayout(new FlowLayout());
        iconPanel.setSize(new Dimension(100, 600));
        iconPanel.setVisible(true);

        //grid setting
        grid.setBackground(Color.red);
        grid.setSize(new Dimension(700, 600));
        grid.setVisible(true);

        //this is for resizing components when the user resizes the window
        int counter = 0;
        while(counter == 0)
        {
            firewallButton.setSize(new Dimension(iconPanel.getWidth(), 50));
            networkButton.setSize(new Dimension(iconPanel.getWidth(), 50));
            printerButton.setSize(new Dimension(iconPanel.getWidth(), 50));
            iconPanelSizeX = frame.getWidth() / 10;
            iconPanelSizeY = frame.getHeight();
            gridSizeX = (frame.getWidth() / 10) * 9;
            gridSizeY = frame.getHeight();
            iconPanel.setSize(new Dimension(iconPanelSizeX, iconPanelSizeY));
            grid.setSize(new Dimension(gridSizeX, gridSizeY));
        }
    }
}

As you can see, the second JPanel (grid) doesn't line up with the right side of the frame, and the buttons inside iconTray don't center either. I realize these are both probably simple layout fixes, but I have no clue where to start.

Answer

Branislav Lazic picture Branislav Lazic · Feb 17, 2013

For simple splitting of JFrame you can use GridLayout with 1 row and 2 colums.

frame.setLayout(new GridLayout(1,2,3,3)); //3,3 are gaps
frame.add(grid);
frame.add(iconPanel);

For centering components in panels you can use FlowLayout which is by default set on JPanels:

Doing it manualy:

grid.setLayout(new FlowLayout()); //Centered components

grid.setLayout(new FlowLayout(FlowLayout.LEFT,3,3)); //Components aligned to left

grid.setLayout(new FlowLayout(FlowLayout.RIGHT,3,3)); //Components aligned to right

This is how it looks:

enter image description here

Also, few observations:

  • Never call setXXXSize() methods for your components;

  • Try to avoid calling setSize(); for JFrame, call pack(); instead;

  • Call setVisible(true); in the end of code;

All your huge code can be "stripped" to this:

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


public class Main extends JPanel
{
    public static void main(String[] args)
    {
        JFrame frame = new JFrame("Application Name");
        JPanel iconPanel = new JPanel();
        JPanel grid = new JPanel(new FlowLayout());
        JButton firewallButton = new JButton("Firewall");
        JButton networkButton = new JButton("Network");
        JButton printerButton = new JButton("Printer");


        frame.add(iconPanel);
        iconPanel.add(firewallButton);
        iconPanel.add(networkButton);
        iconPanel.add(printerButton);
        grid.setBackground(Color.GREEN);

        frame.setLayout(new GridLayout(1,2,3,3));
        frame.add(grid);
        frame.add(iconPanel);


        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        frame.pack();
        frame.setLocationRelativeTo(null);
        frame.setVisible(true);
    }
}