使用GroupLayout创建自定义的GUI

Question

I'm trying to create customized interface like the one displayed by daches:

-----------------------------------------------------------------
-  -----------------------------------------------------------  -
-  -                                                         -  -
-  -----------------------------------------------------------  -
-                                                               -
-                           ----------                          -
-                           -        -                          -
-                           ----------                          -
-                                                               -
-  ----------  -----------------------------------  ----------  -
-  -        -  -                                 -  -        -  -
-  ----------  -----------------------------------  ----------  -
-                                       ----------  ----------  -
-                                       -        -  -        -  -
-                                       ----------  ----------  -
-----------------------------------------------------------------

I followed the example Here GroupLayout Example

Here is the code i used:

GroupLayout layout = new GroupLayout(getContentPane());
    getContentPane().setLayout(layout);
    layout.setAutoCreateGaps(true);
    layout.setAutoCreateContainerGaps(true);

    layout.setHorizontalGroup(layout.createParallelGroup(LEADING)
            .addComponent(msgLbl)
            .addGroup(layout.createSequentialGroup()

                    .addGroup(layout.createParallelGroup(LEADING)
                        .addComponent(empty)
                        .addComponent(fldrLbl3)
                        .addComponent(empty))   
                    .addGroup(layout.createParallelGroup(LEADING)   
                        .addGroup(layout.createSequentialGroup()
                            .addComponent(empty)
                            .addComponent(timerLabel)
                            .addComponent(empty))
                        .addComponent(fldr)
                        .addGroup(layout.createSequentialGroup()
                            .addComponent(empty)
                            .addComponent(empty)
                            .addComponent(strtButton)))

                    .addGroup(layout.createParallelGroup(LEADING)
                        .addComponent(empty)
                        .addComponent(chFldrButton)
                        .addComponent(PstPndButton))            
        ));

    layout.linkSize(SwingConstants.VERTICAL, empty, empty, empty, strtButton, PstPndButton);


    layout.setVerticalGroup(layout.createSequentialGroup()
            .addComponent(msgLbl)
            .addGroup(layout.createParallelGroup(LEADING)
                .addComponent(empty)
                .addComponent(empty)
                .addComponent(timerLabel)
                .addComponent(empty)
                .addComponent(empty))
            .addGroup(layout.createParallelGroup(LEADING)
                .addComponent(fldrLbl3)
                .addComponent(fldr)
                .addComponent(chFldrButton))
            .addGroup(layout.createParallelGroup(LEADING)
                    .addComponent(empty)
                    .addComponent(empty)
                    .addComponent(empty)
                    .addComponent(strtButton)
                    .addComponent(PstPndButton))

        );

But it is not display correctly for some reasone. I think I'm missing something, can you help me??

//**********************************************************************// What I was missing is the use of Alignment enum: LEADING, TRAILING, CENTER, and BASELINE.

It was more cleare when i followed: How to Use GroupLayout

Just for futur users the correct way is:

layout.setHorizontalGroup(layout.createSequentialGroup()
        .addComponent(fldrLbl3)
        .addGroup(layout.createParallelGroup()
            .addGroup(layout.createParallelGroup(CENTER)
                .addComponent(msgLbl)
                .addComponent(timerLabel))
            .addGroup(layout.createParallelGroup(TRAILING )
                .addComponent(fldr)
                .addComponent(strtButton)) )
        .addGroup(layout.createParallelGroup(LEADING)
            .addComponent(chFldrButton)
            .addComponent(PstPndButton))
            );


    layout.setVerticalGroup(layout.createSequentialGroup()
        .addGroup(layout.createParallelGroup(CENTER)
                .addComponent(msgLbl))
        .addGroup(layout.createParallelGroup(CENTER)
                .addComponent(timerLabel))
        .addGroup(layout.createParallelGroup(BASELINE)
                .addComponent(fldrLbl3)
                .addComponent(fldr)
                .addComponent(chFldrButton))
        .addGroup(layout.createParallelGroup(BASELINE)
                .addComponent(strtButton)
                .addComponent(PstPndButton)
                )

        );

Answer 1

Here is the output, using Nested Layout

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

public class NestedLayout {

    private static final int GAP = 5;
    private Random random;

    public NestedLayout () {
        random = new Random ();
    }

    private void displayGUI () {
        JFrame frame = new JFrame ( "Nested Layout Example" );
        frame.setDefaultCloseOperation ( JFrame.DISPOSE_ON_CLOSE );

        JPanel contentPane = new JPanel ();
        contentPane.setBorder ( BorderFactory.createEmptyBorder (
                                GAP, GAP, GAP, GAP) );
        contentPane.setLayout ( new GridLayout ( 4, 1, GAP, GAP ) );

        contentPane.add ( getHeaderPanel () );
        contentPane.add ( getMiddlePanel () );
        contentPane.add ( getFooterPanel () );
        contentPane.add ( getPSPanel () );

        frame.setContentPane ( contentPane );
        frame.pack ();
        frame.setLocationByPlatform ( true );
        frame.setVisible ( true );
    }

    private JPanel getHeaderPanel () {
        JPanel panel = new JPanel ();
        panel.setLayout ( new BorderLayout ( GAP, GAP) );
        panel.setBorder ( BorderFactory.createEmptyBorder (
                                GAP, GAP, GAP, GAP) );
        panel.add ( getLabel ( "Header JLabel" ), BorderLayout.CENTER );

        return panel;
    }

    private JPanel getMiddlePanel () {
        JPanel panel = new JPanel ();
        panel.setLayout ( new GridBagLayout () );
        panel.setBorder ( BorderFactory.createEmptyBorder (
                                GAP, GAP, GAP, GAP) );
        panel.add ( getLabel ( "Middle JLabel" ) );

        return panel;
    }

    private JPanel getFooterPanel () {
        JPanel panel = new JPanel ();
        panel.setLayout ( new BorderLayout ( GAP, GAP) );
        panel.setBorder ( BorderFactory.createEmptyBorder (
                                GAP, GAP, GAP, GAP) );

        panel.add ( getLabel ( "Left JLabel" ), BorderLayout.LINE_START );
        panel.add ( getLabel ( "Center JLabel" ), BorderLayout.CENTER );
        panel.add ( getLabel ( "Right JLabel" ), BorderLayout.LINE_END );

        return panel;
    }

    private JPanel getPSPanel () {
        JPanel panel = new JPanel ();
        panel.setLayout ( new FlowLayout ( FlowLayout.RIGHT, GAP, GAP) );
        panel.setBorder ( BorderFactory.createEmptyBorder (
                                GAP, GAP, GAP, GAP) );

        panel.add ( getLabel ( "First JLabel" ) );
        panel.add ( getLabel ( "Second JLabel" ) );

        return panel;
    }

    private JLabel getLabel ( String text ) {
        JLabel label = new JLabel ( text, JLabel.CENTER );
        label.setOpaque ( true );
        label.setBackground ( getRandomColour () );
        return label;
    }

    private Color getRandomColour () {
        return new Color ( random.nextFloat (), random.nextFloat (),
                            random.nextFloat (), random.nextFloat () );
    }

    public static void main ( String[] args ) {
        Runnable runnable = new Runnable () {
            @Override
            public void run () {
                new NestedLayout ().displayGUI ();
            }
        };
        EventQueue.invokeLater ( runnable );
    }
}

OUTPUT: