图形用户界面设计与实现

GridLayout布局管理器
f = new Frame("GridLayout"); f.setLayout(new GridLayout(2,3)); f.setSize(200,100); f.setBackground(Color.gray); b1 = new Button("1"); … b6 = new Button("6"); f.add(b1); … f.setVisible(true);
例：将myFrame布局设定为FlowLayout类型 myFrame.setLayout(new FlowLayout());
Frame
Frame(String title)
构造一个新的不可见的frame 隐含的布局管理器是：BorderLayout setLayout(…) 设臵新的布局管理器。 add(Component comp) 在容器上增加一个组件（在容器为不可见的状态时 加）。 void setSize(int width, int height) 7-1a setVisible(true)
Component类
可显示在屏幕上的图形对象，可与用户交互。 方法：
add(PopupMenu popup) 加一弹出菜单 addFocusListener(FocusListener l)将发生在本组件上的 事件注册给监听者，以进行事件处理。 setSize(int width, int height) 设臵组件尺寸 paint(Graphics g) 重画组件 setFont(Font f) 设臵组件字体 setBackground(Color c) 设臵组件背景色 setForeground(Color c) 设臵组件前景色
方式为CENTER居中方式，组件间的横纵间距都为 5个像素。
FlowLayout布局管理器
Frame f = new Frame("FlowLayout"); 7-1c f.setSize(400,300); //不起作用 f.setBackground(Color.gray); f.setLayout(new FlowLayout(FlowLayout.LEFT,10,20)); b1 = new Button("button1"); b2 = new Button("button2"); b3 = new Button("button3"); f.add(b1); f.add(b2); f.add(b3); f.setVisible(true); f.pack();
Containers 容器组件
Window ——不需要其他组件支撑，独立显示。 Frame Dialog – 没有菜单条，不能改变大小 Panel —— 必须放在Window组件中（或Web浏览
器窗口）才能显示。它为一矩形区域，在其中可摆 放其他组件，可以有自己的布局管理器。 基本方法
Font类
java.awt.Font 设计字体显示效果（创建字体对象） Font fn = new Font(String 字体，int 风格，int 字号); 字体：TimesRoman, Courier, Arial等 风格：三个常量
Font.PLAIN, Font.BOLD, Font.ITALIC
7-1b
FlowLayout布局管理器
构造函数： FlowLayout() ; FlowLayout(int align, int hgap, int vgap)； align ：对齐方式：LEFT CENTER RIGHT hgap ：组件水平间距 （象素） vgap ：组件垂直间距（象素） 无参数的构造函数创建的FlowLayout对象，其对齐
界面构成
容器
标准 组件
用户自定义 成分
创建GUI各组成成分，并安排相互 位置关系（包含，相邻，相交）。 定义GUI各成分对不同事件的响应， 实现与用户的交互与界面功能。
界面元素
容器是用来组织其他界面成分和元素的单元。 可以形成容器的层次，构筑复杂结构 Window（Frame、Applet、Dialog ） 组件是图形用户界面的基本单位，它里面不再包含
BorderLayout布局管理器
setLayout(new BorderLayout() ) add(b1,BorderLayout.NORTH); 当容器大小改变，组件相对位臵不会改变。
North
West
Center East South
BorderLayout布局管理器
f = new Frame("BorderLayout"); f.setSize(200,200); b1 = new Button("button1"); … b5 = new Button("button5"); f.add(b1,BorderLayout.NORTH); f.add(b2,BorderLayout.SOUTH); f.add(b3,BorderLayout.WEST); f.add(b4,BorderLayout.EAST); f.add(b5,BorderLayout.CENTER); f.setVisible(true);
paint和repaint 方法
某组件的paint()和 update()为系统自动调用的有关
图形绘制的方法，不可人为编程调用；但可编程重 新定义其操作内容。 使用repaint()方法可以触发update()方法。
1. 擦除并填充成背景色 编程 repaint() 调用 update() 2. 调用paint() 控制 paint( ) 第一次绘制 当某些操作破坏了显示，需重新绘制时
");
7-1e
GridLayout布局管理器
创建GridLayout对象作为布局编辑器，指定划分网
格的行数和列数(网格大小一样）。 setLayout(new GridLayout(行数, 列数)); setLayout(new GridLayout(行数, 列数,行间隔,列间 隔)); 调用容器的方法add()将组件加入容器，组件填入 容器的顺序将按照第一行第一个格中、第一行第二 个格中、…… 每个网格中都必须填入组件，如果希望某个网格为 空白，可以为它加入一个空的标签： add (new Label());
AWT类层次关系图
Button Checkbox Container Component 其他组件 MenuComponent
TextComponent MenuBar TextArea
TextField
MenuItem
不独立
Panel Applet
独立
Window Frame Dialog
MeFra Baidu biblioteku
7-1d
Border-Panel
class MyFrame extends Frame{ MyFrame(){ Button b1 = new Button(" 1 "); Button b2 = new Button(" 2 "); Button b3 = new Button(" 3 "); Button b4 = new Button(" 4 Panel p = new Panel(); p.add(b1); p.add(b2); add(p,BorderLayout.NORTH); add(b3,BorderLayout.WEST); add(b4,BorderLayout.CENTER); pack(); setVisible(true);
容器的组件布局
依靠布局管理器（layout manager)方式 调用容器的setLayout方法，为容器指定某种布局管理器 布局管理器对象 的一个对象。 例： setLayout(new FlowLayout() ) 该布局管理器对象负责确定容器中组件的位臵和大小。 当容器需要定位组件和确定组件大小时，就会给布局管 理器对象发消息，让它完成该项工作。 直接管理组件方式 调用容器的 setLayout(null) 方法，关闭布局管理器。 调用每一个组件的setLocation()方法决定组件位臵。 调用每一个组件的setSize()方法决定其大小。 直接管理组件将失去平台无关性。
Frame — Panel
Frame fm1 = new Frame("Hello"); fm1.setSize(400,350); fm1.setBackground(Color.gray); fm1.setLayout(null); Panel pn1 = new Panel(); pn1.setSize(100,100); pn1.setBackground(Color.red); pn1.setLocation(0,50); fm1.add(pn1); … fm1.setVisible(true);
add(Component comp) 将指定组件放到容器中 add(Component comp，int index) remove(Component comp) 删除指定组件 setLayout(LayoutManager mgr) 设臵容器布局 paint 画容器（及其上面的组件）
布局管理器种类
FlowLayout: 组件在一行中从左至右水平排列，排
满后折行 BorderLayout：北、南、东、西、中 GridLayout：以行和列的网格形式安排组件 GridBagLayout：更复杂、功能更强的网格布局 CardLayout：每一个组件作为一个卡片，容器仅 显示多个卡片中的某一个
其他的成分。
GUI组件是图形用户界面标准化的结果。 GUI组件的作用是完成与用户的交互。
用户自定义成分 文字、图形、图象… 不能像标准组件一样被系统识别和承认，只起装饰作用 。 不能响应用户的动作，不具有交互功能。
AWT包
Abstract Windows Toolkit（抽象窗口工具） AWT类库中的各种操作是被定义为在一个并不存在的“ 抽象窗口”中进行的。 抽取不同软硬件平台中所实现的窗口的公共特性。 所设计的界面独立于具体的界面实现 。 提供与机器无关的基本GUI标准组件。 选择类组件： 单选按钮、复选框、下拉选单、列表框… 文字处理类组件： 标签、文本框、编辑框… 命令类组件： 按钮、工具栏、菜单…
确定容器布局
缺省的布局管理器 Window 、Frame、Dialog —— BorderLayout Panel 、Applet —— FlowLayout: 选择布局管理器的方法 建立布局管理器类的对象 利用容器的 setLayout 为容器指定布局（即指定一个布 局管理器的对象）
教材第7章
图形用户界面的设计与实现
设计原则 容器与布局 标准组件 事件处理 自定义成分
用户界面设计原则
使用图形界面GUI (Graphics User Interface) 字符界面—采用命令行方式与用户交互。 图形界面—用多种媒体显示信息，用直观、方便的GUI标 准组件来接收命令。 控制权在用户（用户要由操作的主动权） 界面与操作的风格一致性。 宽容（容错）性。 简洁与美观并重。
字号：字的大小（磅数）
使用字体对象 － 如设臵某组件当前使用的字体：
setFont(Font fn) 获取组件当前使用的字体：getFont()
Color类
构造函数1（设臵颜色） Color c = new Color(int red, int green, int blue) 范围 ：0~255 new Color(200,200,200) new Color(255,0,100) 构造函数2 Color c = new Color(int rgb) 兰色：0~7 位 绿色：8~15位 红色：16~23位 颜色常量值 public static final Color black Color.black , Color.blue , Color.gray , Color. red Color.white …