java - Java Swing 中的 HMI 分层

Question

我请求您的帮助，因为我想开发一个聊天界面（我正在使用 Sockets 等进行培训）。问题是（我很生气），我确切地知道我想要什么，但我做不到！

我期望的图像：

理论案例

我使用不同的 JPanel 来实现不同的视图，然后我尝试将它与 GridBagLayout 混合。

我能得到的最好的就是这个（我为标题和控制台面板着色）：

在实践中

我在不同的类中实现了不同的面板，我在一个类中实现了主视图，所以有 mainView 代码：

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;
}

}

score 3 · Accepted Answer

放入 JPanel 的 JComponents 默认返回自己的 PreferredSize，然后没有理由为子 JPanel 设置任何维度
JFrame（对所有顶级容器有效）已在 API BorderLayout 中实现（无间隙）
JPanel 实现了 FlowLayout，然后接受来自子级的 PreferredSize，但子级的 Size 不可调整大小，保持不变
其余的 JComponets 还没有实现任何布局管理器
不调整大小，放在那里 JComponents，GUI 将正确显示，无需对 Size 或 Dimension 进行任何额外设置（例如 JTextField(10)、JTextArea (10, 15) 等...），
StandardLayout manager 完全忽略 setSize() ...，默认只接受 PreferredSize

编辑/

如果您只想将一个 JComponent 放入容器并且该容器将被全部占用，则将 LayoutManager (FlowLayout) JPanel 更改为 BorderLayout 然后将 JScrollPane 放入 BorderLayout.CENTER，JTextArea 的大小将为从 JTextArea(10, 15) 计算得出，肯定要玩这些数字 :-)，对于每个 JPanel，将在一个 JFrame 中放置很多 JComponent

/编辑

例如，

在此处输入图像描述

import java.awt.BorderLayout;
import java.awt.Color;
import java.awt.EventQueue;
import java.awt.GridLayout;
import javax.swing.JFrame;
import javax.swing.JPanel;

public class NestedLayout {

    private JFrame frame = new JFrame();
    private JPanel centerParent = new JPanel();
    private JPanel centerNorth = new JPanel();
    private JPanel centerCenter = new JPanel();
    private JPanel eastParent = new JPanel();
    private JPanel eastTop = new JPanel();
    private JPanel eastBottom = new JPanel();
    private JPanel southParent = new JPanel();

    public NestedLayout() {
        centerNorth.setBackground(Color.GREEN);
        centerCenter.setBackground(Color.YELLOW);
        centerParent.setBackground(Color.GRAY);
        centerParent.setLayout(new BorderLayout(5, 5));
        centerParent.add(centerNorth, BorderLayout.NORTH);
        centerParent.add(centerCenter, BorderLayout.CENTER);
        southParent.setBackground(Color.CYAN);
        eastTop.setBackground(Color.MAGENTA);
        eastBottom.setBackground(Color.ORANGE);
        eastParent.setBackground(Color.DARK_GRAY);
        eastParent.setLayout(new GridLayout(2, 0, 5, 5));
        eastParent.add(eastTop);
        eastParent.add(eastBottom);
        frame.setLayout(new BorderLayout(5, 5));
        frame.add(centerParent, BorderLayout.CENTER);
        frame.add(southParent, BorderLayout.SOUTH);
        frame.add(eastParent, BorderLayout.EAST);
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        frame.pack();
        frame.setVisible(true);
    }

    public static void main(String[] a_args) {
        EventQueue.invokeLater(new Runnable() {

            @Override
            public void run() {
                NestedLayout NL = new NestedLayout();
            }
        });
    }
}

score 2 · Accepted Answer

IMO构建 Swing 布局的最简单和最有效的方法是使用MigLayout。此布局可以轻松替换 JDK 中可用的任何其他布局。

这是一个快速示例，显示您正在尝试构建的 UI。注意：用户界面可调整大小

在此处输入图像描述

这是相关的代码

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");
    }

}

java - Java Swing 中的 HMI 分层

2 回答 2

Related

Reference