12第12章图形用户界面程序设计入门.ppt
第12章 图形用户界面程序设计入门,学习目标,浏览简单的GUI组件 (§12.2). 描述 Java GUI 的API 层次结构 (§12.3). 使用框架、面板和简单的GUI组件创建用户界面 (§12.4). 理解布局管理器的作用 (§12.5). 使用 FlowLayout, GridLayout, 和 BorderLayout 布局管理器在容器中 设置组件的布局 (§12.5). 使用 Color 和 Font 类 (§12.6-12.7). 使用 JPanel 创建子容器 (§12.8). 使用 paintComponent 方法在面板上画图 (§12.9). 使用 Graphics 类中的绘图方法绘制字符串、直线、矩形、椭圆、弧形、多边形等 (§12.9).,GUI 组件,/ Create a button with text OK JButton jbtOK = new JButton(“OK“); / Create a label with text “Enter your name: “ JLabel jlblName = new JLabel(“Enter your name: “); / Create a text field with text “Type Name Here“ JTextField jtfName = new JTextField(“Type Name Here“); / Create a check box with text bold JCheckBox jchkBold = new JCheckBox(“Bold“); / Create a radio button with text red JRadioButton jrbRed = new JRadioButton(“Red“); / Create a combo box with choices red, green, and blue JComboBox jcboColor = new JComboBox(new String“Red“, “Green“, “Blue“);,按钮,标签,文本框,复选框,单选按钮,组合框,Swing vs. AWT,为什么GUI组件的类名都有前缀J呢？为什么不用Button，而用JButton呢？ 刚引入java的时候，图形组件存放于抽象窗口工具集（AWT）。 AWT 适合开发简单图形界面，对复杂的GUI项目不适用，因为它的解决方案非常适用于底层平台. 随着Java 2的发行, AWT 逐渐被更稳定、通用、灵活的库取代，即 Swing 组件库（Swing components）. java.awt.Window 或 java.awt.Panel子类的组件必须使用具体平台上的本地GUI来绘制。 . 不依赖本地GUI的Swing 组件成为轻型组件，AWT组件称为重型组件 。 Swing GUI组件类的开都有前缀字母J。,GUI 程序所用类的层次结构图,Container 类,Container 类用来包含其它组件。,GUI 辅助类,辅助类是组件和容器用来绘制和放置对象的。,Swing GUI 组件,核心组件,扩展组件,AWT 组件,框架Frames,Frame 是不能包含在其它窗口内的窗口. 在java GUI 程序中，它是包含其他Swing用户界面组件的容器。,创建框架,Run,import javax.swing.*; public class MyFrame public static void main(String args) JFrame frame = new JFrame(“Test Frame“); frame.setSize(400, 300); frame.setVisible(true); frame.setDefaultCloseOperation( JFrame.EXIT_ON_CLOSE); ,在 Frame中添加组件,/ Add a button into the frame frame.getContentPane().add( new JButton(“OK“);,Run,MyFrameWithComponents,Title bar,Content pane,注,内容窗格（ content pane）是 Container的一个子类 。 添加控件也可以使用以下语句: Container container = frame.getContentPane(); container.add(new JButton(“OK“); 内容窗格伴随着JFrame对象的创建而创建的，getContentPane方法简单地返回该内容窗格的引用，可以使用这个引用访问内容窗格。,框架居中,Run,CenterFrame,默认情况下，框架在屏幕的左上角显示。,布局管理器,Java的布局管理器提供了一层抽象，自动把用户界面映射到所有的窗口系统。 Java的GUI组件在容器中的位置由容器的布局管理器来安排。 使用 setLayout(LayoutManager) 方法在容器中设置布局管理器。,布局管理器种类,FlowLayout (Chapter 12) GridLayout (Chapter 12) BorderLayout (Chapter 12) 其他布局管理器将在下册介绍。,FlowLayout布局管理器,FlowLayout布局管理器按照添加的顺序，由左到右将组件排列在容器中，放满一行，就开始新的一行。,Run,FlowLayout布局管理器,ShowFlowLayout,Run,使用 FlowLayout布局管理器方式,FlowLayout 构造方法,public FlowLayout(int align, int hGap, int vGap) 根据指定的对齐方式、水平间距和垂直间距构造一个新的FlowLayout对象。间距用像素度量。 public FlowLayout(int alignment) 根据指定的对齐方式构造一个新的FlowLayout对象。默认的间距为5个像素。 public FlowLayout() 构造一个新的FlowLayout对象，默认的对齐方式是居中。默认的间距为5个像素。,GridLayout布局管理器,根据构造方法定义的行数和列数，GridLayout布局管理器以网格（矩阵）的形式排列组件。 组件按照添加的顺序从左到右排列。,ShowGridLayout,Run,GridLayout布局管理器,使用 GridLayout布局管理器方式,ShowGridLayout,Run,GridLayout构造方法,public GridLayout(int rows, int columns) 指定行和列 public GridLayout(int rows, int columns, int hGap, int vGap) 指定行、列、水平间距和垂直间距,BorderLayout布局管理器,BorderLayout布局管理器将窗口分成5个区：东区、南区、西区、北区和中央。,ShowBorderLayout,Run,使用add(Component,index)方法添加组件, index可以是： BorderLayout.EAST, BorderLayout.SOUTH, BorderLayout.WEST, BorderLayout.NORTH, BorderLayout.CENTER.,BorderLayout布局管理器,ShowBorderLayout,Run,12.6 颜色类 Color,可以使用 java.awt.Color 类为GUI组件设置颜色.颜色由红、绿、蓝三原色组成. Color c = new Color(r, g, b); 例如: Color c = new Color(228, 100, 255);,标准颜色,java.awt.Color中定义了 十三种标准颜色 (black, blue, cyan, darkGray, gray, green, lightGray, magenta, orange, pink, red, white, yellow). 从JDK 1.4, 修改了常量命名习惯，可以使用: BLACK, BLUE, CYAN, DARK_GRAY, GRAY, GREEN, LIGHT_GRAY, MAGENTA, ORANGE, PINK, RED, WHITE, and YELLOW.,设置颜色,可以使用如下方法设置前景色和背景色: setBackground(Color c) setForeground(Color c) Example: jbt.setBackground(Color.yellow); jbt.setForeground(Color.red);,12.7 Font 类,Font myFont = Font(name, style, size); Example: Font myFont = new Font(“SansSerif “, Font.BOLD, 16); Font myFont = new Font(“Serif“, Font.BOLD+Font.ITALIC, 12); JButton jbtOK = new JButton(“OK“); jbtOK.setFont(myFont);,字体名： 所有平台都支持的字体: SansSerif, Serif, Monospaced, Dialog, or DialogInput.,字型 Font.PLAIN (0), Font.BOLD (1), Font.ITALIC (2), and Font.BOLD + Font.ITALIC (3),查找所有可以使用的字体,GraphicsEnvironment e = GraphicsEnvironment.getLocalGraphicsEnvironment(); String fontnames = e.getAvailableFontFamilyNames(); for (int i = 0; i fontnames.length; i+) System.out.println(fontnamesi);,12.8 使用面板作为子容器,可以使用 new JPanel() 创建一个带默认布局管理器 FlowLayout 的面板, 也可以使用 new JPanel(LayoutManager) 创建一个指定布局管理器的面板. 使用 add(Component) 方法给面板添加一个组件. JPanel p = new JPanel(); p.add(new JButton(“OK“); 给JFrame添加组件,实际上添加到了的内容窗格中.,Example 12.4 Panels示例,使用面板组织组件. 创建一个微波炉的用户界面。,TestPanels,Run,12.9 在面板上绘制图形,JPanel 可以用作组织组件的小容器，另一个重要的作用是绘制图形. 要在面板上画图，需要创建一个由 JPanel 扩展的新类，并且覆盖paintComponent 方法告知面板如何画图。 在面板上可以显示文字、绘制图形和图像.,paintComponent 方法,paintComponent 方法的头标志: protected void paintComponent(Graphics g) The Graphics 对象由JVM为每个GUI组件自动创建。 绘制字符串: public void drawString(String string, int x, int y),在面板上绘制图形,public class DrawMessage extends JPanel /* Main method */ public static void main(String args) JFrame frame = new JFrame(“DrawMessage“); frame.getContentPane().add(new DrawMessage(); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); frame.setSize(300, 200); frame.setVisible(true); /* Paint the message */ protected void paintComponent(Graphics g) super.paintComponent(g); g.drawString(“Welcome to Java!“, 40, 40); ,Run,(40, 40),Java 坐标系统,(0, 0),X Axis,Y Axis,(x, y),x,y,Java 坐标系统,X Axis,传统坐标系统,(0, 0),Y Axis,注,Graphics类是提供设备无关图形界面的一个抽象类，它可以在不同平台的屏幕上显示图形和图像。 无论何时，只要显示一个组件，就会为它创建一个对象Graphics（即图形环境）。 当组件第一次显示或需要重新显示的时候， paintComponent方法会被自动调用来绘制图形环境。 为了确保在一幅新图显示之前视图区域是干净的，有必要调用super.paintComponent(g)方法。,绘制几何图形,绘制直线 绘制矩形 绘制椭圆 绘制弧形 绘制多边形,绘制直线,drawLine(int x1, int y1, int x2, int y2);,绘制矩形,drawRect(int x, int y, int w, int h); fillRect(int x, int y, int w, int h);,绘制圆角矩形,drawRoundRect(int x, int y, int w, int h, int aw, int ah); fillRoundRect(int x, int y, int w, int h, int aw, int ah);,DrawRectangles,Run,绘制椭圆,drawOval(int x, int y, int w, int h); fillOval(int x, int y, int w, int h);,DrawOvals,Run,绘制弧形,drawArc(int x, int y, int w, int h, int angle1, int angle2); fillArc(int x, int y, int w, int h, int angle1, int angle2);,单位是度,绘制弧形,DrawArcs,Run,绘制多边形和折线段,int x = 40, 70, 60, 45, 20; int y = 20, 40, 80, 45, 60; g.drawPolygon(x, y, x.length);,g.drawPolyline(x, y, x.length);,使用Polygons类绘制多边形,Polygon polygon = new Polygon(); polygon.addPoint(40, 59); polygon.addPoint(40, 100); polygon.addPoint(10, 100); g.drawPolygon(polygon);,绘制多边形,DrawPolygon,Run,12.10 使用 FontMetrics 类居中显示,FontMetrics 类可以度量下列属性:,public int getAscent() public int getDescent() public int getLeading(),getAscent(),getLeading(),getDescent(),getLeading(),public int getHeight() public int stringWidth(String str),CenterMessage,Run,
