繁体   English   中英

GUI:如何正确设置布局

[英]GUI: how to properly set layout

我在设置布局时遇到了一些问题。 (不要介意按钮的大小,我只想正确理解布局)。

这是我想要制作的窗口:

我想做的图片

这是我试过的窗口:

我试过

这是我的代码:

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

class Grid extends JFrame
{
    private JTextField t1;
    private JTextField t2;
    private JCheckBox c1;
    private JCheckBox c2;
    private JButton b1;
    private JButton b2;
    private JButton b3;
    private JPanel ButtonPanel1;
    private JPanel ButtonPanel2;
    private JPanel ButtonPanel3;
    private JPanel CheckPanel1;
    private JPanel CheckPanel2;
    private JPanel TextPanel1;
    private JPanel TextPanel2;
    private JPanel EastPanel;
    private JPanel CenterPanel;
    private JPanel WestPanel;
    private JLabel l1;
    private JLabel l2;

    public Grid()
    {
        //CheckBoxes
         c1 = new JCheckBox("Snap to Grid");
         c2 = new JCheckBox("Show Grid");

         CheckPanel1 = new JPanel();
         CheckPanel1.add(c1);

         CheckPanel2 = new JPanel();
         CheckPanel2.add(c2);
         WestPanel = new JPanel(new GridLayout(2,1));
         WestPanel.add(c1);
         WestPanel.add(c2);
         add(WestPanel,BorderLayout.WEST);

          //I don't get how to arrange the labels aligned with the textfields. 

         //TextFields
         l1 = new JLabel("X:");
         t1 = new JTextField("8",3);
         l2 = new JLabel("Y:");
         t2 = new JTextField("8",3);

         TextPanel1 = new JPanel();
         TextPanel1.add(l1);
         TextPanel1.add(t1);

         TextPanel2 = new JPanel();
         TextPanel2.add(l2);
         TextPanel2.add(t2);

         CenterPanel = new JPanel(new GridLayout(2,1));
         CenterPanel.add(l1);
         CenterPanel.add(l2);
         CenterPanel.add(t1);
         CenterPanel.add(t2);
         add(CenterPanel,BorderLayout.CENTER); 

         // Buttons
         b1 = new JButton("Ok");
         b2 = new JButton("Cancel");
         b3 = new JButton("Help");

         ButtonPanel1 = new JPanel();
         ButtonPanel1.add(b1);

         ButtonPanel2 = new JPanel();
         ButtonPanel2.add(b2);

         ButtonPanel3 = new JPanel();
         ButtonPanel3.add(b3);

         EastPanel = new JPanel(new GridLayout(3,1));
         EastPanel.add(ButtonPanel1);
         EastPanel.add(ButtonPanel2);
         EastPanel.add(ButtonPanel3);

         add(EastPanel, BorderLayout.EAST);

    }
}

public class oottest {

    public static void main(String[] args) {

        Grid app = new Grid();

        app.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        app.setSize(300,150);
        app.setVisible(true);
    }

}

谁能帮我理解布局是如何工作的?

我一直在观看很多视频并尝试了不同的布局,但仍然无法做到正确。 告诉我我是否使用了正确的布局,或者我是否应该更改它。

答案中提出的GridBagLayout可以为左侧部分提供所需的所有控件。
如果你愿意为了简单而牺牲一些控制,你可以在GridLayout使用两个FlowLayout面板:

在此处输入图片说明

import java.awt.BorderLayout;
import java.awt.GridLayout;
import javax.swing.JButton;
import javax.swing.JCheckBox;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPanel;
import javax.swing.JTextField;

class Grid extends JFrame
{
    private JTextField t1, t2;
    private JCheckBox c1, c2;
    private JButton b1, b2, b3;
    private JPanel topPanel, bottomPanel;
    private JPanel eastPanel, centerPanel;
    private JLabel l1, l2;

    public Grid()
    {
         c1 = new JCheckBox("Snap to Grid");
         l1 = new JLabel("X:");
         t1 = new JTextField("8",3);

         topPanel = new JPanel();//uses flow layout by default
         topPanel.add(c1); topPanel.add(l1); topPanel.add(t1);

         c2 = new JCheckBox("Show Grid");
         l2 = new JLabel("Y:");
         t2 = new JTextField("8",3);

         bottomPanel = new JPanel();
         bottomPanel.add(c2);  bottomPanel.add(l2); bottomPanel.add(t2);

         centerPanel = new JPanel(new GridLayout(2,1));
         centerPanel.add(topPanel);
         centerPanel.add(bottomPanel);
         add(centerPanel,BorderLayout.CENTER);

         b1 = new JButton("Ok");
         b2 = new JButton("Cancel");
         b3 = new JButton("Help");

         eastPanel = new JPanel(new GridLayout(3,1));
         eastPanel.add(b1);
         eastPanel.add(b2);
         eastPanel.add(b3);
         add(eastPanel, BorderLayout.EAST);
    }

    public static void main(String[] args) {

        Grid app = new Grid();
        app.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        app.setSize(300,150);
        app.setVisible(true);
    }
}

应用此策略的更多示例: 1 23

我会为右侧的按钮使用单列GridLayout ,为它们左侧的所有内容使用GridBagLayout 将带有按钮的面板放在BorderLayoutLINE_END中,其余放在CENTER

这是它的外观:

在此处输入图片说明

为所需的空白调整边距、布局填充、插入和空边框。 (不包括电池。)

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM