我想创建以下GUI:
但是我创建的GUI是:
我的网格布局如下:
我不明白为什么代码运行后会得到这个输出结果。我画了一张图来辅助编写代码,看上去应该没问题。
方法"addComp"将给定的输入组件添加到指定位置(x, y)和指定的组件宽度和高度的输入面板中。
代码:
import javax.swing.*;
import java.awt.*;
public class GUIError extends JFrame {
//initialise all the components
JPanel mainPanel = new JPanel();
JTextField txtDisplay = new JTextField();
JButton btnA = new JButton("A");
JButton btnB = new JButton("B");
JButton btnC = new JButton("C");
JButton btnD = new JButton("D");
JButton btnE = new JButton("E");
JButton btnF = new JButton("F");
JButton btnWA = new JButton("WA");
JButton btnWB = new JButton("WB");
JButton btnWC = new JButton("WC");
JButton btnWD = new JButton("WD");
private void addComp(JPanel panel, JComponent comp, int xPos, int yPos, int compWidth, int compHeight) {
GridBagConstraints gridConstraints = new GridBagConstraints();
gridConstraints.gridx = xPos;
gridConstraints.gridy = yPos;
gridConstraints.gridwidth = compWidth;
gridConstraints.gridheight = compHeight;
gridConstraints.weightx = 0.5;
gridConstraints.weighty = 0.5;
gridConstraints.insets = new Insets(5, 5, 5, 5);
gridConstraints.anchor = GridBagConstraints.CENTER;
gridConstraints.fill = GridBagConstraints.BOTH;
panel.add(comp, gridConstraints);
}
public static void main(String[] args) {
try {
for (UIManager.LookAndFeelInfo info : UIManager.getInstalledLookAndFeels()) {
if ("Nimbus".equals(info.getName())) {
UIManager.setLookAndFeel(info.getClassName());
break;
}
}
}
catch (Exception e) { }
SwingUtilities.invokeLater(new Runnable() {
public void run() {
// create frame
JFrame frame = new JFrame("Calculator");
frame.setDefaultCloseOperation(JFrame.DISPOSE_ON_CLOSE);
frame.setLocationRelativeTo(null);
Container c = frame.getContentPane();
// create GUI within frame
new GUIError(c);
// finish frame definition
frame.pack();
frame.setResizable(false);
frame.setVisible(true);
}
});
}
public GUIError(Container cont) {
cont.setPreferredSize(new Dimension(610, 250));
// parent panel containes every other panel
mainPanel.setLayout(new GridBagLayout());
// text display
txtDisplay.setEditable(false);
addComp(mainPanel, txtDisplay, 0, 0, 12, 2); // width 16, height 2
addComp(mainPanel, btnA, 0, 2, 2, 1);
addComp(mainPanel, btnB, 2, 2, 2, 1);
addComp(mainPanel, btnC, 4, 2, 2, 1);
addComp(mainPanel, btnD, 6, 2, 2, 1);
addComp(mainPanel, btnE, 8, 2, 2, 1);
addComp(mainPanel, btnF, 10, 2, 2, 1);
addComp(mainPanel, btnWA, 0, 3, 3, 1);
addComp(mainPanel, btnWB, 3, 3, 3, 1);
addComp(mainPanel, btnWC, 6, 3, 3, 1);
addComp(mainPanel, btnWD, 9, 3, 3, 1);
cont.add(mainPanel);
}
}
gridwidth
无法指定“半个网格”。我认为最好的选择是使用不同的布局,或将组件分成不同的面板(主面板在顶部包含一个字段,在下面有两个面板(并排)。每个子面板都有两个面板:一个用于三个较小的按钮,另一个下面有两个更大的按钮)。 - DioxinWA
和WB
占据与其他三个按钮相同的空间。正如你所看到的结果,你的组件似乎锁定在原位(与其他所有东西对齐)。由于你的小按钮,你有6个网格空间;你希望WA
占据下面1 1/2个网格空间,WB
占据另外1 1/2个网格空间(WC和WD也是如此)。在代码中,你没有尝试占据半个网格,但你要求的结果需要这样做。这可以通过切换布局或使用面板进行分离来完成。 - Dioxin