Java第二课:图形界面（实现QQ登陆界面）

最终效果图如下：

第一步：分析界面组成：根据三大布局的特点来确定由几大部分组成，哪些部分要用到JPanel.然后在窗体JFrame上用什么布局组合。
分析如下：

分为三大部分，如图三种不同彩色框（因为左边图案等于右边几行内容大小）。
分析各个部分如何实现：紫框：就是一张图片，用一个JLabel组件即可；红框：图片右靠上（流式布局的设置特点），用一个组件无法实现，要用到JPanel，用流式布局；黄框：也要用到一个JPanel和流式布局（根据组件大小，一行满了就换行）。三个部分放在窗体上用到北、西、中三个方位，很明显是边框布局。

第二步：开始编程：

（1）开头格式：

//1.新建Login类
public class Login {
    // 1.定义主函数
    public static void main(String[] args) {
        // 2.在主函数中实例化Login类的对象
        new Login();
    }

    // 1.构造方法
    public Login() {
        initUI();// 1.调用初始化界面的方法。
    }

    // 1.初始化界面的方法。
    public void initUI() {。。。。。。在这里编写界面}

（2）现在来写initUI方法

        //先实例化JFrame顶级容器组件类对象，设置组件的属性值：大小，标题，显示位置，关闭操作，布局，调整大小，可见
        JFrame w=new JFrame();
        w.setSize(430,330);
        w.setResizable(false);//禁止调整大小
        w.setUndecorated(true);//去掉自带的边框
        w.setLocationRelativeTo(null);//出现在电脑屏幕中央

        //再设组件：先设好组件，后面根据显示效果来在每个组件下面调整大小
        /*ImageIcon类:用来加载图片到程序中，图片文件最好放在与程序并列目录中，直接用下面方法调用*/
        ImageIcon pic1=new ImageIcon(this.getClass().getResource("pic1.png"));
        ImageIcon pic2=new ImageIcon(this.getClass().getResource("pic2.png"));
        /*JLabel标签元素组件类:显示文字或者图片*/
        JLabel ima1 = new JLabel(pic1);
        /*组件的设置大小:（除了JFrame用setSize,其余都用setPreferredSize包括JPanel），并且用到dimension封装类来实现*/
        ima1.setPreferredSize(new Dimension(300,180));
        JLabel ima2 = new JLabel(pic2);
        JLabel user=new JLabel("注册账号");
        user.setPreferredSize(new Dimension(80,25));
        JLabel password=new JLabel("找回密码");
        password.setPreferredSize(new Dimension(80,25));
        /*下拉框JComboBox：既可编辑文字，又可有选项直接选*/
        JComboBox txtUser=new JComboBox();
        txtUser.setEditable(true);
        txtUser.setPreferredSize(new Dimension(190,25));
        txtUser.addItem("1625002542");
        txtUser.addItem("2126341847");
        txtUser.addItem("3278523523");

        JPasswordField txtPass=new JPasswordField(17);
        JCheckBox cb1=new JCheckBox("记住密码");
        cb1.setPreferredSize(new Dimension(115,25));
        JCheckBox cb2=new JCheckBox("自动登录");
        cb2.setPreferredSize(new Dimension(150,25));
        JButton btLogin=new JButton("登录");
        btLogin.setPreferredSize(new Dimension(200,25));

        //然后设左面板
        JPanel leftPan=new JPanel();
        leftPan.setLayout(new FlowLayout(FlowLayout.RIGHT,10,10));//右对齐，组件垂直间隔10，水平间隔10
        leftPan.setPreferredSize(new Dimension(130,0));
        leftPan.add(ima2);

        //接着设右面板：
        /*组件的添加按照顺序来，先添加的先出现，流式布局的特点，
              通过调整组件大小来控制位置，放满本行就换到下一行*/
        JPanel rightPan=new JPanel();
        rightPan.setLayout(new FlowLayout(FlowLayout.LEFT,5,5));
        rightPan.add(txtUser);
        rightPan.add(user);
        rightPan.add(txtPass);
        rightPan.add(password);
        rightPan.add(cb1);
        rightPan.add(cb2);
        rightPan.add(btLogin);

        //最后把所有部分按照布局放到窗体中
        w.setLayout(new BorderLayout());
        w.add(ima1,BorderLayout.NORTH);
        w.add(leftPan,BorderLayout.WEST);
        w.add(rightPan,BorderLayout.CENTER);

        //全部搞好了最后再显示
        w.setVisible(true);
    }
}

小技巧：
1.选定类，按F3可以查看方法和源码，可以了解类的内在方便使用，和学习源代码
2.写完一小部分，就add到jframe中setVisible(true)看一下。