MigLayout, aligning all components at center of JFrame

Question

how can I align my components at JPanel at the center of JFrame.

Here are my codes and what i got

I want like this

_{(source: hizliresim.com)}

MainFrame

import javax.swing.JFrame;
import javax.swing.JPanel;

public class MainFrame extends JFrame {


private static MainFrame instance = new MainFrame();

public static MainFrame getInstance() {
    return instance;
}

public static void switchToPanel(JPanel p) {
    getInstance().setContentPane(p);
    getInstance().validate();
}

private MainFrame() {
    setTitle("FavMovies");
    setSize(400, 400);
    setLocationRelativeTo(null);
    setVisible(true);

    setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

}

public static void main(String[] args) {
    MainFrame.switchToPanel(new LoginPanel());
}
}

LoginPanel

import javax.swing.*;
import net.miginfocom.swing.MigLayout;



public class LoginPanel extends JPanel {

// PROPERTIES

private JTextField inputUsername;
private JPasswordField inputPassword;

// CONSTRUCTOR

public LoginPanel() {

    setSize(400,400);

    // COMPONENTS

    inputUsername = new JTextField(10);
    inputPassword = new JPasswordField(10);
    JButton loginButton = new JButton("Login");
    JButton createButton = new JButton( "Create User");

    setLayout(new MigLayout());

    // first row
    add(new JLabel( "Username: "));
    add(inputUsername, "wrap 5");

    // second row
    add(new JLabel( "Password: "));
    add(inputPassword, "wrap 10");

    // final row        
    add(loginButton);
    add(createButton); 


}

}

I hope I could explain :( I hope I could explain :( I hope I could explain :( I hope I could explain :(

Answer 1

The GridBagLayout will center components automatically. So set the layout of the frame to use a GridBagLayout and then just add your login panel to the frame:

//getInstance().setContentPane(p);
getInstance().setLayout( new GridBagLayout() );
getInstance().add(p);

Edit:

However, when i resize it, i was able to see loginPanel at center.

It looks like you are adding a component to a visible GUI. So you need to manually invoke the layout manager and repaint the component.

getInstance().validate();
getInstance().revalidate();
getInstance().repaint();

The structure of your code is really complicated. You should read the Swing tutorial for better examples and you won't have this problem. Maybe start with the LabelDemo from How to Use Labels.

If you need the ability to swap panels, then take a look at the section from the Swing tutorial on How to Use CardLayout, which was designed for this purpose.

Answer 2

I see no reason to use GridBagLayout. This is a trivial thing to achieve in MigLayout.

package com.zetcode;

import javax.swing.JButton;
import javax.swing.JComponent;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JTextField;
import javax.swing.SwingUtilities;
import net.miginfocom.swing.MigLayout;

/*
Centering components in MigLayout manager.
Author: Jan Bodnar
Website: zetcode.com
 */
public class MigLayoutMoviesEx extends JFrame {

    public MigLayoutMoviesEx() {

        initUI();
    }

    private void initUI() {

        JLabel lbl1 = new JLabel("User name");
        JLabel lbl2 = new JLabel("Password:");

        JTextField field1 = new JTextField(10);
        JTextField field2 = new JTextField(10);

        JButton btn1 = new JButton("Login");
        JButton btn2 = new JButton("Create user");

        createLayout(lbl1, field1, lbl2, field2, btn1, btn2);

        setTitle("MigLayout example");
        setLocationRelativeTo(null);
        setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
    }

    private void createLayout(JComponent... arg) {

        setLayout(new MigLayout("align 50% 50%"));

        add(arg[0]);
        add(arg[1], "wrap");
        add(arg[2]);
        add(arg[3], "wrap");
        add(arg[4]);
        add(arg[5]);

        pack();
    }

    public static void main(String[] args) {

        SwingUtilities.invokeLater(() -> {
            MigLayoutMoviesEx ex = new MigLayoutMoviesEx();
            ex.setVisible(true);
        });
    }
}

To center the components, we use the align 50% 50% constraint.

Here is the screenshot: