布局——仿QQ登陆页面（整体边界布局，中间流式布局）

布局——仿QQ页面

1. 此案例共分三个层次上中下，采用边界布局BorderLayout；
2. 上面放标签，JLable；中间选项卡面板JTabbedPane；（有三个普通用户，qq会员和管理员）——选项卡面板中添加面板JPanel；xxk.add("普通用户",mb2)，xxk是选项卡，mb2是普通用户的面板，下面是面板，有三个按钮
3. 中间和下面的均采用默认的流式布局，案例中用add命令即可，如mb1.add(an1)
4. 注意：当点击普通用户和QQ会员按钮时，整体的上面和下面均不变，因整体按照边界布局添加，
5. 变化如下：
   

 

 

 

源代码：

import java.awt.*;

import javax.swing.*;

 

public class L512 extends JFrame

{

    //JLabel bq1;  //北部

    JButton an1,an2,an3;   //JPanel mb1;//南部

    JTabbedPane xxk;    //中部

    JPanel  mb1,mb2,mb3,mb4;

    JLabel bq1,bq2,bq3,bq4,bq5;/*qq密码，qq号码，申请密码保护，忘记密码标签*/      JTextField wbk;   JPasswordField mmk;

    JButton an4;

    JCheckBox fxk1,fxk2;

    public static void main(String[] args)

    {      L512 lx=new L512();  }

       public L512()

    {

       bq2=new JLabel("qq号码",JLabel.CENTER);    

       bq3=new JLabel("qq密码",JLabel.CENTER);

       bq4=new JLabel("忘记密码",JLabel.CENTER);

       bq4.setFont(new Font("宋体",Font.PLAIN,16));

       bq4.setForeground(Color.BLUE);

       bq5=new JLabel("申请密码保护");

       bq5.setCursor(Cursor.getPredefinedCursor(Cursor.HAND_CURSOR));

       wbk=new JTextField();

       mmk=new JPasswordField();

       an4=new JButton(new ImageIcon("image/an4.jpg"));

       fxk1=new JCheckBox("隐身登陆");

       fxk2=new JCheckBox("记住密码");

       bq1=new JLabel(new ImageIcon("image/qqq.jpg"));     //北部

       mb1=new JPanel();      //南部

       an1=new JButton(new ImageIcon("image/an1.jpg"));

       an2=new JButton(new ImageIcon("image/an2.jpg"));

       an3=new JButton(new ImageIcon("image/an3.jpg"));

       xxk=new JTabbedPane();  //中部

       mb2=new JPanel();  mb3=new JPanel();

       mb3.setBackground(Color.BLUE);

       mb4=new JPanel();

       mb4.setBackground(Color.GREEN);

       xxk.add("普通用户",mb2);   xxk.add("QQ会员",mb3);   xxk.add("管理员",mb4);

       mb2.setLayout(new GridLayout(3,3));

       mb1.add(an1);  mb1.add(an2);  mb1.add(an3);

       mb2.add(bq2);  mb2.add(wbk);  mb2.add(an4);  mb2.add(bq3);  mb2.add(mmk);//mb2默认采用流式布局，需要an顺序添加

       mb2.add(bq4);  mb2.add(fxk1);  mb2.add(fxk2);  mb2.add(bq5);

      

       this.add(mb1,BorderLayout.SOUTH);

       this.add(bq1,BorderLayout.NORTH);

       this.add(xxk,BorderLayout.CENTER);//包括了mb2，mb3和mb4，当显示普通用户时显示mb2，显示会员时显示mb3，mb3和mb4本例中仅简化为图形

      

       ImageIcon tp1=new ImageIcon("image/qq.jpg");//用户登录处的小图标

       this.setIconImage(tp1.getImage());

       this.setTitle("用户登录");

        this.setSize(340,270);

        this.setLocation(300,280);

        this.setResizable(true);

        this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

        this.setVisible(true); 

   

   

   

}