Java图形用户界面布局控制Layout练习

时间 2020-05-27

原文原文链接

尝试搭建登陆对话框，包含两个文字标签（用户名、服务器IP），两个文本输入条（用户名、服务器IP），一个按钮（登陆），按照本身认为合适的方式布局。
　　我把GridLayout（网格布局）、BorderLayout（边界布局）、FlowLayout（流式布局）三种布局进行了比较而且作了尝试。
　　终于到了使用Java获得图形反馈的结果，内心还有些小激动呢。虽然只是完成了界面的展现，没有功能的实现，可是成就感仍是蛮大的，并且查询JDK文档真的很是有收获。css

package gui;
import java.awt.*;
import javax.swing.*;
public class Dialog {

    public static void main(String[] args) {
        JDialog dialog=new JDialog();
        dialog.setTitle("登陆");

        TextField text1 = new TextField(10);
        TextField text2 = new TextField(15);

        JLabel label1 = new JLabel("昵称");
        JLabel label2 = new JLabel("服务器");

        JButton button1 = new JButton("登陆");

        JPanel panel1 = new JPanel();
        JPanel panel2 = new JPanel();
        JPanel panel3 = new JPanel();

        GridLayout gl = new GridLayout(3, 1);

        dialog.setLayout(gl);

        panel1.add(label1);
        panel1.add(text1);
        panel2.add(label2);
        panel2.add(text2);
        panel3.add(button1);

        dialog.add(panel1);
        dialog.add(panel2);
        dialog.add(panel3);

        dialog.setSize(300, 200);
        dialog.setLocationRelativeTo(null);
        dialog.setVisible(true);

    }

}

　　这个是咱们制做的聊天软件的登陆界面部分，在gui包下，这一部分用来显示图形界面。首先，导入对应的Java包，把人家“写”好的容器、组件拿来使用。
　　实际上图形界面的设计说白了也是类的关系，这也就是Java是面向对象的缘由。Swing类对AWT类进行了扩展。布局管理器分为容器类和组件类，咱们须要作的就是在容器中添加不一样组件，完成布局。
　　新建一个Dialog类，在主方法中，用JDialog类来创造一个Dialog的对象，这样实际上就建立了一个对话框，这样以后，只须要往其中加入相应的组件就行了。设置对话框的大小，用setSize方法设置长为300px，宽为200px。
　　对话框有了，而后用JDialog类添加三个容器。
　　创造两个标签，label取名为“用户名”，label2取名为“IP”，创造两个输入条,test一、test2根据需求最大容量为十、15。最后创造一个按钮，button1按钮对应的名称“登陆”。
　　把相应的组件放到指定的容器中。
　　既然GridLayout是一个类，那么就找到Gridlayout()构造方法，而后构造一个三行一列的布局对象g1。布局也是对象，很奇妙有木有。接着找到了对应的setLayout方法，而后设置布局。
　　根据顺序的不一样，把一个个容器用add方法添加到对话框中。
　　对话框设置后，但愿展示的位置在屏幕居中，setter方法设置为null。
　　目前界面布置好了，但是框架还不能显示，因而把可见性的setVisible法设为真值，如假包换的聊天工具界面就展示出来了。
　　还有一种布局格式主要使用的边界布局。html

package gui;
import java.awt.*;
import javax.swing.*;
public class LoginDialogDemo {

    public static void main(String[] args) {
        JDialog loginDialog=new JDialog();
        loginDialog.setTitle("登陆");

        JLabel usernameLabel=new JLabel("昵称");
        JLabel ipLabel=new JLabel("服务器");

        JTextField usernameField=new JTextField(10);
        JTextField ipField=new JTextField(10);

        JButton loginButton=new JButton("登陆");

        JPanel centerPanel=new JPanel(new GridLayout(2, 1));

        JPanel upPanel=new JPanel(new FlowLayout());
        upPanel.add(usernameLabel);
        upPanel.add(usernameField);

        JPanel downPanel=new JPanel();//JPanel默认用流式布局FlowLayout
        downPanel.add(ipLabel);
        downPanel.add(ipField);

        centerPanel.add(upPanel);
        centerPanel.add(downPanel);

        loginDialog.add(centerPanel,BorderLayout.CENTER);

        JPanel southPanel =new JPanel();
        southPanel.add(loginButton);

        loginDialog.add(southPanel, BorderLayout.SOUTH);

        loginDialog.setSize(300, 200);
        loginDialog.setLocationRelativeTo(null);
        loginDialog.setVisible(true);

    }

}

　　组件上大同小异，布局上须要CETER和SOUTH部分，CETER部分中创建一个centerPanel容器嵌套一个2行一列的网格布局，网格布局中加入两个容器，upPanel和downPanel两部分，第一行upPanel使用流式布局，添加相应的标签和文本输入条，第二行downPanel没有表示出来，可是使用了默认的流式布局，一样加入组件。
　　centerPanel在边框布局中默认放置于中部，因此不设置后面的属性BorderLayout.CENTER做用是同样的。由于只设置了中部区域和南部区域，因此中部会把未使用的区域占满，西、北、东区域将被中部占据位置。
　　南部区域加入southPanel组件，而后加入loginButton按钮，大功告成。
　　两种方式都完成了一样的效果，可是在实践中却有了不一样的收获。我熟悉了FlowLayout、GridLayout、BorderLayout三种布局样式，就像原来学习《HTML5与CSS3基础教程》的时候学会了布局的搭配，掌握了有效率的查询JDK文档，更重要的是理解布局管理器的类关系，对于理解Java面向对象的概念又上升了一个台阶。html5