Java图形用户界面第7章.ppt

第 7 章,图形用户界面 程序设计,本章主要内容,图形用户界面（GUI） Java的基本绘图 Swing 组件设计 布局管理器,一、图形用户界面(GUI）,GUI是用图形的方式，借助于菜单、按钮等标准界面元素和鼠标操作，帮助用户方便地向计算机系统发出指令、启动操作，并将系统运行的结果也以同样的方式显示给用户的技术。,AWT,AWT (Abstract Window Toolkit) 译为抽象窗口工具包，它是 Java 语言为建立图形用户界面提供的API。其主要功能包括： 用户界面组件 事件处理模型 图形和图像工具 布局管理器,Swing,Java最初作为网络编程工具，提供的AWT功能比较弱，只能用来支持必要的用户界面组件。随着Java被越来越多的业内人士认可，应用范围的迅猛扩展，Sun公司意识到需要对AWT的设计进行修改，以适应于更加广泛的开发目的，于是就诞生了Swing。 Swing是继AWT之后，更加丰富、功能更加强大的GUI工具包，它构成了JFC（Java Foundation Class）的图形用户界面功能的核心部分。,Swing与AWT的主要区别,AWT是基于同位体（Peer）的体系结构，这种设计策略严重限制了用户界面中可以使用的组件种类及功能，成为一个致命的缺憾；而Swing不需要本地提供同位体，这样可以给设计者带来更大的灵活性，有利于增强组件的功能。 在AWT中，有一部分代码是用C编写的；而Swing是100%的纯Java，增强了应用程序的与环境无关性。,Swing与AWT的主要区别,Swing具有控制外观（Pluggable look and feel）的能力，即允许用户自行定制桌面的显示风格，比如，更换配色方案，让窗口系统更加适应用户的习惯和需要，而AWT 组件完全依赖于本地平台。 增加了裁剪板、鼠标提示、拖放和打印等功能。,与图形用户界面有关的包,java.awt 与绘图相关的类 java.event 与事件处理相关的类 javax.swing 与Swing组件相关的类,二、Java的基本绘图,绘图类 Graphics 颜色类 Color 字体类 Font,1、绘图类Graphics,Java的图形处理主要由 AWT中的Graphics类实现。该类支持两种类型的绘图功能：利用绘图成员方法绘图和显示图象。 Graphics是一个抽象类。在这个类中封装了所有的绘图操作。,Graphics类中的绘图成员方法,void drawLine(int startX,int startY,int endX,int endY); void drawRect(int x,int y,int width,int height); void fillRect(int x,int y,int width,int height) void drawRoundRect(int x,int y,int width,int height, int arcWidth,int arcHeight); void fillRoundRect(int x,int y,int width,int height, int arcWidth,int arcHeight); void draw3DRect(int x,int y,int width,int height,boolean raised); void fill3DRect(int x,int y,int width,int height,boolean raised); void drawOval(int x,int y,int width,int height); void fillOval(int x,int y,int width,int height);,Graphics类中的绘图成员方法,void drawArc(int x,int y,int width,int height, int startAngle,int endAngle); void fillArc(int x,int y,int width,int height, int startAngle,int endAngle); void drawString(String str,int x,int y); void drawPloygon(int xPoints,int yPoints, int numPoints); void fillPloygon(int xPoints,int yPoints, int numPoints);,利用Graphics类提供的成员方法绘图的基本步骤,创建绘图类对象 调用Graphics提供的成员方法绘图 = 创建绘图类对象的方法： 在Swing组件中，通过paintComponent()成员方法的参数获得绘图类对象 利用组件的getGraphics()成员方法显式地创建绘图对象，并用dispose()释放,import java.awt.*; import javax.swing.*; public class GraphicsDemo extends JPanel public static void main(String agrs) JFrame frm=new JFrame(“绘图应用范例“); frm.getContentPane().add(new GraphicsDemo(); frm.setDefaultCloseOperation( JFrame.EXIT_ON_CLOSE); frm.setSize(380,200); frm.setVisible(true); ,public void paintComponent(Graphics g) /刷新面板时，系统自动调用这个成员方法 super.paintComponent(g); g.drawString(“绘图对象“,5,40); g.drawLine(5,50,150,50); g.drawRect(5,55,50,50); g.fillRect(5,110,50,50); g.drawRoundRect(60,55,50,50,30,30); g.fillRoundRect(60,110,50,50,30,30); g.drawOval(115,55,50,50); g.fillOval(115,110,50,50); g.drawArc(100,5,100,100,0,45); g.fillArc(155,5,100,100,0,45); int x_vals=170,170,210,250,210; int y_vals=60,100,100,80,60; g.drawPolygon(x_vals,y_vals,x_vals.length); for (int i=0;i5;i+) y_valsi+=55; g.fillPolygon(x_vals,y_vals,x_vals.length); g.fill3DRect(260,5,100,70,true); g.fill3DRect(260,90,100,70,false); ,2、2D绘图方式,利用Graphics类中提供的方法实现绘图，其功能十分有限。从JDK1.2版本以后，Java提供了一种2D库，它体现了面向对象设计方法的思想。其中，包含了强大的绘图功能。,Graphics与Graphics2D的主要区别,Graphics类以成员方法的形式封装了绘制各种图形的工具，而Graphics2D将绘制的所有图形用相应的类对象标识，这是它们两个的主要区别。与Graphics相比，Graphics2D提供的几何图形控制、坐标转换、颜色管理和文本布局的功能更加强大，使用起来更加灵活。,Graphics2D类,利用Java 2D绘制图形时所需要的绘图工具都包含在Graphics2D类对象中，通常将此称为图形设备文本（graphics context）。无论希望在组件表面绘制什么图形，都要拥有一个图形设备文本对象，通过它实现绘制直线、曲线、各种几何图形、填充几何图形等一系列绘图操作。,获取Grphics2D对象的方式,Graphics2D是Graphics的子类，它们都是抽象类，因此不能够直接创建这两个类的对象，它们的创建过程完全由相应的组件控制。在Swing组件中，通过paintComponent()成员方法的参数获得绘图类对象。,Graphics2D类中提供的成员方法,draw(Shape shape) 使用图形设备文本的当前属性绘制由shape带入的图形。 fill(Shape shape) 使用图形设备文本的当前属性填充由shape带入的图形。 drawString(String text) 使用图形设备文本的当前属性绘制文本。 drawImage() 使用图形设备文本的当前属性显示图象。,在java.awt.geom包中定义了一系列实现Shape接口的几何图形类,Line2D 这是一个抽象类，定义了由两个端点确定的直线。在这个类中包含了两个内部类：Line2D.Float和Line2D.Double，它们分别实现用float和double类型的用户坐标定义直线端点的功能。 Ellipse2D 这是一个定义椭圆的抽象类，其中包含了两个内部类：Ellipse2D.Float和Ellipse2D.Double，它们分别实现用float和double类型的数值描述用户坐标点的功能。椭圆由左上角位置和封闭它的矩形宽度和高度确定。,Graphics2D应用举例,import java.awt.*; import java.awt.geom.*; import javax.swing.*; public class DrawTest public static void main(String args) DrawFrame frame=new DrawFrame(); frame.setDefaultCloseOperation( JFrame.EXIT_ON_CLOSE); frame.show(); ,import java.awt.*; import java.awt.geom.*; import javax.swing.*; public class DrawFrame extends JFrame public DrawFrame() setTitle(“DrawTest“); setSize(DEFAULT_WIDTH,DEFAULT_HEIGHT); DrawPanel panel=new DrawPanel(); Container contentPane=getContentPane(); contentPane.add(panel); public static final int DEFAULT_WIDTH=400; public static final int DEFAULT_HEIGHT=400; ,import java.awt.*; import java.awt.geom.*; import javax.swing.*; public class DrawPanel extends JPanel public void paintComponent(Graphics g) Graphics2D g2=(Graphics2D)g; Rectangle2D rect=new Rectangle2D.Double(100,100,200,150); g2.draw(rect); Ellipse2D ellipse=new Ellipse2D.Double(); ellipse.setFrame(rect); g2.draw(ellipse); g2.draw(new Line2D.Double(100,100,300,250); double centerX=rect.getCenterX(); double centerY=rect.getCenterY(); double radius=150; Ellipse2D circle=new Ellipse2D.Double(); circle.setFrameFromCenter(centerX,centerY, centerX+radius,centerY+radius); g2.draw(circle); ,3、颜色类,Java主要使用RGB模式描述颜色特性。R、G、B各用一个字节表示，取值范围为0255。 类库提供Color类描述颜色。,Color类提供的静态常量 Color.red,Color类提供的成员方法,Color(red,green,blue) public Color brighter() public Color darker() public int getRed() public int getGreen() public int getBlue(),设置颜色的成员方法,在Component类中，提供了设置组件前景颜色和背景颜色的成员方法： setForeground(Color color) setBackground(Color color) 在组件中绘图时，设置/获取绘图颜色的成员方法： setColor(Color color) getColor(Color color),import javax.swing.*; import java.awt.geom.*; public class LineArtTest public static void main(String args) JFrame frm=new JFrame(“LineArt Demo“); frm.getContentPane().add(new LineArtDemo(); frm.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); frm.setSize(300,200); frm.setVisible(true); ,设置绘图颜色,public class LineArtDemo extends JPanel private int mNumberOfLines; private Color mColor; public LineArtDemo( ) this(“); public LineArtDemo(String str) super( ); mNumberOfLines=25; mColor=new Color3; mColor0=new Color(255,0,0); mColor1=new Color(0,255,0); mColor2=new Color(0,0,255); public void paintComponent(Graphics g) Dimension d=getSize(); super.paintComponent(g); Graphics2D g2=(Graphics2D)g; for (int i=0;imNumberOfLines;i+) double ratio=(double)i/(double)mNumberOfLines; g2.setColor(mColori%mColor.length); g2.draw(new Line2D.Double(0,(int)(ratio*d.height), (int)(ratio*d.width),d.height); ,import java.awt.*; import java.awt.event.*; import javax.swing.*; import java.awt.geom.*; public class ColorDemo extends JPanel JPanel panel; JButton button1; JButton button2; Color color; public ColorDemo() color=Color.orange; setLayout(new BorderLayout(); setPreferredSize(new Dimension(300,200); button1=new JButton(“增量“); button1.addActionListener(new ActionListener() public void actionPerformed(ActionEvent e) color=color.brighter(); repaint(); button2.setEnabled(true); button1.setEnabled(false); );,改变颜色明暗,button1.setEnabled(false); button2=new JButton(“减暗“); button2.addActionListener(new ActionListener() public void actionPerformed(ActionEvent e) color=color.darker(); repaint(); button1.setEnabled(true); button2.setEnabled(false); ); panel=new JPanel(); panel.setBackground(Color.darkGray); panel.add(button1); panel.add(button2); add(panel,BorderLayout.SOUTH); ,public void paintComponent(Graphics g) super.paintComponent(g); g.setColor(color); g.fillRect(10,10, this.getWidth()-20, this.getHeight()- panel.getHeight()-20 ); public static void main(String agrs) JFrame frm=new JFrame(“颜色应用范例“); frm.getContentPane().add(new ColorDemo(); frm.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); frm.setSize(300,200); frm.setVisible(true); ,4、字体类,在AWT中有两个与字体相关的类： Font（字体类） FontMetrics（字体信息类） = 决定字体外观的三个属性： 字体、字体风格、字体大小,设置字体的基本步骤,创建Font对象 调用组件中的setFont()成员方法设置字体。 = Font构造方法的格式： Font(“字体名”,字体风格，字体大小) public static final int PLAIN = 0; /粗体 public static final int BOLD = 1; /斜体 public static final int ITALIC = 2; /普通,import java.awt.*; import javax.swing.*; public class setFontDemo extends JPanel public void paintComponent(Graphics g) super.paintComponent(g); Graphics2D g2=(Graphics2D)g; Font f1=new Font(“Times New Roman“,Font.BOLD,16); Font f2=new Font(“黑体“,Font.PLAIN,20); Font f3=new Font(“楷体_GB2312“,Font.ITALIC,24); setSize(200,160); g2.setFont(f1); g2.drawString(“TimesRoman BOLD 24“,10,40); g2.setFont(f2); g2.drawString(“黑体 PLAIN 36“,10,90); g2.setFont(f3); g2.drawString(“楷体_GB2312 ITALIC 48“,10,130); ,public static void main(String args) JFrame frm=new JFrame(“字体设置范例“); frm.getContentPane().add(new setFontDemo(); frm.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); frm.setSize(380,200); frm.setVisible(true); ,三、Swing 组件,Swing组件包含容器和普通组件。 容器：用来放置其他组件的组件 组件：放置在容器中的用户界面元素 在Java语言中，所有的容器和组件都用相应的类描述，因此，在设计图形用户界面之前一定要充分地了解相关的类定义。,1、容器,常用的Swing容器主要有两类： 顶层容器：包含其他组件和容器的容器。每个应用程序都应该有一个顶层容器。主要有：JApplet、JFrame和JDialog。 通用容器：指中间层容器。主要有JPanel、JScrollPane和JToolBar。,顶层容器的类结构,使用顶层容器需要注意的地方,每个GUI组件必须位于一个且仅一个容器中。 每个顶层容器包含一个内容窗格(Content pane)，所有的组件必须放置在内容窗格中。 可以在顶层容器中添加菜单栏，它将位于顶层窗格的约定位置。,顶层容器、内容窗格和菜单的位置关系,JFrame容器,构造方法： JFrame( ) JFrame(String title) 设置点击关闭窗口按钮的操作效果 void setDefaultCloseOperation(int) DO_NOTHING_ON_CLOSE HIDE_ON_CLOSE DISPOSE_ON_CLOSE EXIT_ON_CLOSE,设置窗口大小 void setSize(int width,int height) void setSize(Dimension size) 获取内容窗格 Container getContentPane() 将窗口设置为最佳大小 pack(),import java.awt.*; import java.awt.event.*; import javax.swing.*; public class TryJFrame public static void main(String agrs) JFrame frame = new JFrame(“JFrame应用举例“); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); JLabel label = new JLabel(“JFrame应用举例”); label.setPreferredSize(new Dimension(175, 100); frame.getContentPane().add(label, BorderLayout.CENTER); frame.pack(); frame.setVisible(true); ,JPanel类（通用容器）,JPanel容器又称为面板容器。 其主要特点有： 不能作为顶层容器； 可以嵌套放置； 组件直接放置在容器中；,import javax.swing.*; public class JPanelDemo public JPanelDemo() JButton button=new JButton(“Hello“); JPanel panel=new JPanel(); panel.setBackground(Color.orange); panel.setPreferredSize(new Dimension(300,200); panel.add(button); JFrame frm=new JFrame(“JPanel应用范例“); frm.getContentPane().add(panel); frm.pack(); frm.setVisible(true); public static void main(String args) JPanelDemo panelDemo=new JPanelDemo(); ,2、Swing组件,JComponent是所有Swing组件的父类。它增加了以下功能： 支持组件的可插入观感 支持工具提示 当组件被拖拽时，支持列表或树的自动滚动 支持扩展组件类，以创建自己需要的组件,1、标签组件（JLabel）,标签组件的主要用途是显示提示信息。JLabel 即可以显示文字，也可以显示图标。 public JLabel(String text, Icon icon, int horizontalAlignment) public JLabel(String text, int horizontalAlignment) public JLabel(String text) public JLabel(Icon image, int horizontalAlignment) public JLabel(Icon image) public JLabel(),public String getText() public void setText(String text) public Icon getIcon() public void setIcon(Icon icon) public int getVerticalAlignment() public void setVerticalAlignment(int alignment) public int getHorizontalAlignment() public void setHorizontalAlignment(int alignment) public int getVerticalTextPosition() public void setVerticalTextPosition(int textPosition) public int getHorizontalTextPosition(),import java.awt.*; import javax.swing.*; public class JLabelDemo extends JFrame public JLabelDemo() super(“标签组件应用范例“); Icon icon=new ImageIcon(“map.gif“); JLabel jLabel1=new JLabel(“标签组件1“); JLabel jLabel2=new JLabel(“标签组件2“,icon,SwingConstants.LEFT); JLabel jLabel3=new JLabel(); jLabel3.setText(“标签组件3“); jLabel3.setIcon(icon); jLabel3.setHorizontalTextPosition(SwingConstants.CENTER); jLabel3.setVerticalTextPosition(SwingConstants.BOTTOM); jLabel3.setToolTipText(“Label3“); Container contentPane=getContentPane(); contentPane.setLayout(new FlowLayout(); contentPane.add(jLabel1); contentPane.add(jLabel2); contentPane.add(jLabel3); setSize(200,100); show(); public static void main(String args) JLabelDemo frm=new JLabelDemo(); frm.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); ,2、按钮组件,复选框,单选框,按钮,使用按钮组件的基本步骤,创建按钮对象 将按钮对象添加到容器中 设置响应单击按钮事件的操作,主要的成员方法,boolean isSelected() void setSelected(boolean b) String getText() void setText(String text) Icon getIcon() void setIcon(Icon icon) Icon getDisableIcon() void setDisabledIcon(Icon icon),JButton,JButton类定义了最常见的按钮，用来响应用户的某项操作请求。 JButton() JButton(Icon icon) JButton(String text) isDefaultButton() setDefaultButton(Button default),import java.awt.*; import java.awt.event.*; import javax.swing.AbstractButton; import javax.swing.*; public class TryButton extends JPanel implements ActionListener protected JButton b1, b2, b3; public TryButton() b1 = new JButton(“Disable middle button“); b1.setVerticalTextPosition(AbstractButton.CENTER); b1.setHorizontalTextPosition(AbstractButton.CENTER); b1.setMnemonic(KeyEvent.VK_D); b1.setActionCommand(“disable“); b2 = new JButton(“Middle button“); b2.setVerticalTextPosition(AbstractButton.BOTTOM); b2.setHorizontalTextPosition(AbstractButton.CENTER); b2.setMnemonic(KeyEvent.VK_M);,b3 = new JButton(“Enable middle button“); b3.setMnemonic(KeyEvent.VK_E); b3.setActionCommand(“enable“); b3.setEnabled(false); b1.addActionListener(this); b3.addActionListener(this); b1.setToolTipText(“ To disable the middle button.“); b2.setToolTipText(“Does nothing when you click it.“); b3.setToolTipText(“Enable the middle button.“); add(b1); add(b2); add(b3); ,public void actionPerformed(ActionEvent e) if (“disable“.equals(e.getActionCommand() b2.setEnabled(false); b1.setEnabled(false); b3.setEnabled(true); else b2.setEnabled(true); b1.setEnabled(true); b3.setEnabled(false); ,public static void main(String args) JFrame frame = new JFrame(“TryButton“); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); TryButton newContentPane = new TryButton(); frame.setContentPane(newContentPane); frame.pack(); frame.setVisible(true); ,JCheckBox,在Swing中，复选按钮用 JCheckBox类实现。与JButton相同，可以为之设置文本串和图像。通常，将多个复选按钮组合成一组，对于处于一组中的复选按钮，每一时刻既可以选择一项，又可以选择多项。,JRadioButton组件,JRadioButton( ) JRadioButton( Icon) JRadioButton( String) JRadioButton( String,Icon) JRadioButton( Icon,boolean) JRadioButton( String,boolean) JRadioButton( String,Icon,boolean) 通常与ButtonGroup结合使用,3、文本框,文本框是接收用户输入的一种组件。,主要的成员方法,String getText() void setText(String text) boolean isEditable() void setEditable(boolean editable) int getColumns() void setColumns(int col),import java.awt.*; import java.awt.event.*; import javax.swing.*; public class JTextFieldDemo extends JFrame JTextField jText; JPasswordField jPassword; public JTextFieldDemo() JLabel jLabel1=new JLabel(“用户：“); JLabel jLabel2=new JLabel(“密码：“); jText=new JTextField(20); jPassword=new JPasswordField(20); JButton jButton=new JButton(“确定“); jButton.addActionListener(new ActionListener() public void actionPerformed(ActionEvent e) jButton_actionPerformed(e); );,JPanel contentPane=(JPanel)getContentPane(); contentPane.setLayout(new FlowLayout(); contentPane.add(jLabel1); contentPane.add(jText); contentPane.add(jLabel2); contentPane.add(jPassword); contentPane.add(jButton); setSize(300,150); setTitle(“文本输入框范例“); show(); ,private void jButton_actionPerformed(ActionEvent e) String user=jText.getText(); String pword= String.copyValueOf(jPassword.getPassword(); JOptionPane.showMessageDialog(getParent(), “用户：“+user+“n“+“密码：“+pword); public static void main(String args) JTextFieldDemo frm=new JTextFieldDemo(); frm.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); ,四、布局管理器,对于不同的操作平台，显示文字、图形的方式可能有所不同。如果显式地指定一个组件的绝对位置和大小，有可能结果不可预测。为此，Java语言提供了布局管理器来管理放置在容器内部的各组件大小及排列布局。 利用setLayout( )设置布局管理器 每种容器都有一种默认的布局管理器 若不使用布局管理器，setLayout(NULL),常用的布局管理器,FlowLayout (流程式)布局管理器 BorderLayout (边框式)布局管理器 CardLayout (卡片式)布局管理器 GridLayout (网格式)布局管理器,1、FlowLayout布局管理器,FlowLayout自左向右、自上向下地布置容器中所包含的GUI组件。 JPanel默认的布局管理器就是FlowLayout 构造方法 FlowLayout( ) FlowLayout(int align) /默认中对齐 FlowLayout(int align,int hgap,int vgap),import java.awt.*; import java.awt.event.*; import javax.swing.*; public class FlowLayoutDemo extends JFrame public FlowLayoutDemo( ) super(“FlowLayout布局管理器“); Container contentPane=getContentPane(); contentPane.setLayout( new FlowLayout( ); contentPane.add( new JButton(“1“) ); contentPane.add( new JButton(“2“) ); contentPane.add( new JButton(“3“) ); contentPane.add( new JButton(“4“) ); contentPane.add( new JButton(“5“) ); contentPane.add( new JButton(“6“) ); contentPane.add( new JButton(“7“) ); contentPane.add( new JButton(“8“) ); setSize(320,240); setVisible(true); setResizable(false); public static void main( String args ) FlowLayoutDemo frm=new FlowLayoutDemo( ); frm.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); ,2、BorderLayout布局管理器,BorderLayout将整个容器划分为5个区域：North(上部)、South(下部)、East(右侧)、West(左侧)和Center(中部)。JFrame的内容窗格的默认布局管理器是BorderLayout。,构造方法,BorderLayout( ) BorderLayout(int hgap,int vgap) 如果使用BorderLayout布局容器中的组件，需要 明确地指出组件放置的位置 add(new Button(“Button”),BorderLayout.SOUTH); 否则默认为中间区域。,import java.awt.*; import java.awt.event.*; import javax.swing.*; public class BorderLayoutDemo extends JFrame public BorderLayoutDemo() super(“BorderLayout布局管理器“); Container contentPane=getContentPane(); contentPane.add( new JButton(“南”) , BorderLayout.SOUTH); contentPane.add( new JButton(“北“) ,BorderLayout.NORTH); contentPane.add( new JButton(“中间“) ,BorderLayout.CENTER); contentPane.add( new JButton(“西“) ,BorderLayout.WEST); contentPane.add( new JButton(“东“) ,BorderLayout.EAST); setSize(320,240); setVisible(true); public static void main( String args ) BorderLayoutDemo frm=new BorderLayoutDemo( ); frm.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); ,3、CardLayout布局管理器,CardLayout 布局管理器提供了一种基于卡片式的布局管理器。它并没有可视化地安排组件，它所产生的效果就像一副扑克牌一样叠在一起，每次显示时只显示最上面的一张牌，需要显示下一张时，只需把最上面的一张牌放到最底下即可。,构造方法,CardLayout( ) CardLayout(int hgap,int vgap) 常用的几个方法 void first(Container) void last(Conta