Java Swing UI 布局

Question

我正在 Swing 中创建一个基本的用户界面，希望能得到一些帮助。下面是我想要实现的截图：

我目前的代码如下：

package testui;

import java.awt.Container;
import javax.swing.*;

public class TestUI{

    private JTextField outputArea = new JTextField();
    private JTextField errorReportArea = new JTextField();
    
    private JPanel inputPanel = new JPanel();
    
    private JLabel nameLabel = new JLabel("Item Name");
    private JLabel numberLabel = new JLabel("Number of units (or Volume in L)");
    private JLabel priceLabel = new JLabel("Price per unit (Or L) in pence");
    
    private JTextField nameField = new JTextField(10);
    private JTextField numberField = new JTextField(10);
    private JTextField priceField = new JTextField(10);
    
    private JButton addVolumeButton = new JButton("Add by Volume");
    private JButton addNumberButton = new JButton("Add by number of units");         
    
    public TestUI() {
        JFrame frame = new JFrame("Fuel Station");
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        
        outputArea.setEditable(false);
        errorReportArea.setEditable(false);
        
        inputPanel.setLayout(new BoxLayout(inputPanel, BoxLayout.X_AXIS));
        inputPanel.add(nameLabel);
        inputPanel.add(nameField);
        inputPanel.add(numberLabel);
        inputPanel.add(numberField);
        inputPanel.add(priceLabel);
        inputPanel.add(priceField);
        inputPanel.add(addVolumeButton);
        inputPanel.add(addNumberButton);
        
        Container contentPane = frame.getContentPane();
        contentPane.setLayout(new BoxLayout(contentPane, BoxLayout.Y_AXIS));
        contentPane.add(outputArea);
        contentPane.add(errorReportArea);
        contentPane.add(inputPanel);
        
        frame.pack();
        frame.setVisible(true);
    }
    
    public static void main(String[] args) {
        TestUI test1 = new TestUI();
    }
    
}

看起来像这样：

所以我想做的是为顶部的两个 JTextField 设置一个特定的大小，因为顶部的将包含多行文本，而下面的将只包含一行文本。我不确定如何在不使用 setSize 的情况下执行此操作，因为有人告诉我使用它是不好的编码习惯。

我还想在底部 JPanel 的 JLabels、JTextFields 和 JButtons 之间添加一些填充。

如果有人可以就调整这些组件的大小给我一些建议，我将不胜感激

Answer 1

• 由于您希望您的文本字段是多行的，请使用JTextAreas。 JTextField 仅是单行的。
• 您的组件彼此相邻，这与您的预期结果不同。在您致电frame.pack() 之前，可能有一些方法可以为您的组件提供一些喘息的空间
• 寻找任何可以使组件填满它给定的空间总量的方法；尤其是当您希望某物填满一大块空间时。
• 您可以为 JTextFields/JTextAreas 设置列数，而不是使用 setSize()。只是说说而已。
• 查看所有 Java's Layout Managers 将帮助您了解每个布局管理器的功能和用例

Answer 2

有一些布局管理器足够灵活，可以执行此操作，例如 Mig、Gridbag 和 SpringLayout。

在您的情况下，您将受到以下限制：

outputarea - south 边界从contentPane 的北边界限制为###px

inputPanel - north 边界从contentPane 的南边界限制为##px。

WindowBuilder 等 GUI 构建器可让您快速完成此操作。您只需将布局放到 contentPane 上，然后设置约束。

Answer 3

如果您必须使用盒子布局，请查看 Box 中的粘胶和刚性区域方法。如果您可以使用其他布局，请使用其他答案建议的布局。

Answer 4

我已经使用MigLayout 经理创建了一个解决方案。

以下是一些建议：

• 将应用程序代码放在构造函数之外；在解决方案中，代码 放在initUI() 方法中。
• 应用程序应在 EDT 上通过调用 EventQueue.invokeLater()。 （请参阅所提供解决方案的main() 方法。）
• 使用现代、灵活的布局管理器：MigLayout、GroupLayout 或 FormLayout。 花一些时间研究它们以充分了解布局管理过程。它 对这个主题有很好的理解很重要。
• 缩短标签；使用更具描述性的工具提示 而是。

package com.zetcode;

import java.awt.EventQueue;
import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JScrollPane;
import javax.swing.JTextArea;
import javax.swing.JTextField;
import net.miginfocom.swing.MigLayout;

public class MigLayoutSolution extends JFrame {

    private JTextArea outputArea;
    private JTextField errorReportField;

    private JLabel nameLabel;
    private JLabel numberLabel;
    private JLabel priceLabel;

    private JTextField nameField;
    private JTextField numberField;
    private JTextField priceField;

    private JButton addVolumeButton;
    private JButton addNumberButton;

    public MigLayoutSolution() {

        initUI();
    }

    private void initUI() {

        setLayout(new MigLayout());

        outputArea = new JTextArea(10, 20);
        errorReportField = new JTextField(15);

        nameLabel = new JLabel("Item name");
        numberLabel = new JLabel("# of units");
        numberLabel.setToolTipText("Number of units (or Volume in L)");
        priceLabel = new JLabel("Price per unit");
        priceLabel.setToolTipText("Price per unit (Or L) in pence");
        nameField = new JTextField(10);
        numberField = new JTextField(10);
        priceField = new JTextField(10);

        addVolumeButton = new JButton("AddVol");
        addVolumeButton.setToolTipText("Add by Volume");
        addNumberButton = new JButton("AddNum");
        addNumberButton.setToolTipText("Add by number of units");

        add(new JScrollPane(outputArea), "grow, push, wrap");
        add(errorReportField, "growx, wrap");
        add(nameLabel, "split");
        add(nameField);
        add(numberLabel);
        add(numberField);
        add(priceLabel);
        add(priceField);
        add(addVolumeButton);
        add(addNumberButton);

        pack();

        setTitle("Fuel station");
        setLocationRelativeTo(null);
        setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
    }

    public static void main(String[] args) {

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