第六章图形用户界面 本章讲解]ava图形界面应用程序的一 般设计方法,包括如何创建窗体、设 计界面、管理布局、绘制图形、使用 组件、事件编程等。 通过这一章的学习要求重点掌握图形 用户界面应用程序的设计方法和编程 技巧
Java程序设计大学教程 第六章 图形用户界面 本章讲解Java图形界面应用程序的一 般设计方法，包括如何创建窗体、设 计界面、管理布局、绘制图形、使用 组件、事件编程等。 通过这一章的学习要求重点掌握图形 用户界面应用程序的设计方法和编程 技巧
6.1GUI编程基础 图形用户界面(GUI)使用户可以和程序进行可视化交互。无 论是程序的设计者还是使用者都可以通过图形用户界面明显 “看到”和“感觉”到程序的存在。图形用户界面为不同的 应用程序提供了感觉上致的用户界面组件,这样使用户在 记隹执仁功能的复杂命含上花费较少的时间,而花更多的时 间通过有效的方式来使用程序 个设计良好的软件通常包括业务层的逻辑设计和表现层的 用户界面设计两大部分。因此,好的用户界面设计对一个系 统的成功是至关重要的。一个使用起来困难的界面,轻者会 造成用户操作不便;重者引起用户反感,不管系统的功能如 何而拒绝使用该软件系统。如果信息的表达方式是混乱的或 是容易误解的,那么用户可能会误解信息的涵义。他们进行 的一系列操作就有可能破坏薮据,甚至导致灾难性的系统失 败
Java程序设计大学教程 6.1 GUI编程基础 ◼ 图形用户界面（GUI）使用户可以和程序进行可视化交互。无 论是程序的设计者还是使用者都可以通过图形用户界面明显 “看到”和“感觉”到程序的存在。图形用户界面为不同的 应用程序提供了感觉上一致的用户界面组件，这样使用户在 记住执行功能的复杂命令上花费较少的时间，而花更多的时 间通过有效的方式来使用程序。 ◼ 一个设计良好的软件通常包括业务层的逻辑设计和表现层的 用户界面设计两大部分。因此，好的用户界面设计对一个系 统的成功是至关重要的。一个使用起来困难的界面，轻者会 造成用户操作不便；重者引起用户反感，不管系统的功能如 何而拒绝使用该软件系统。如果信息的表达方式是混乱的或 是容易误解的，那么用户可能会误解信息的涵义。他们进行 的一系列操作就有可能破坏数据，甚至导致灾难性的系统失 败
6.1.1图形用户界面 ■计算机操作界面的发展从单调的命令行形式到图形化窗 口形式,逐步形成了现在计算机用户认可的图形用户界 面主要特征,主要集中在窗口、图标、菜单、指点、图 形等方面 用户界面设计的一般性原则包括:用户熟悉、一致性、 意外最小化、可恢复性、用户指南、用户差异性等。 图形用户界面包含了许多独立的显示元素,供用户交互。 它们由程序中的GUI组件组成。GUI组件是用户通过键盘 或鼠标进行交互的对象,菜单、按钮、文本域、标签和 下拉列表框等GUI组件是图形用户界面的常用部分
Java程序设计大学教程 6.1.1 图形用户界面 ◼ 计算机操作界面的发展从单调的命令行形式到图形化窗 口形式，逐步形成了现在计算机用户认可的图形用户界 面主要特征，主要集中在窗口、图标、菜单、指点、图 形等方面。 ◼ 用户界面设计的一般性原则包括：用户熟悉、一致性、 意外最小化、可恢复性、用户指南、用户差异性等。 ◼ 图形用户界面包含了许多独立的显示元素，供用户交互。 它们由程序中的GUI组件组成。GUI组件是用户通过键盘 或鼠标进行交互的对象，菜单、按钮、文本域、标签和 下拉列表框等GUI组件是图形用户界面的常用部分
Java. lang 6.1.2 Swing oi Java. awt ■]ava类库中的/ Window 化组件,AWT 量级组件;而S Frame Dialog a Javax.swing 级组件。 JComponent JFrame JDialog Swing带来了L件个 J Checkbe 口更丰富、更方 RAdiobUtton Abstract Button JButton 口对底层平台的 JList MEnuitem J Menu 多。 JOptionPa POpupmEnu 口给不同平台上 JTextArea TextComponent JTextField <JPasswordField ■AWT与Swng JMenu Bar JScrollpane JPanel
Java程序设计大学教程 6.1.2 Swing和ATW ◼ Java类库中的ATW和Swing包提供了大量的可视 化组件，AWT组件是建立在对等模型的基础上的重 量级组件；而Swing组件则是用纯Java编写的轻量 级组件。 ◼ Swing带来了以下优势： 更丰富、更方便的用户界面元素集。 对底层平台的依赖更少，因此和平台有关的bug也少得 多。 给不同平台上的用户一致的感觉。 ◼ AWT与Swing的结构关系以及Swing的组件关系
6.1.3窗体容器 窗体(也叫 Windows)是显示在用户终端桌面上的图形元素 窗体可以充当各种组件和控件的一个容器。Java中的窗体类 容器可能是一个对话框( Dialog)、框架( Frame)或者是 个面板(Pane)等 ■Java中的主要窗体类容器如下 日 JApplet通过启用Java的Web浏览器或其他 Apple查看 器运行的程序 口 JDialog汇集用户输入的模式或无模式窗口。 口 JFrame顶层应用程序窗口 口 PAne|容纳部分界面的小型容器。反过来,该容器又可 用于其他任何容器中,如 JFrame、]Panel、 JApplet或 JDialog组件 口AWT窗体基于AWT的可视窗体。AWT窗体包括 Applet、 对话框、框架和面板。AWT与Swng的结构关系以及 Swing的组件关系
Java程序设计大学教程 6.1.3 窗体容器 ◼ 窗体（也叫Windows）是显示在用户终端桌面上的图形元素。 窗体可以充当各种组件和控件的一个容器。Java中的窗体类 容器可能是一个对话框（Dialog）、框架（Frame）或者是 一个面板（Panel）等。 ◼ Java中的主要窗体类容器如下： JApplet 通过启用Java 的Web浏览器或其他Apple 查看 器运行的程序。 JDialog 汇集用户输入的模式或无模式窗口。 JFrame 顶层应用程序窗口。 JPanel 容纳部分界面的小型容器。反过来，该容器又可 用于其他任何容器中，如 JFrame、JPanel、JApplet或 JDialog组件。 AWT窗体 基于AWT的可视窗体。AWT窗体包括Applet、 对话框、框架和面板。 AWT与Swing的结构关系以及 Swing的组件关系
6.1.3窗体容器 ■框架( JFrame)是一种常用的顶层容器。框架的内部结构 比较复杂,它可以划分为4种窗格:根窗格( Root pane)、 布局窗格( Layered pane)、内容窗格( Content pane) 1、用 getContentPane方法获得] Frame的内容窗格,再对其加入组件: frame. getContentPane(. add(child component) 2、建立一个]Pane之类的中间容器,把组件添加到容器中,用 setContentPane方法把该容器置为 JFrame的内容窗格 JPanel contentPane=new JPanel( /把其它组件添加到 JAne中 frame setContentPane (contentPane) ∥/把 contentpane对象设置成为fame的内容窗格
Java程序设计大学教程 6.1.3 窗体容器 ◼ 框架（JFrame）是—种常用的顶层容器。框架的内部结构 比较复杂，它可以划分为4种窗格：根窗格（Root Pane）、 布局窗格（Layered Pane）、内容窗格（Content Pane） 和玻璃窗格（Glass Pane）。 ◼ 对JFrame添加组件有两种方式：1、用getContentPane方 法获得JFrame的内容窗格，再对其加入组件；2、建立一个 JPanel之类的中间容器，把组件添加到容器中，用 setContentPane方法把该容器置为JFrame的内容窗格。 ◼ 面板（JPanel）有一个能够在上面进行绘制的表面，而且其 本身也是容器。因此，它除了可以绘制图形、文字，还能容 纳按钮、滑动条等其他用户界面元素。 Title JFrame Menu Root Pane Layered Pane Content Pane Class Pane MenuBar 1、用getContentPane方法获得JFrame的内容窗格，再对其加入组件： frame.getContentPane().add(childComponent); 2、建立一个JPanel之类的中间容器，把组件添加到容器中，用 setContentPane方法把该容器置为JFrame的内容窗格： JPanel contentPane=new JPanel( ); ……//把其它组件添加到JPanel中; frame.setContentPane(contentPane); //把contentPane对象设置成为frame的内容窗格
6.2图形与绘图 ■在Java中用于绘制文字、图形、图像的是 Graphics类,并通过图形组件的 ◆ paintComponent方法实现绘制工作。 我们通常把 Graphics称为与 Swing组件关联的 图形上下文( graphic context),因为它包含 了各种绘图的方法 Graphics是抽象类,不能直接创建 Graphics对 象,只能通过 JPanel或] Component的派生类 得到一个 Graphics对象
Java程序设计大学教程 6.2 图形与绘图 ◼ 在Java中用于绘制文字、图形、图像的是 Graphics类，并通过图形组件的 paintComponent方法实现绘制工作。 ◼ 我们通常把Graphics称为与Swing组件关联的 图形上下文（graphic context），因为它包含 了各种绘图的方法。 ◼ Graphics是抽象类，不能直接创建Graphics对 象，只能通过JPanel或JComponent的派生类 得到一个Graphics对象
6.2.1坐标系统 图形上下文使用一个简单的坐标系统,这个坐标系统中 的每个图形元素(像素)用x和y的坐标来表示。坐标系 统的原点,其坐标为(0,0),位于组件的左上角。 坐标表示一个点与原点的水平距离,y坐标表示一个点与 原点的垂直距离。X坐标从左到右增大,y坐标从上到下 增大 width宽 原点 (0,0)(1,0)(2,0) (0,1)(1,1) (0,2) (x,y) (坐标单位:像素)
Java程序设计大学教程 6.2.1 坐标系统 ◼ 图形上下文使用一个简单的坐标系统，这个坐标系统中 的每个图形元素（像素）用x和y的坐标来表示。坐标系 统的原点，其坐标为（0，0），位于组件的左上角。x 坐标表示一个点与原点的水平距离，y坐标表示一个点与 原点的垂直距离。x坐标从左到右增大，y坐标从上到下 增大 x轴 y轴 （ x，y ） （0， 0）（1， 0）（2， 0） （0， 1） （0， 2） （1， 1） width 宽 height 高 原点 （坐标单位：像素）
6.2.2颜色 ■Java中有专门处理颜色的类 Color ■Java的颜色是根据RGB值来建立的。RGB值是用于指定 红色、绿色和蓝色这3个分量的数字组合,三基色混合在 色和蓝色的3个单独的RGB值创建,RGB取值范围为0到 255之间的整数 ■ Color类还定义了一些标准的颜色,作为类常量使用。这 些颜色可以用来直接定义新的 Color对象 Color recolor= new Color(255,0,0);/红色 Color red color= Color. red/红色
Java程序设计大学教程 Color redColor=new Color(255,0,0);//红色 Color redColor=Color.RED;//红色 6.2.2 颜色 ◼ Java中有专门处理颜色的类Color。 ◼ Java的颜色是根据RGB值来建立的。RGB值是用于指定 红色、绿色和蓝色这3个分量的数字组合，三基色混合在 一起形成了最终的颜色。Color对象可以由代表红色、绿 色和蓝色的3个单独的RGB值创建，RGB取值范围为0到 255之间的整数。 ◼ Color类还定义了一些标准的颜色，作为类常量使用。这 些颜色可以用来直接定义新的Color对象
port java. awt. * public class Dao extends JFrame( setsize( width, height);//设置框架大小 幕正中 6.2.3绘图 Toolkit kit= Toolkit. get Default Toolkit Dimension screen Size=kit. getScreenSizeo nt x=(screen Size w idth -width)/2 setlocation(x,y):/设置框架位置 画线 setDefaultcloseO peration JFrame EXIT ON_CLOSE) draw Line (int xl, int yl, int x2, int y2) 该方法将用当前的颜色以(x1y1)为起点,(x2) public static void main( String args[ 绘拥图的R39 Yaan, int heat Draw Panel draw Panel=new Draw Panel( ∥/把其它组件添加到面板中 void fillRect(int x, int y, int width, int height) frame setContentPane(draw Panel); draw Rect方法和fRet方法分别可以用来绘制 frame setVisible(true); 矩形的左上角在(x,y),矩形的大小由参数 width int wi=4o0 原点(00)画椭圆和wdth int height=300 void drawevaint x nt y, int width, int heigt Class Draw Panel extends JPanek( *hh, int height) public Draw PanelO( void fiptovat-EX,果对2,y+d4用 fillOval setBackground(Color GRAY) 围内,这个矩形的左上角是在面板中绘制太根图形 定矩形为一个正方形 public void paintComponent(Graphics g)i super paintcomponent(g) height 画圆引 void ds t y, int width, int height rc(xy,d,d,0,180); int swe g setcolor( color. WHITE d Are(meX, Fnt- int width, int height, il gfilAr(x, y, d, d, 180. 180); (对d,y+d2)A9矩形犯围,矩形的左上角是9 etColor( Color. WHITE) le)(x+d*3/4, y+d/2) g fillEr(x+d/2,y+d/4,d/2,d/2,180,180) y轴四孤玄刑在一个 圆弧是以star(坐标单位:像素)度, sweepAngle g fillErs(x,y+d/4,d/2,d/2,,180); 画多边形三 g filloval(x+d*3/4-5,y+d/2-5,10,10) g setColor(Color. BLACK) void draw Polygon(int x[, int y], int numPo gfillOval(x+d/4-5, y+d/2-5, 10, 10); void fillPolygon(int x[l, int y[ l, int numPoint int d=200
Java程序设计大学教程 6.2.3 绘图 ◼ 画线 drawLine(int x1, int y1, int x2, int y2) 该方法将用当前的颜色以（x1,y1）为起点，（x2,y2）为终点画一条直线。 ◼ 画矩形 void drawRect(int x, int y, int width, int height) void fillRect(int x, int y, int width, int height) drawRect方法和fillRect方法分别可以用来绘制一个矩形的轮廓和一个被填充的矩形。 矩形的左上角在（x, y），矩形的大小由参数width和height来确定 ◼ 画椭圆和圆 void drawOval(int x, int y, int width, int height) void fillOval(int x, int y, int width, int height) 用drawOval方法可以绘制一个椭圆。而用fillOval方法可以填充一个椭圆。 椭圆被绘制在一个矩形范围内，这个矩形的左上角是(x,y)，而大小由参数width和height确定。 绘制圆形时，我们只需指定矩形为一个正方形。 ◼ 画圆弧 void drawArc(int x, int y, int width, int height, int startAngle, int sweepAngle) void fillArc(int x, int y, int width, int height, int startAngle, int sweepAngle) 圆弧被绘制在一个矩形范围内，这个矩形的左上角是(x,y)点，而大小由参数width和height确定。 圆弧是以startAngle为开始的角度，sweepAngle为转过的角度而绘制的。这些角是以度为单位的。 ◼ 画多边形 void drawPolygon(int x[ ], int y[ ], int numPoints) void fillPolygon(int x[ ], int y[ ], int numPoints) x轴 y轴 （x+d/4, y+d/2） （0,0） （x,y） width height 原点 （坐标单位：像素） d d/2 （ x+d/2, y+d/4 ） （x, y+d/4） （x+d*3/4, y+d/2） import javax.swing.*; import java.awt.*; public class Dao extends JFrame{ public Dao() { setSize(width,height);//设置框架大小 setTitle("道");//设置框架标题 //将框架显示在屏幕正中 Toolkit kit= Toolkit.getDefaultToolkit(); Dimension screenSize=kit.getScreenSize(); int x=(screenSize.width-width)/2; int y=(screenSize.height-height)/2; setLocation(x,y);//设置框架位置 setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); } public static void main(String args[]) { Dao frame=new Dao(); DrawPanel drawPanel=new DrawPanel( ); //把其它组件添加到面板中; frame.setContentPane(drawPanel); frame.setVisible(true); } int width=400; int height=300; } class DrawPanel extends JPanel{ public DrawPanel(){ setBackground(Color.GRAY); } //在面板中绘制太极图形; public void paintComponent(Graphics g) { super.paintComponent(g); g.setColor(Color.BLACK); g.fillArc(x,y, d, d,0,180); g.setColor(Color.WHITE); g.fillArc(x,y, d, d,180,180); g.setColor(Color.BLACK); g.fillArc(x+d/2, y+d/4, d/2, d/2,180,180); g.setColor(Color.WHITE); g.fillArc(x, y+d/4, d/2, d/2,0,180); g.fillOval(x+d*3/4-5, y+d/2-5, 10,10); g.setColor(Color.BLACK); g.fillOval(x+d/4-5, y+d/2-5, 10,10); } int x=100; int y=40; int d=200; } 绘制太极图的程序Dao.java