Question

I ask for your help because I want to develop an interface for a chat (I’m training with Sockets etc .). The problem is (I’m getting mad with it), I know exactly what I want but I can’t do it!

An image of what I expect :

I used different JPanel to implement the different views and after that I tried to mix it with a GridBagLayout.

The best I can obtain is this (I colored the header and the console panels) :

I implemented the different panels in different classes and I implement the main view in one class, so there is the mainView code :

import java.awt.Dimension;
import java.awt.FlowLayout;
import java.awt.GridBagConstraints;
import java.awt.GridBagLayout;
import java.awt.event.WindowEvent;
import java.awt.event.WindowListener;
import javax.swing.JFrame;
import javax.swing.JMenu;
import javax.swing.JMenuBar;
import javax.swing.JMenuItem;
import javax.swing.JPanel;
import javax.swing.UIManager;

import com.awax.tchat.client.panels.Header;
import com.awax.tchat.client.panels.MessageBox;
import com.awax.tchat.client.panels.ServerBox;
import com.awax.tchat.client.panels.TchatBox;
import com.awax.tchat.client.panels.UsersBox;

public class TchatView extends JFrame {

private static final long serialVersionUID = 1L;

protected TchatModel tchatModel;
protected TchatController tchatController;

protected JMenuBar menuBar; // Barre des menus de la fenêtre
protected JMenu menuFichier; // Menu Fichier
protected JMenu menuAide; // Menu Aide

protected Header header; // Entête du tchat
protected MessageBox messageBox; // Boîte d'envoi des messages
protected ServerBox serverBox; // Boîte connexion au serveur
protected TchatBox tchatBox; // Affichage de la console
protected UsersBox usersBox; // Boîte d'affichage des utilisateurs connectés


public TchatView () {
    super("Tchat - v0.1 Alpha");
    this.setDefaultCloseOperation(EXIT_ON_CLOSE);
    this.setLocation(200, 100);
    this.setSize(new Dimension(1000, 800));
    try {
        UIManager.setLookAndFeel("com.sun.java.swing.plaf.windows.WindowsLookAndFeel");
    } catch (Exception e) {
        e.printStackTrace();
    }
}

/*
 * Méthodes publiques
 */

// Permet d'initialiser les différents panels de l'interface
public void initView () {
    this.header = new Header();
    this.messageBox = new MessageBox(this.tchatModel, this.tchatController);
    this.serverBox = new ServerBox(this.tchatModel, this.tchatController);
    this.tchatBox = new TchatBox(this.tchatModel, this.tchatController);
    this.usersBox = new UsersBox(this.tchatModel, this.tchatController);

    setStyle();

    this.addWindowListener(new Window_Listener());
}

/*
 * Méthodes protégées
 */

// Permet de créer les éléments de la fenêtre
protected void setStyle () {
    GridBagConstraints gbc = new GridBagConstraints();
    initMenuBar();

    this.setLayout(new GridBagLayout());

    gbc.weightx = 1.;
    gbc.weighty = 1.;
    gbc.anchor = GridBagConstraints.FIRST_LINE_START;
    gbc.fill = GridBagConstraints.HORIZONTAL;
    this.add(this.header, gbc);

    gbc.gridx = 0;
    gbc.gridy = 1;
    gbc.gridwidth = 1;
    gbc.gridheight = 2;
    gbc.anchor = GridBagConstraints.NORTHWEST;
    gbc.fill = GridBagConstraints.BOTH;
    this.add(this.tchatBox, gbc);

    gbc.gridx = 1;
    gbc.gridy = 0;
    gbc.gridwidth = 1;
    gbc.gridheight = 1;
    gbc.anchor = GridBagConstraints.FIRST_LINE_END;
    gbc.fill = GridBagConstraints.NONE;
    this.add(this.serverBox, gbc);

    gbc.gridx = 1;
    gbc.gridy = 2;
    gbc.gridwidth = 1;
    gbc.gridheight = 1;
    gbc.anchor = GridBagConstraints.PAGE_START;
    gbc.fill = GridBagConstraints.WEST;
    this.add(this.usersBox, gbc);

    gbc.gridx = 0;
    gbc.gridy = 3;
    gbc.gridwidth = 2;
    gbc.gridheight = 1;
    gbc.anchor = GridBagConstraints.FIRST_LINE_START;
    gbc.fill = GridBagConstraints.BOTH;
    this.add(this.messageBox, gbc);
}

// Permet de créer la barre des menus de la fenêtre
protected void initMenuBar () {
    JMenuItem item1, item2, item3, item4;

    this.menuBar = new JMenuBar();
    this.menuFichier = new JMenu("Fichier");
    this.menuAide = new JMenu("Aide");

    item1 = new JMenuItem("Item1");
    item2 = new JMenuItem("Item2");
    item3 = new JMenuItem("Item3");
    item4 = new JMenuItem("Item4");

    this.menuFichier.add(item1);
    this.menuFichier.add(item2);
    this.menuAide.add(item3);
    this.menuAide.add(item4);
    this.menuBar.add(this.menuFichier);
    this.menuBar.add(this.menuAide);

    this.setJMenuBar(this.menuBar);
}

/*
 * Listeners
 */

protected class Window_Listener implements WindowListener {
    @Override
    public void windowActivated (WindowEvent arg0) {
    }
    @Override
    public void windowClosed (WindowEvent arg0) {
    }
    @Override
    public void windowClosing (WindowEvent arg0) {
        tchatController.disconnectFromServer();
    }
    @Override
    public void windowDeactivated (WindowEvent arg0) {
    }
    @Override
    public void windowDeiconified (WindowEvent arg0) {
    }
    @Override
    public void windowIconified (WindowEvent arg0) {
    }
    @Override
    public void windowOpened (WindowEvent arg0) {
    }
}

/*
 * Accesseurs
 */

public TchatModel getModel () {
    return tchatModel;
}

public void setModel (TchatModel tchatModel) {
    this.tchatModel = tchatModel;
}

public TchatController getController () {
    return tchatController;
}

public void setController (TchatController tchatController) {
    this.tchatController = tchatController;
}

}

Answer 1

IMO The easiest and most effective way of building Swing layouts is by using MigLayout. This layout can easily replace any other layout available in JDK.

Here is the quick example, showing UI you’re trying to build. NOTE: The UI is resizable

And here is the relevant code

import java.awt.Color;

import javax.swing.BorderFactory;
import javax.swing.JLabel;
import javax.swing.JPanel;
import javax.swing.SwingConstants;

import net.miginfocom.swing.MigLayout;

@SuppressWarnings("serial")
public class ChatPanel extends JPanel{
    public ChatPanel() {

        setLayout(new MigLayout("", "[grow][]", "[70px][grow][grow][50px]"));

        JLabel lbConsole = new JLabel("CONSOLE");
        lbConsole.setHorizontalAlignment(SwingConstants.CENTER);
        lbConsole.setBorder(BorderFactory.createLineBorder(Color.BLACK));

        JLabel lblMessageDialog = new JLabel("MESSAGE DIALOG");
        lblMessageDialog.setHorizontalAlignment(SwingConstants.CENTER);
        lblMessageDialog.setBorder(BorderFactory.createLineBorder(Color.BLACK));

        JLabel lblHeader = new JLabel("HEADER");
        lblHeader.setHorizontalAlignment(SwingConstants.CENTER);
        lblHeader.setBorder(BorderFactory.createLineBorder(Color.BLACK));

        JLabel lblServerInfos = new JLabel("SERVER INFOS");
        lblServerInfos.setVerticalAlignment(SwingConstants.TOP);
        lblServerInfos.setHorizontalAlignment(SwingConstants.CENTER);
        lblServerInfos.setBorder(BorderFactory.createLineBorder(Color.BLACK));

        JLabel lblConnectedUsers = new JLabel("CONNECTED USERS");
        lblConnectedUsers.setVerticalAlignment(SwingConstants.TOP);
        lblConnectedUsers.setHorizontalAlignment(SwingConstants.CENTER);
        lblConnectedUsers.setBorder(BorderFactory.createLineBorder(Color.BLACK));

        add(lblServerInfos, "cell 1 0 1 2,grow");
        add(lbConsole, "cell 0 1 1 2,grow");
        add(lblHeader, "cell 0 0,grow");
        add(lblConnectedUsers, "cell 1 2,grow");
        add(lblMessageDialog, "cell 0 3 2 1,grow");
    }

}