ch11-图形用户界面设计.ppt

1、图形用户界面设计n字符界面q用字符串、命令行的方式与用户交互n图形用户界面:Graphics User Interfaceq用直观的图形来表示数据q用直观、方便的GUI标准组件来接收命令qGUI组成成分的标准化nJava的图形用户界面编程：qjava.awt包n图形用户界面的构成q容器：布局、安排q标准组件q用户自定义成分n设计&实现图形用户界面的工作q创建GUI各组成成分，并安排从属位置关系q定义GUI各成分对不同事件的响应，实现与用户的交互功能Building GUIs with AWT(Abstract Window Toolkit)njava.awt包提供了基本的java程序的GUI设

2、计工具。qComponentqContainerqLayoutManagerComponent（组件）nJava的图形用户界面的最基本组成部分是组件，组件是一个可以以图形化的方式显示在屏幕上并能与用户进行交互的对象，例如一个按钮，一个标签等。n组件不能独立地显示出来，必须将组件放在一定的容器中才可以显示出来。Component（组件）nComponent 中 定 义 了 各 种 组 件 的 基 本 使 用 方 法，这 些 也 是 组 件 的 常用 方 法。我 们 如 果 要 对 窗 口 中 的 对 象（组 件）进 行 一 些基 本 操 作，例 如 改 变 背 景 的 颜 色、改 变 窗 口 对

3、 象 的 大 小等 等，都 是 通 过 调 用 类 Component 中 定 义 的 方 法 来 实 现 的。只 有 一 些 属 于 某 种 特 定 组 件 的 特 殊 用 法 不 在 类 Component 中定 义。Component中的常用方法方 法 说 明 action 用户对组件进行操作时调用的方法disable 使得组件不再能够被使用 enable 使得组件能够被使用 （与disable功能相反）getBackground 取得组件的背景颜色 getFont 取得组件所使用的字型 getForeground 取得组件的前景颜色 Component中的常用方法（续）handleEv

4、ent 当发生事件时调用的方法 hide 使得组件隐藏起来，不能够再在屏幕上显示 Inside 检查某个坐标是否在组件以内isEnabled 检查组件现在是否可以被使用 isShowing 检查组件目前是否正在屏幕上显示 isVisible 检查组件是否被隐藏起来了keyDown 当用户按下键盘上的键时调用的方法keyUp 用户放开键盘上的键时调用的方法Component中的常用方法（续）locate 给出包含某个坐标的组件location 给出组件当前的坐标值mouseDown 用户按下鼠标时调用的方法mouseDrag 用户拖曳鼠标时调用的方法 mouseEnter 鼠标进入组件中时调用的

5、方法mouseExit 鼠标离开组件时调用的方法mouseMove 鼠标被移动时调用的方法mouseUp 用户放开鼠标的按键时调用的方法 Component中的常用方法（续）move 移动组件repaint 重画组件 resize 改变组件的大小 setBackground 设置组件的背景颜色 setFont 设置组件所使用的字型 setForeground 设置组件的前景颜色 setVisiable 设置组件的可见性 show 显示组件（解除隐藏）size 返回当前组件的大小Container（容器）n容器(Container)实际上是Component的子类，因此容器本身也是一个组件，具有

6、组件的所有性质，另外还具有容纳其它组件和容器的功能。Container（容器）组 件容 器 的 出 现 使 得 事 情 变 得 复 杂 了 起 来。我 们 可 以 把 组 件放 在 组 件 容 器 里，也 可 以 把 组 件 容 器 放 在 另 一 个 组 件 容器 里，这 样 就 形 成 了 有 层 次 的 组 件 结 构。我 们 可 以 把 普通 的 组 件 想 像 成 为 鸡 蛋，而 把 组 件 容 器 想 像 成 为 篮 子。那 么，鸡 蛋 可 以 放 在 小 篮 子 里，小 篮 子 和 别 的 鸡 蛋 又 可以 放 在 大 篮 子 里。于 是，篮 子 里 可 以 有 鸡 蛋，还 可

7、以 有其 他 的 篮 子。Container（容器）Component Container ButtonTextComponentCheckboxTextAreaTextField Panel Applet Window Frame Dialog MenuComponentMenuMenuBarMenuItemContainer（容器）类 Container 的 重 要 子 类所 有可 以 用 作 组 件 容 器 的 窗 口 对 象，都 是 由 类 Container 或 者 类 Container 的 子 类 生 成 的。1.类 Window：类 Container 的 子 类，是 画 窗

8、口 最 基 本 的 类 2.类 Dialog：类 Window 的 子 类，用 于 生 成 各 种 对 话 框。3.类 FileDialog：继 承 类 Dialog 的 类，可 以 用 来 生 成 文 件 对 话 框。（文 件 对 话 框 用 来 让 用 户 选 择 和 输 入 文 件 名）。Container（容器）4.类 Frame：类 Window 的 子 类，用 来 设 计 具 有 一 般 窗 口 标准 和 菜单 系 统 的 窗 口。5.类 Panel：类 Container 的 子 类，是 类 Applet 的 父 类；类 Panel 在小 应 用 程 序 中 不 可 缺 少，它

9、所 定 义 的 窗 口 对 象 是 一 块 简单 的 区 域，这 块 区 域 用 来 放 置 各 种 有 用 的 窗 口 对 象。Container（容器）Panel 和 普 通 的 Window 相 似 之 处 是 可 以 把 许 多 相 关 的 窗 口 对象 放 在 同 一 个 Panel 中；Panel 和Window 不 同 之 处 在 于 我 们 可以 方 便 地 使 用 Panel 来 安 排 一 组 一 组 的 窗 口 对 象，而 不 必为 安 排 每 一 个 窗 口 对 象 而 发 愁。当 小应 用 程 序 在 WWW 浏 览 器 中 执 行 的 时 候，浏 览 器 会 自 动

10、 地 为它 准 备 一 个 Panel，然 后 程 序 中 有 关 窗 口 的 操 作 都 会 在 这个 Panel 上 进 行。Container（容器）nPanel(面板)qApplet类nWindow：无边框、菜单的空白窗口qFrame：用于Application含边框、菜单的 独立窗口，与 Applet平级qDialog依赖于 Frame的非 独立窗口练习实例1：在一个Java界面上显示一个10以内的整数，每按一次按钮，显示的数增加一倍。实例2：显示一图片，按“开始”按钮，图片移动一个位置LayoutManager（布局管理器）n为了使我们生成的图形用户界面具有良好的平台无关性，Jav

11、a语言中，提供了布局管理器这个工具来管理组件在容器中的布局，而不使用直接设置组件位置和大小的方式。n每个容器都有一个布局管理器，当容器需要对某个组件进行定位或判断其大小尺寸时，就会调用其对应的布局管理器。n在程序中安排组件的位置和大小时，应该注意：q容器中的布局管理器负责各个组件的大小和位置，因此用户无法在这种情况下设置组件的这些属性。如果试图使用Java语言提供的setLocation()，setSize()，setBounds()等方法，则都会被布局管理器覆盖。q如果用户确实需要亲自设置组件大小或位置，则应取消该容器的布局管理器，方法为：setLayout(null)；LayoutMana

12、ger（布局管理器）LayoutManager（布局管理器）n布局管理器q用于控制组件在容器中的布局n种类：qFlowLayout:组件在一行中从左至右水平排列，排满后折行qBorderLayout：北、南、东、西、中qCardLayout：每一个组件作为一个卡片，容器仅显示多个卡片中的某一个LayoutManager（布局管理器）qGridLayout：以行和列的网格形式安排组件qGridBagLayout：使用复杂、功能灵活n缺省的布局管理器qFlowLayout:缺省的Panel布局管器qBorderLayout：缺省的窗口容器的管理器n改变缺省布局管理器的方法；例：BorderLayo

13、ut B=new BorderLayout();C1.setLayout(B);C1.setLayout(new BorderLayout();常用容器nFramenPanelnAppletFramejava.lang.Object|+-java.awt.Component|+-java.awt.Container|+-java.awt.Window|+-java.awt.Frameimport java.awt.*;public class MyFrame extends Framepublic static void main(String args)MyFrame fr=new MyFr

14、ame(Hello Out There!);fr.setSize(200,200);fr.setBackground(Color.red);fr.setVisible(true);public MyFrame(String str)super(str);n运行结果Paneljava.lang.Object|+-java.awt.Component|+-java.awt.Container|+-java.awt.Panelimport java.awt.*;public class FrameWithPanel extends Framepublic FrameWithPanel(String

15、str)super(str);public static void main(String args)FrameWithPanel fr=new FrameWithPanel(Frame with Panel);Panel pan=new Panel();fr.setSize(200,200);fr.setBackground(Color.red);fr.setLayout(null);pan.setSize(100,100);pan.setBackground(Color.yellow);fr.add(pan);fr.setVisible(true);n运行结果：LayoutManagern

16、FlowLayoutnBorderLayoutnGridLayoutnCardLayoutnGridBagLayoutimport java.awt.*;public class ExGuiprivate Frame f;private Button b1;private Button b2;public static void main(String args)ExGui that=new ExGui();that.go();public void go()f=new Frame(GUI example);f.setLayout(new FlowLayout();b1=new Button(

17、Press Me);b2=new Button(Dont Press Me);f.add(b1);f.add(b2);f.pack();f.setVisible(true);n运行结果FlowLayoutnPanel，Applet的缺省布局管理器。setLayout(new FlowLayout(FlowLayout.RIGHT,20,40);setLayout(new FlowLayout(FlowLayout.LEFT);setLayout(new FlowLayout();import java.awt.*;public class myButtons public static voi

18、d main(String args)Frame f=new Frame();f.setLayout(new FlowLayout();Button button1=new Button(Ok);Button button2=new Button(Open);Button button3=new Button(Close);f.add(button1);f.add(button2);f.add(button3);f.setSize(300,100);f.setVisible(true);运行结果为：BorderLayoutnWindow，Frame和Dialog的缺省布局管理器。BorderL

19、ayout布局管理器包括5个区域：North，South，East，West和Center。import java.awt.*;public class buttonDir public static void main(String args)Frame f=new Frame(BorderLayout);f.setLayout(new BorderLayout();f.add(North,new Button(North);f.add(South,new Button(South);f.add(East,new Button(East);f.add(West,new Button(West

20、);f.add(Center,new Button(Center);f.setSize(200,200);f.setVisible(true);GridLayoutn使容器中各个组件呈网格状布局。import java.awt.*;public class ButtonGrid public static void main(String args)Frame f=new Frame(GridLayout);f.setLayout(new GridLayout(3,2);f.add(new Button(1);f.add(new Button(2);f.add(new Button(3);f.

21、add(new Button(4);f.add(new Button(5);f.add(new Button(6);f.setSize(200,200);f.setVisible(true);nFrameqFrame是一个顶级窗口。qFrame的缺省布局管理器为BorderLayout。nPanelqPanel无法单独显示，必须添加到某个容器中。qPanel的缺省布局管理器为FlowLayout。q当把Panel作为一个组件添加到某个容器中后，该Panel仍然可以有自己的布局管理器。因此，可以利用Panel使得BorderLayout中某个区域显示多个组件。CardLayoutnCardLay

22、out布局管理器能够帮助用户处理两个以至更多的成员共享同一显示空间。import java.awt.*;public class ExGui3private Frame f;private Panel p;private Button bw,bc;private Button bfile,bhelp;public static void main(String args)ExGui3 gui=new ExGui3();gui.go();public void go()f=new Frame(GUI example 3);bw=new Button(West);bc=new Button(Work space region);f.add(bw,West);f.add(bc,Center);p=new Panel();f.add(p,North);bfile=new Button(File);bhelp=new Button(Help);p.add(bfile);p.add(bhelp);f.pack();f.setVisible(true);