图形用户界面概述
- 格式:pps
- 大小:176.50 KB
- 文档页数:18
第8章图形用户界面设计学习目标Java API提供了A WT和Swing两套组件来实现图形用户界面。
它们包含了用来设计图形用户界面的各种基本控制组件,容器组件和布局管理组件,并采用事件委托的处理模式。
本节将介绍A WT包和Swing包各自的特点,并学习Java组件的概念。
本章要点☑什么是GUI☑布局管理机制☑AWT组件☑Swing组件8.1 容器和组件容器和组件都是图形用户界面中的重要概念,本节将从容器与组件入手来学习图形用户界面的相关知识。
8.1.1 什么是用户图形界面图形用户界面(Graphics User Interface,GUI)提供了所见即所得的功能,方便了用户的操作,成为软件设计的通用标准。
Java语言提供了图形用户界面所需要的基本组件,这些组件全部包含在java.awt包中,利用这些组件可以设计出功能强大的GUI软件。
Java1.0的出现带来了A WT(Abstract Windowing Toolkit),中文译为抽象窗口工具包。
设计目标是希望构建一个通用的GUI,使得利用它编写的程序能够运行在所有的平台上。
在Java1.2中,Sun公司推出了新的用户界面库:Swing。
相对A WT来说,Swing功能更强大、使用更方便,它的出现使得Java的图形用户界面上了一个台阶。
但是,Swing并没有代替A WT,在Java1.1中,AWT事件处理模型有了根本改变。
Swing使用的仍然是Java1.1的事件处理模型。
8.1.1 容器和组件的概念容器是一种特殊的组件,它可以包含其他组件,即可以把组件放在容器中。
反之,如果一个组件不是组件容器,则其中不能包含其他组件。
容器也是一种组件,所以一个组件容器可以放在另一个组件容器中。
¤Java程序设计教程︻电脑基础·实例·上机系列教程︼A WT容器分为两类:外部容器和内部容器。
其中,外部容器一般会独立存在,例如Frame类;而内部容器则会嵌套在外部容器内部使用,例如Panel类。
第七讲MATLAB图形⽤户界⾯(GUI)设计第7讲MATLAB图形⽤户界⾯(GUI)设计图形⽤户界⾯(GUI, Graphical User Interface)是由图形控件构建的⽤于⼈与计算机交互信息的界⾯。
在图形⽤户界⾯上,⽤户可以根据界⾯上的提⽰信息完成⾃⼰的⼯作,⽽不需要记忆⼤量繁琐的命令,只需通过⿏标、键盘等便捷的⽅式与计算机交互信息、选择想要运⾏的程序、控制程序的运⾏、实时显⽰图形信息。
MATLAB创建的图形⽤户界⾯对象有三类:⽤户界⾯控件,如按钮、列表框、编辑框等;下拉菜单,如菜单、⼦菜单;内容菜单,如弹出式菜单。
⼀、命令⾏建⽴⽤户界⾯的⽅法1、创建控件命令:uicontrol调⽤格式:1)uicontrol(‘PropertyName1’,value1, ‘PropertyName2’,value2,……)功能:在当前图形⽤户的界⾯上,应⽤当前制定的属性值创建控件;2)h=uicontrol(‘PropertyName1’,value1, ‘PropertyName2’,value2,……)功能:在当前图形⽤户的界⾯上,应⽤当前制定的属性值创建控件,并返回控件的句柄;3)uicontrol(FIG, ‘PropertyName1’,value1, ‘PropertyName2’,value2,……)功能:在句柄FIG指定的图形⽤户界⾯上,创建控件;4)h=uicontrol(FIG, ‘PropertyName1’,value1, ‘PropertyName2’,value2,……) 功能:在句柄FIG指定的图形⽤户界⾯上,创建控件,并返回控件的句柄。
说明:函数中的PropertyName参数的参数值有:Push buttons(命令按钮)、sliders (滚动条控件)、Radio button(单选按钮)、Check box(复选框)、Edit text (可编程⽂本框)、Static text(静态⽂本框)、Pop_up menus(弹出式菜单)、listbox(列表框)、Toggle button(开关按钮)、Axes(坐标轴)、Panel(⾯板控件)、Button group(按钮组框)、ActiveX control(ActiveX 控件)。
6.1 图形用户界面概述6.1.1 基本概念(1)GUI—图形用户界面(Graphics User Interface)使用图形的方式借助菜单、按钮等标准界面元素和鼠标操作,帮助用户和计算机之间进行交互。
(2)AWT——抽象窗口工具集(abstract window toolkit) Java中用来生成图形用户界面的类库是java.awt 包,它Java中基本包中最大的一个,定义了所有GUI 组件类,以及其它用于构造图形界面的类。
Sun公司在JDK1.0中就提供了AWT。
为了实现跨平台特性,AWT类库中的各种操作被定义成在一个并不存在的“抽象窗口”中进行。
AWT组件的类层次•Component 组件是所有AWT组件的基类,提供了基本的显示和事件处理特征。
(3)Swing GUI组件◆在最新的Java2中,javax.swing包被列入Java的基础类库JFC,其中定义的Swing GUI组件相对于java.awt包的各种GUI组件增加了许多功能。
◆Swing组件类Swing包含250多个类(有些是组件,有些是支持类,组件的名字都以J 开头),Swing提供了40多个组件,是AWT的4倍,用轻量组件(没有本地对等组件)代替了AWT的重量组件(与本地对等组件相关联)。
重量级组件是指组件的属性跟操作系统有关,轻量级组件跟操作系统无关,轻量级组件在不同平台下显示效果一样。
Swing组件简介(续)Swing采用了一种MVC的设计范式,即“模型-视图-控制器”(Model-View-Controller):◆模型(Model)——用于存储定义该组件的数据;◆视图(View)——用模型中的数据生成该组件的可视化表示(即显示出该组件);◆控制器(Controller)——响应用户对该组件的交互操作。
MVC是一种先进的组件设计模式。
MVC 结构示意图视图(组件外观)控制器(处理事件,更改模型或者视图)模型(组件数据)UI 代表(向组件提供外观和感觉)Swing组件简介(续)◆Swing包中有4个最重要的类:JApplet、JFrame、JDialog、JComponent◆JComponent的所有子类都是轻量级组件,其它三个都是重量级组件,轻量级组件必须在这些重量容器中绘制自己。
◆除模仿AWT组件所提供的功能外,几乎所有的Swing替代组件都有其他一些特性,如Swing按钮可以显示图标和文本,AWT按钮只显示文本。
(4)设计图形界面的步骤1)根据需要创建界面元素,设计出界面的物理外观;2)定义界面元素对不同事件的响应,实现界面与用户的交互功能.(5)设计图形界面的一般原则⏹保持风格的一致性◆背景颜色耐看,避免黑、大红、艳绿、明黄◆采用统一字体,颜色对比清晰、字号大小合理◆布局统一,组件尺寸恰当、外观一致⏹注重操作的友好性◆必要的操作提示与信息反馈◆考虑用户的普遍习惯⏹选用适合主题的色调和风格,简洁明快,重在协调◆多浏览国外著名公司的网站◆参考大公司开发的专业产品◆商业经典色系:蓝色、灰色、蓝白、蓝灰⏹界面的边界一般设为不可调整大小,以免影响布局6.1.2 图形用户界面元素分三类:容器、控制组件、用户自定义成分。
(1)容器(container)是用来组织其他界面成分和元素的单元,如窗体(form、frame)。
主要作用: 用容器可以分解图形界面的复杂性。
特点:容器有一定的范围、位置、背景,容器里可以包含许多其他的界面元素,并按一定规则来排列所包含的元素,可以被用来完成某种交互功能,容器还可能被包含在其他容器中。
(2)组件(Component )组件是图形界面的最小单位,里面不能再包含其他成分。
如:命令按钮、文本域、标签等。
组件的作用是完成与用户的一次交互,如接受用户指令、向用户显示文本等。
使用组件的步骤:创建组件对象→确定属性→布局到容器中→注册事件监听者→重写事件处理方法。
TextField input=new TextField(6);add(input);input.addActionListener(this);public void actionPerformed(ActionEvent e){if(e.getSource()==input)output.setText(input.getText()+“,欢迎你!”);}(3)用户自定义图形界面成分用户自定义成分是指利用Java类库中的类及其方法来绘制符合用户特定要求的图形界面成分,也可以将已经存在的图形、动画等加载到当前程序中来。
1) 绘制图形Graphics类——绘制直线、各种矩形、多边形、圆和椭圆等。
Point类——表示一个象素点Dimension类——表示宽和高Rectangle类——表示一个矩形Polygon类——表示一个多边形Color类——表示颜色2) 显示文字Java中用一个Font类的对象来表示一种字体显示效果,包括字体类型、字型和字号。
Font.PLAIN ——正常字型常量Font.BOLD ——粗体Font.ITALIC ——斜体1) 创建字体对象Font MyFont=new Font(“TimesRoman”,Font.BOLD,12);2)使用字体对象g.setFont(MyFont); //Graphics对象btn.setFont(MyFont); //某个名为btn的按钮对象可以用getFont()方法返回当前对象使用字体的情况。
3) 控制颜色Applet中显示的字符串或图形的颜色可以用Color类的对象来控制,每个Color对象代表一种颜色,用户可以直接使用系统定义好的13种颜色常量,也可以通过红、绿、蓝三色比例来创建自己的Color对象。
•Color类的构造函数public Color(int Red,int Green,int Blue);// 每个参数的取值范围在0-255之间。
public Color(float Red, float Green, float Blue); // 每个参数的取值范围在0-1.0之间。
public Color(int RGB);// 指明RGB三色的比例,这个参数的0-7比特代表红色的比例,8-15比特代表绿色的比例,16-23比特代表蓝色的比例。
例:•创建自己的颜色:Color blueColor= new Color(0,0,255);g. g.setColor(blueColor);•利用系统的颜色常量:g.setColor(Color.cyan);•GUI控件的颜色设置方法public void setBackground(Color c);//设置背景颜色public Color getBackground(); //取得背景颜色public void setForeground(Color c);//设置前景颜色public Color getForeground(); //取得前景颜色4) 显示图象Java中可以利用Graphics类的drawImage()方法显示图象。
显示图象涉及3个方法:•drawImage(参数1,参数2,参数3)参数1——Image对象,可以用系统为Applet类定义的getImage()方法获得。
参数2、参数3——显示时图象左上角的X.Y坐标•getImage(参数1,参数2 )参数1——图象文件所在的URL地址参数2——图象文件的文件名•getDocumentBase()获取含有该Applet的HTML文件的URL地址。
例:用户界面使用示例TestGraphics.java import java.awt.*;import java.applet.Applet;public class TestGraphics extends Applet{Image myImage ;Font myFont=new Font("黑体",Font.BOLD,20);Color myColor=new Color(120,25,180);public void init(){myImage = getImage(getDocumentBase(), "fys.jpg" );}public void paint(Graphics g){g.drawLine(30,5,40,5); //画线g.setColor(Color.blue); //设置字体颜色g.drawRect(40,10,50,20); //画空长方形g.setColor(Color.red);setBackground(Color.yellow); //设置背静颜色g.fillRect(60,30,70,40); //画实体长方形g.setFont(myFont);g.drawString("大家好!",100,200);g.setColor(myColor);g.drawString(g.getFont().toString(),10,250);g.drawImage(myImage, 150, 10, this ); //显示图片}}5) 实现动画效果用Java实现动画的原理与放映动画片类似,取若干相关的图象或图片,顺序、连续地在屏幕上先显示,后擦除,循环往复就可以获得动画的效果。
小结:在设计和实现一个程序的图形用户界面的过程中,绘制用户自定义成分仅完成了部分工作,可以美化用户界面,但无法接收程序运行过程中的用户指令,不能提供与用户的动态交互,还需要通过Java中的事件处理机制来实现。