Swing界面开发的总结

Swing界面开发的总结
一、Java的图形界面有：

1.awt ：java.awt，它是jdk1.4之前推出的图形界面类
2.swing ：javax.swing，它是jdk1.4的时候推出的图形界面类

N.B：两者的不同之处在于：1.跨平台性（swing由于awt）
2.awt基于C、C++语言
swing基于Java语言
二、常用的组件有：

A．容器组件

1.Frame 窗体类 顶级的容器(JFrame不能往JFrame里加)
它有一个默认的布局为边框布局

2.JPanel 面板类 最灵活的容器（JPanel可以往JPanel里加，也可以往JFrame里加）
它有一个默认的布局为流式布局

B．元素组件

JLabel 标签类
JTextField 文本输入框类
JPasswordField 密码输入框类
JCheckBox 复选框类
JButton 按钮类
JComboBox 下拉框类

N.B：容器和元素组件都是javax.swing包下的类。
javax.swing.JFrame

三、常用的布局

BorderLayout 边框布局
FlowLayout 流式布局
GridLayout 网格布局

N.B：1.布局类只能用在容器中。
2.以上三种布局都是位于java.awt包下的类
java.awt.FlowLayout

/****************************练习************************************/

1． 制作.QQ界面
package cn.zhm.study0718;

import java.awt.BorderLayout;
import java.awt.Color;
import java.awt.Dimension;
import java.awt.FlowLayout;
import java.awt.Image;

import javax.swing.ImageIcon;
import javax.swing.JButton;
import javax.swing.JCheckBox;
import javax.swing.JComboBox;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPanel;
import javax.swing.JPasswordField;

public class QQcenter {

/**
* 程序的入口主函数
*/
public static void main(String[] args) {
// 实例化QQcenter类的对象
QQcenter qq=new QQcenter();
//调用初始化界面的方法
qq.initUI();
}
/**
* 初始化界面的方法
*/
public void initUI(){

JFrame jf=new JFrame();//实例化一个窗体对象
jf.setTitle("QQ登录界面");//设置窗体的标题属性
jf.setSize(380,310);//设置窗体的大小属性
jf.setLocationRelativeTo(null);//设置窗体的显现位置为居中
jf.setDefaultCloseOperation(3);//设置窗体关闭时退出程序
jf.setResizable(false);//禁止调整窗体的大小
addBackgroundImage(jf);

/*****************窗体的北边************************/
//调用创建北边面板的方法，返回创建好的面板对象
JPanel northPanel=createNorthPanel();
//将northPanel添加到窗体的北边
jf.add(northPanel,BorderLayout.NORTH);

/*****************窗体的西边************************/
//调用创建西边面板的方法，返回创建好的面板对象
JPanel westPanel=createWestPanel();
//将westPanel添加到窗体的西边
jf.add(westPanel,BorderLayout.WEST);

/***************窗体的南边****************************/
//调用创建南边面板的方法，返回创建好的面板对象
JPanel southPanel=createSouthPanel();
//将southPanel添加到窗体的南边
jf.add(southPanel,BorderLayout.SOUTH);

/******************窗体的中部***********************/
//调用创建南边面板的方法，返回创建好的面板对象
JPanel centerPanel=createCenterPanel();
//将centerPanel添加到窗体的中部
jf.add(centerPanel,BorderLayout.CENTER);


//将窗体北边、西边、南边、中间的面板设置为透明
northPanel.setOpaque(false);
westPanel.setOpaque(false);
//southPanel.setOpaque(false);
centerPanel.setOpaque(false);

jf.setVisible(true);//设置窗体可见


}


/**
* 创建北边面板的方法
*/
public JPanel createNorthPanel(){
//实例化一个JPanel类的对象
JPanel northPanel=new JPanel();
//设置北边面板容器的大小
northPanel.setPreferredSize(new Dimension(0,125));
//设置面板的背景色
northPanel.setBackground(Color.BLUE);
//返回创建好的面板对象
return northPanel;
}

/**
* 创建西边面板的方法
*/
public JPanel createWestPanel(){
//实例化一个JPanel类的对象
JPanel westPanel=new JPanel();
//设置西边面板容器的大小
westPanel.setPreferredSize(new Dimension(105,0));

//实例化一个ImageIcon类的图标对象
ImageIcon imag=new ImageIcon("pictures/1.png");
//实例化一个标签对象
JLabel jlaImage=new JLabel(imag);
//将标签对象添加到面板上
westPanel.add(jlaImage);

//设置窗体的布局方式为流式布局
westPanel.setLayout(new FlowLayout(FlowLayout.RIGHT));
//返回创建好的面板对象
return westPanel;
}
/**
* 创建南边面板的方法
*/
public JPanel createSouthPanel(){
//实例化一个JPanel类的对象
JPanel southPanel=new JPanel();
//设置南边面板容器的大小
southPanel.setPreferredSize(new Dimension(0,45));
//设置面板的颜色
southPanel.setBackground(Color.WHITE);
//实例化一个按钮组件
JButton jbu=new JButton("登 录");
//设置按钮对象的颜色
jbu.setForeground(Color.WHITE);
//设置按钮的背景颜色
jbu.setBackground(Color.BLACK);
//设置按钮的大小
jbu.setPreferredSize(new Dimension(150,35));
//将按钮添加到面板上见
southPanel.add(jbu);
//返回创建好的面板对象
return southPanel;
}
/**
* 创建中间面板的方法
*/
public JPanel createCenterPanel(){
//实例化一个JPanel类的对象
JPanel centerPanel=new JPanel();
//设置面板的布局方式为流式布局靠左对齐
centerPanel.setLayout(new FlowLayout(FlowLayout.LEFT));
//实例化一个下拉框类的对象
JComboBox jco=new JComboBox();
//设置下拉框可编辑
jco.setEditable(true);
//给下拉框添加数据
jco.addItem("1136207581");
//设置下拉框的大小属性
jco.setPreferredSize(new Dimension(180,25));
//将下拉框添加到面板上
centerPanel.add(jco);

//实例化一个标签对象
JLabel jla1=new JLabel("注册账号");
//设置标签对象的颜色
jla1.setForeground(new Color(240,200,140));
//将标签添加到面板上
centerPanel.add(jla1);

//实例化一个密码框类的对象
JPasswordField jpa=new JPasswordField();
//设置密码框的大小属性
jpa.setPreferredSize(new Dimension(180,25));
//将密码框添加到面板上
centerPanel.add(jpa);

//实例化一个标签对象
JLabel jla2=new JLabel("找回密码");
//设置标签对象的颜色
jla2.setForeground(new Color(240,200,140));
//将标签添加到面板上
centerPanel.add(jla2);

//实例化复选框对象
JCheckBox jch1=new JCheckBox("记住密码");
//设置复选框对象的颜色
jch1.setForeground(new Color(240,200,140));

JCheckBox jch2=new JCheckBox("自动登录");
//设置复选框对象的颜色
jch2.setForeground(new Color(240,200,140));
//设置背景透明
jch1.setOpaque(false);
jch2.setOpaque(false);
//将复选框对象添加到面板上
centerPanel.add(jch1);
centerPanel.add(jch2);

//返回创建好的面板对象
return centerPanel;
}
/**
* 给窗体添加背景图标
*/
public void addBackgroundImage(JFrame jf){
//实例化一个ImageIcon的图标对象
ImageIcon image=new ImageIcon("pictures/4.png");
//实例化一个标签类的对象
JLabel background=new JLabel(image);
//设置标签显示的位置和标签的大小
background.setBounds(0,0,image.getIconWidth(),image.getIconHeight());
//将标签添加到窗体的第二层面板上
jf.getLayeredPane().add(background,new Integer(Integer.MIN_VALUE));
//获取窗体的第一层面板对象
JPanel contentPanel=(JPanel)jf.getContentPane();
//设置第一层面板为透明
contentPanel.setOpaque(false);
}
}

运行结果：

[img]http://dl2.iteye.com/upload/attachment/0087/2123/c28e05f3-b7d7-368f-8945-c66a56191805.png[/img]


2. 制作计算器
import java.awt.BorderLayout;
import java.awt.Dimension;
import java.awt.FlowLayout;
import java.awt.GridLayout;

import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.JTextField;


public class Counter2 {

/**
* 程序的入口主函数
*/
public static void main(String[] args) {
// 实例化Counter2类的对象
Counter2 cou=new Counter2();
//调用初始化界面的方法
cou.initUI();
}
/**
* 定义一个初始化界面的方法
*/
public void initUI(){
//实例化一个JFrame类的对象
JFrame jf=new JFrame();

jf.setTitle("计算器");//设置窗体的标题属性
jf.setSize(230,320);//设置窗体的大小属性
jf.setLocation(200,200);//设置窗体显现的位置属性
jf.setDefaultCloseOperation(3);//设置窗体关闭时退出程序
jf.setResizable(false);//设置禁止调整窗体大小

/************窗体北边的面板容器*****************/
//调用创建北边面板的方法，返回创建好的北边面板
JPanel northPanel=createNorthPanel();
//将northPanel添加到窗体的北边
jf.add(northPanel,BorderLayout.NORTH);

/**************窗体中部的面板容器***********************/
//调用创建中部面板的方法，返回创建好的中部面板
JPanel centerPanel=createCenterPanel();
//将centerPanel添加到窗体的中部
jf.add(centerPanel,BorderLayout.CENTER);

/******************窗体南边的面板容器***********************/
//调用创建南边面板的方法，返回创建好的南部面板
JPanel southPanel=createSouthPanel();
//将southPanel添加到窗体的南边
jf.add(southPanel,BorderLayout.SOUTH);

/*****************窗体西边的面板容器**********************/
//调用创建西边面板的方法，返回创建好的南部面板
JPanel westPanel=createWestPanel();
//将westPanel添加到窗体的西边
jf.add(westPanel,BorderLayout.WEST);

/******************窗体东边的面板容器***********************/
//调用创建南边面板的方法，返回创建好的南部面板
JPanel eastPanel=createEastPanel();
//将eastPanel添加到窗体的东边
jf.add(eastPanel,BorderLayout.EAST);


jf.setVisible(true);//设置窗体为可见

}

/**
* 创建北边面板容器的方法
*/
public JPanel createNorthPanel(){
//实例化一个JPanel类的对象
JPanel northPanel=new JPanel();
//设置北边面板的大小属性
northPanel.setPreferredSize(new Dimension(0,90));
//实例化一个JTextField类的对象
JTextField jte=new JTextField();
//设置文本框的大小属性
jte.setPreferredSize(new Dimension(210,80));
//将文本框添加到面板上
northPanel.add(jte);
//返回面板的方法
return northPanel;
}
/**
* 创建西边面板容器的方法
*/
public JPanel createWestPanel(){
//实例化一个面板
JPanel westPanel=new JPanel();
//设置面板的大小属性
westPanel.setPreferredSize(new Dimension(5,200));
//返回面板的方法
return westPanel;
}
/**
* 创建西边面板容器的方法
*/
public JPanel createEastPanel(){
//实例化一个面板
JPanel eastPanel=new JPanel();
//设置面板的大小属性
eastPanel.setPreferredSize(new Dimension(5,190));
//返回面板的方法
return eastPanel;
}
/**
* 创建中间面板容器的方法
*/
public JPanel createCenterPanel(){
//实例化一个面板对象
JPanel centerPanel=new JPanel();
//设置面板的布局方式为网格布局
centerPanel.setLayout(new GridLayout(5,4,5,5));

//定义按钮类的对象
JButton jbu1=new JButton("C");
JButton jbu2=new JButton("MC");
JButton jbu3=new JButton("MR");
JButton jbu4=new JButton("M+");
JButton jbu5=new JButton("←");
JButton jbu6=new JButton("±");
JButton jbu7=new JButton("%");
JButton jbu8=new JButton("÷");
JButton jbu9=new JButton("7");
JButton jbu10=new JButton("8");
JButton jbu11=new JButton("9");
JButton jbu12=new JButton("×");
JButton jbu13=new JButton("4");
JButton jbu14=new JButton("5");
JButton jbu15=new JButton("6");
JButton jbu16=new JButton("-");
JButton jbu17=new JButton("1");
JButton jbu18=new JButton("2");
JButton jbu19=new JButton("3");
JButton jbu20=new JButton("＋");

//将按钮添加到面板上
centerPanel.add(jbu1);
centerPanel.add(jbu2);
centerPanel.add(jbu3);
centerPanel.add(jbu4);
centerPanel.add(jbu5);
centerPanel.add(jbu6);
centerPanel.add(jbu7);
centerPanel.add(jbu8);
centerPanel.add(jbu9);
centerPanel.add(jbu10);
centerPanel.add(jbu11);
centerPanel.add(jbu12);
centerPanel.add(jbu13);
centerPanel.add(jbu14);
centerPanel.add(jbu15);
centerPanel.add(jbu16);
centerPanel.add(jbu17);
centerPanel.add(jbu18);
centerPanel.add(jbu19);
centerPanel.add(jbu20);

return centerPanel;

}
/*
* 创建南边面板容器的方法
*/
public JPanel createSouthPanel(){
//实例化一个JPanel类的对象
JPanel southPanel=new JPanel();
//设置面板的大小属性
southPanel.setPreferredSize(new Dimension(230,40));
//设置窗体的布局方式为流式布局
southPanel.setLayout(new FlowLayout(FlowLayout.LEFT));
//实例化按钮类对象
JButton jbu21=new JButton("0");
JButton jbu22=new JButton(".");
JButton jbu23=new JButton("=");
//设置按钮类的大小
jbu21.setPreferredSize(new Dimension(103,30));
jbu22.setPreferredSize(new Dimension(50,30));
jbu23.setPreferredSize(new Dimension(50,30));
//将按钮添加到面板上
southPanel.add(jbu21);
southPanel.add(jbu22);
southPanel.add(jbu23);
//返回创建好的面板对象
return southPanel;

}
}

运行结果：

[img]http://dl2.iteye.com/upload/attachment/0087/2121/3e28b6bb-2da6-32de-b4d2-4b8082b6bbe5.png[/img]


N.B：
需要注意的地方：1.边框布局的Center是不可以调整大小的！只有North、South、East、West可以调整大小！
2.设置颜色的时候可以参考画图板的颜色编辑参数。
3.放入网格布局中的按钮不可以设置大小。
4.可用ctrl+shift+o导入包。
5.我不熟悉的：
/**
* 给窗体添加背景图标
*/
public void addBackgroundImage(JFrame jf){
//实例化一个ImageIcon的图标对象
ImageIcon image=new ImageIcon("pictures/4.png");
//实例化一个标签类的对象
JLabel background=new JLabel(image);
//设置标签显示的位置和标签的大小
background.setBounds(0,0,image.getIconWidth(),image.getIconHeight());
//将标签添加到窗体的第二层面板上
jf.getLayeredPane().add(background,new Integer(Integer.MIN_VALUE));
//获取窗体的第一层面板对象
JPanel contentPanel=(JPanel)jf.getContentPane();
//设置第一层面板为透明
contentPanel.setOpaque(false);
}