Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

NetBeans, GUI builder (group layout) centering a component

I'm trying to design a JButton (an "Ok" button) that to look good has to be horizontally centered in the containing JFrame.
I'm using the GUI Builder with the Free Form layout (GroupLayout).

I've taken several GUI builder tutorials (http://netbeans.org/kb/docs/java/quickstart-gui.html) but haven't found this topic. In other gui builders (delphi) this can be done by removing the anchors from both edges.

like image 458
AgostinoX Avatar asked Oct 10 '11 10:10

AgostinoX


People also ask

How do I center a component in NetBeans?

Components can be centered in the parallel group by passing the GroupLayout. Alignment. CENTER parameter.

How do I center a component in JFrame?

Use a GridBagLayout . By default any component (panel) added to the layout will be centered: //add(panel); setLayout( new GridBagLayout() ); add(panel, new GridBagConstraints()); This will allow you to use your FormLayout on the panel containing your components.

How do I change layout space in NetBeans?

Right-click one of the buttons and choose Edit Layout Space from the popup menu. The Edit Layout Space dialog box is displayed.


2 Answers

GroupLayout does support centering of components. It is a very capable layout manager. I personally put it after the MigLayout manager and before the FormLayout manager.

In the following three examples, we have a panel and a button. The button is horizontally centered.

Centering with NetBeans Builder

To center a component using a Netbeans Builder, we need to create horizontal resizable gaps from both sides of the button.

The green area of the screenshot is a currently selected gaps. The strings inside the gaps suggest that it is a resizable gap.

NetBeans screenshot

The gaps are automatically added when we place components on the form. To define a gap to be resizable, we right click on the gap and select the "Edit Layout Space" option. We get the following dialog:

NetBeans screenshot

To get a resizable gap, we check the Resizable check box.

Centering manually by using a parallel group

Components can be centered in the parallel group by passing the GroupLayout.Alignment.CENTER parameter.

package com.zetcode;

import java.awt.Container;
import java.awt.EventQueue;
import javax.swing.BorderFactory;
import javax.swing.GroupLayout;
import static javax.swing.GroupLayout.Alignment.CENTER;
import static javax.swing.GroupLayout.DEFAULT_SIZE;
import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JPanel;

public class GroupLayoutCenter extends JFrame {

    public GroupLayoutCenter() {

        initUI();

        setTitle("Centered button");
        setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        setLocationRelativeTo(null);        
    }

    private void initUI() {

        Container pane = getContentPane();
        GroupLayout gl = new GroupLayout(pane);
        pane.setLayout(gl);    

        gl.setAutoCreateGaps(true);
        gl.setAutoCreateContainerGaps(true);

        JPanel pnl = new JPanel();
        pnl.setBorder(BorderFactory.createEtchedBorder());

        JButton btn = new JButton("Button");

        gl.setHorizontalGroup(gl.createParallelGroup(CENTER)
           .addComponent(pnl, DEFAULT_SIZE, 200, DEFAULT_SIZE)
           .addComponent(btn)
        );

        gl.setVerticalGroup(gl.createSequentialGroup()
           .addComponent(pnl, DEFAULT_SIZE, 200, DEFAULT_SIZE)
           .addComponent(btn)            
        );          

        pack();
    }


    public static void main(String[] args) {

        EventQueue.invokeLater(new Runnable() {
            @Override
            public void run() {
                GroupLayoutCenter ex = new GroupLayoutCenter();
                ex.setVisible(true);
            }
        });
    }
}

Centering manually by using gaps

This solution is what NetBeans generated code does. We place two resizable gaps to the left and right sides of the button.

package com.zetcode;

import java.awt.Container;
import java.awt.EventQueue;
import javax.swing.BorderFactory;
import javax.swing.GroupLayout;
import static javax.swing.GroupLayout.DEFAULT_SIZE;
import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JPanel;

public class GroupLayoutCenter2 extends JFrame {

    public GroupLayoutCenter2() {

        initUI();

        setTitle("Centered button");
        setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        setLocationRelativeTo(null);        
    }

    private void initUI() {

        Container pane = getContentPane();
        GroupLayout gl = new GroupLayout(pane);
        pane.setLayout(gl);    

        gl.setAutoCreateGaps(true);
        gl.setAutoCreateContainerGaps(true);

        JPanel pnl = new JPanel();
        pnl.setBorder(BorderFactory.createEtchedBorder());

        JButton btn = new JButton("Button");

        gl.setHorizontalGroup(gl.createParallelGroup()
                .addComponent(pnl, DEFAULT_SIZE, 200, DEFAULT_SIZE)
                .addGroup(gl.createSequentialGroup()
                        .addGap(5, 100, Short.MAX_VALUE)
                        .addComponent(btn)
                        .addGap(5, 100, Short.MAX_VALUE))
        );

        gl.setVerticalGroup(gl.createSequentialGroup()
                .addComponent(pnl, DEFAULT_SIZE, 200, DEFAULT_SIZE)
                .addComponent(btn)
        );    

        pack();
    }


    public static void main(String[] args) {

        EventQueue.invokeLater(new Runnable() {
            @Override
            public void run() {
                GroupLayoutCenter2 ex = new GroupLayoutCenter2();
                ex.setVisible(true);
            }
        });
    }
}

enter image description here

like image 91
Jan Bodnar Avatar answered Sep 28 '22 12:09

Jan Bodnar


If you want your component to remain centered in its container if the container is resized, you have several options available to you, but I don't think that GroupLayout is one of them (please correct me if I'm wrong). One way is to change the container's layout to GridBagLayout, and then simply add the JButton into it without any constraints.

like image 40
Hovercraft Full Of Eels Avatar answered Sep 28 '22 12:09

Hovercraft Full Of Eels