Welcome to ShenZhenJia Knowledge Sharing Community for programmer and developer-Open, Learning and Share
menu search
person
Welcome To Ask or Share your Answers For Others

Categories

I'm trying to create a login form using Java Swing. But I want the layout to look tighter, but still responsive.

The structure of my project

Project/
└── src
    ├── GUI
    │?? ├── Control.java
    │?? ├── Main.java
    │?? └── pages
    │??     ├── LoginPanel.java
    └── Helper
        └── Helpers.java

Edit

After trying out the answer posted, I got:

This is the picture

The components in the form panel are not behaving as I would expect

And my code:

LoginPanel

package GUI.pages;
import javax.swing.*;

public class LoginPanel extends JPanel {

    private static final int PADDING = 30;
    // Some labels, button, groups and fields
    private static JLabel usernameLabel;
    private static JTextField usernameInputField;
    private static JLabel passwordLabel;
    private static JPasswordField passwordInputField;
    private static JButton submit;
    private static JLabel title = Helpers.generateTitle();


    public LoginPanel() {

        setLayout(new BorderLayout());
        setSize(400, 400);

        JPanel titleContainer = new JPanel();
        titleContainer.setLayout(new FlowLayout(FlowLayout.LEFT, PADDING, PADDING));
        titleContainer.add(title);

        // the username row
        usernameLabel = new JLabel("Username: ");
        usernameInputField = new JTextField(50);

        // The password row
        passwordLabel = new JLabel("Password: ");
        passwordInputField = new JPasswordField(150);

        JPanel form = new JPanel();
        form.setLayout(new GridBagLayout());

        GridBagConstraints c = new GridBagConstraints();
        c.fill = GridBagConstraints.HORIZONTAL;
        c.gridx = 0;
        c.gridy = 0;
        c.anchor = GridBagConstraints.WEST;
        c.insets = new Insets(0,20,0,0);
        form.add(usernameLabel, c);

        c = new GridBagConstraints();
        c.fill = GridBagConstraints.HORIZONTAL;
        c.gridx = 0;
        c.gridy = 1;
        c.anchor = GridBagConstraints.WEST;
        c.insets = new Insets(0,20,0,0);
        form.add(passwordLabel, c);

        c = new GridBagConstraints();
        c.gridx = 1;
        c.gridy = 0;
        c.weightx = 0.1;
        c.ipadx = 200;

        form.add(usernameInputField, c);

        c = new GridBagConstraints();
        c.gridx = 1;
        c.gridy = 1;
        c.weightx = 0.001;
        c.weightx = 0.001;
        c.ipadx = 200;

        form.add(passwordInputField, c);

        // The message label, the text depends on the query's result.
        message = new JLabel();

        // Configuring the submit button
        submit = new JButton("Sign in");
        submit.addActionListener(new LoginActionListener());
        submit.setActionCommand("login");

        // Configuring the redirecting button
        registerRedirect.setActionCommand("registerRedirect");
        registerRedirect.addActionListener(new Router());


        JPanel submitContainer = new JPanel();
        submitContainer.setLayout(new FlowLayout(FlowLayout.RIGHT, PADDING, PADDING));
        submitContainer.add(submit);

        form.setMaximumSize(new Dimension(200, passwordInputField.getHeight()));

        // adding everything to the layout

        add(titleContainer, BorderLayout.PAGE_START);
        add(form);
        add(submitContainer, BorderLayout.PAGE_END);

    }
}

Main

package GUI;

import javax.swing.*;
import GUI.pages.LoginPanel;

public class Main extends JFrame {

    public final static int WINDOW_WIDTH = 750;
    public final static int WINDOW_HEIGHT = 550;

    public static void main(String[] args){
        JFrame frame = new Main();
    }

    public Main(){
        JPanel login_panel = new LoginPanel();
        add(login_panel);
        setSize(WINDOW_WIDTH, WINDOW_HEIGHT);
        setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        setVisible(true);
    }

}

This is how I want it to look like(updated):

REM(the title)        
________________________________
           __________________
Username: [__________________]
           __________________
Password: [__________________]
                      
                   [Submit button]
                    
See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
thumb_up_alt 0 like thumb_down_alt 0 dislike
163 views
Welcome To Ask or Share your Answers For Others

1 Answer

enter image description here

I'm not clear if the submit button is right aligned or centered, but..

  • BLUE area: BorderLayout.
  • RED area: GridBagLayout - with labels right aligned, and text fields left aligned. In the CENTER of the border layout.
  • GREEN areas: FlowLayout with PAGE_START left aligned & PAGE_END either center aligned or right aligned (as per need).

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
thumb_up_alt 0 like thumb_down_alt 0 dislike
Welcome to ShenZhenJia Knowledge Sharing Community for programmer and developer-Open, Learning and Share
...