7 绘图
很多程序如各种游戏都需要在窗口绘制各种图形，除此之外，即使在开发JavaEE项目时，有时候也必须“动态”的向客户端生成各种图形，图表，比如 图形验证码、统计图等，这都需要利用AWT的绘图功能。
7.1 组件绘图原理
之前我们已经学习了很多组件，例如Button、Frame、Checkbox等，不同的组件，展示出来的图形都不一样，其实这些组件展示出来的图形，其本质就是用AWT的绘图来完成的。
在AWT中，真正提供绘图功能的是Graphics对象，那么Component组件和Graphics对象存在什么关系，才能让Component绘制自身图形呢？
在Component类中，提供了下列三个方法来完成组件图形的绘制与刷新：
| paint(Graphics g) | 绘制组件的外观 |
| update(Graphics g) | 内部调用paint方法，刷新组件外观 |
| repaint() | 调用update方法，刷新组件外观 |
组件绘制图形流程图：
一般情况下，update和paint方法是由AWT系统负责调用，如果程序要希望系统重新绘制组件，可以调用repaint方法完成。
7.2 Graphics对象的使用
AWT中提供了Canvas类充当画布，提供了Graphics类来充当画笔，通过调用Graphics对象的setColor()方法可以给画笔设置颜色。
画图的步骤：
1.自定义类，继承Canvas类，重写paint(Graphics g)方法完成画图；
2.在paint方法内部，真正开始画图之前调用Graphics对象的setColor(),setFont()等方法设置画笔颜色，字体等属性；
3.调用Graphics画笔的drawXxx()方法开始画图。
下面列出Graphics类中常用的一些方法：
| setColor(Color c) | 颜色设置 |
| setFont(Font font) | 字体设置 |
| drawLine() | 绘制直线 |
| drawRect() | 绘制矩形 |
| drawRoundRect() | 绘制圆角矩形 |
| drawOval() | 绘制椭圆形 |
| drawPolygon() | 绘制多边形 |
| drawArc() | 绘制圆弧 |
| drawPolyline() | 绘制折线 |
| fillRect() | 填充矩形区域 |
| fillRoundRect() | 填充圆角矩形区域 |
| fillOval() | 填充椭圆区域 |
| fillPolygon() | 填充多边形区域 |
| fillArc() | 填充圆弧对应的扇形区域 |
| drawImage() | 绘制位图 |
案例：
使用AWT绘图API，完成下图效果：
演示代码：
public class SimpleDraw {
private final String RECT_SHAPE="rect";
private final String OVAL_SHAPE="oval";
private Frame frame = new Frame("这里测试绘图");
Button btnRect = new Button("绘制矩形");
Button btnOval = new Button("绘制椭圆");
//定义一个变量，记录当前要绘制椭圆还是矩形
private String shape = "";
//自定义类，继承Canvas类，重写paint(Graphics g)方法完成画图；
private class MyCanvas extends Canvas{
@Override
public void paint(Graphics g) {
//绘制不同的图形
if (shape.equals(RECT_SHAPE)){
//绘制矩形
g.setColor(Color.BLACK);//设置当前画笔的颜色为黑色
g.drawRect(100,10,150,100);
}else if(shape.equals(OVAL_SHAPE)){
//绘制椭圆
g.setColor(Color.RED);
g.drawOval(100,10,150,100);
}
}
}
//创建自定义的画布对象
MyCanvas drawArea = new MyCanvas();
public void init(){
//组装视图
btnRect.addActionListener(new ActionListener() {
@Override
public void actionPerformed(ActionEvent e) {
//修改标记的值为rect
shape = RECT_SHAPE;
drawArea.repaint();
}
});
btnOval.addActionListener(new ActionListener() {
@Override
public void actionPerformed(ActionEvent e) {
//修改标记的值为oval
shape = OVAL_SHAPE;
drawArea.repaint();
}
});
//创建Panel，承载按钮
Panel p = new Panel();
p.add(btnRect);
p.add(btnOval);
frame.add(p,BorderLayout.SOUTH);
//drawArea的大小需要设置
drawArea.setPreferredSize(new Dimension(300,300));
frame.add(drawArea);
//设置WindowListener，监听用户点击X的动作，如果点击X，则关闭窗口
frame.addWindowListener(new WindowAdapter() {
@Override
public void windowClosing(WindowEvent e) {
//停止当前程序
System.exit(0);
}
});
frame.pack();
frame.setVisible(true);
}
public static void main(String[] args) {
new SimpleDraw().init();
}
}
7.3 处理位图
如果仅仅绘制简单的几何图形，程序的效果依旧比较单调。AWT也允许在组建上绘制位图，Graphics提供了drawImage(Image image)方法用于绘制位图，该方法需要一个Image参数——代表位图，通过该方法就可以绘制出指定的位图。
位图使用步骤：
1.创建Image的子类对象BufferedImage(int width,int height,int ImageType),创建时需要指定位图的宽高及类型属性，此时相当于在内存中生成了一张图片；
2.调用BufferedImage对象的getGraphics()方法获取画笔，此时就可以往内存中的这张图片上绘图了，绘图的方法和之前学习的一模一样；
3.调用组件paint方法中提供的Graphics对象的drawImage()方法，一次性的内存中的图片BufferedImage绘制到特定的组件上。
使用位图绘制组件的好处：
使用位图来绘制组件，相当于实现了图的缓冲区，此时绘图时没有直接把图形绘制到组件上，而是先绘制到内存中的BufferedImage上，等全部绘制完毕，再一次性的图像显示到组件上即可。
案例：
通过BufferedImage实现一个简单的手绘程序：通过鼠标可以在窗口中画图，右键鼠标可选择画笔颜色。
代码如下：
public class HandDraw {
//定义窗口对象
private Frame frame = new Frame("简单手绘程序");
//定义画图区的宽高
private final int AREA_WIDTH = 500;
private final int AREA_HEIGHT = 400;
//定义一个右键菜单，用于设置画笔的颜色
private PopupMenu colorMenu = new PopupMenu();
private MenuItem redItem = new MenuItem("红色");
private MenuItem greenItem = new MenuItem("绿色");
private MenuItem blueItem = new MenuItem("蓝色");
//定义一个变量，记录当前画笔的颜色
private Color forceColor = Color.BLACK;
//创建一个BufferedImage位图对象
BufferedImage image = new BufferedImage(AREA_WIDTH, AREA_HEIGHT, BufferedImage.TYPE_INT_RGB);
//通过位图，获取关联的Graphics对象
Graphics g = image.getGraphics();
//自定义一个类，继承Canvas
private class MyCanvas extends Canvas {
@Override
public void paint(Graphics g) {
g.drawImage(image, 0, 0, null);
}
}
MyCanvas drawArea = new MyCanvas();
//定义变量，记录鼠标拖动过程中，上一次所处的坐标
private int preX = -1;
private int preY = -1;
public void init() {
//组装视图，逻辑控制
ActionListener listener = new ActionListener() {
@Override
public void actionPerformed(ActionEvent e) {
String actionCommand = e.getActionCommand();
switch (actionCommand) {
case "红色":
forceColor = Color.RED;
break;
case "绿色":
forceColor = Color.GREEN;
break;
case "蓝色":
forceColor = Color.BLUE;
break;
}
}
};
redItem.addActionListener(listener);
greenItem.addActionListener(listener);
blueItem.addActionListener(listener);
colorMenu.add(redItem);
colorMenu.add(greenItem);
colorMenu.add(blueItem);
//把colorMenu设置给绘图区域
drawArea.add(colorMenu);
drawArea.addMouseListener(new MouseAdapter() {//给右键显示菜单提供监听事件
@Override
public void mouseReleased(MouseEvent e) {//当鼠标键抬起时被调用
boolean popupTrigger = e.isPopupTrigger();
if (popupTrigger) {
colorMenu.show(drawArea, e.getX(), e.getY());
}
//重置preX和preY
preX = -1;
preY = -1;
}
});
//设置位图的背景为白色
g.setColor(Color.white);
g.fillRect(0, 0, AREA_WIDTH, AREA_HEIGHT);
//通过监听鼠标的移动，完成线条绘制
drawArea.addMouseMotionListener(new MouseMotionAdapter() {
//该方法，当鼠标左键按下，并进行拖动时，会被调用
@Override
public void mouseDragged(MouseEvent e) {
if (preX > 0 && preY > 0) {
g.setColor(forceColor);
//画线条 需要两组坐标，分别代表线条的起点和终点 e.getX(),e.getY()可以获取坐标()
g.drawLine(preX, preY, e.getX(), e.getY());
}
//修正preX和preY的值
preX = e.getX();
preY = e.getY();
//重绘组件
drawArea.repaint();
}
});
drawArea.setPreferredSize(new Dimension(AREA_WIDTH,AREA_HEIGHT));
frame.add(drawArea);
//设置WindowListener，监听用户点击X的动作，如果点击X，则关闭窗口
frame.addWindowListener(new WindowAdapter() {
@Override
public void windowClosing(WindowEvent e) {
//停止当前程序
System.exit(0);
}
});
//设置frame最佳大小并可见
frame.pack();
frame.setVisible(true);
}
public static void main(String[] args) {
new HandDraw().init();
}
}7.4 ImageIO的使用
在实际生活中，很多软件都支持打开本地磁盘已经存在的图片，然后进行编辑，编辑完毕后，再重新保存到本地磁盘。如果使用AWT要完成这样的功能，那么需要使用到ImageIO这个类，可以操作本地磁盘的图片文件。
| static BufferedImage read(File input) | 读取本地磁盘图片文件(所传参数为一个file对象) |
| static BufferedImage read(InputStream input) | 读取本地磁盘图片文件(所传参数为输入流) |
| static boolean write(RenderedImage im, String formatName,File output) | 往磁盘中输出图片文件 |
案例:
编写图片查看程序，支持另存操作
代码演示：
public class ReadAndSaveImage {
private Frame frame = new Frame("图片查看器");
MenuBar menuBar = new MenuBar();
Menu menu = new Menu("文件");
MenuItem open = new MenuItem("打开");
MenuItem save = new MenuItem("另存为");
//声明BufferedImage对象，记录本地存取到内存中的图片
BufferedImage image;
private class MyCanvas extends Canvas{
@Override
public void paint(Graphics g) {
g.drawImage(image,0,0,null);
}
}
MyCanvas drawArea = new MyCanvas();
public void init() throws Exception{
//组装视图
open.addActionListener(e->{
//打开一个文件对话框
FileDialog fileDialog = new FileDialog(frame,"打开图片",FileDialog.LOAD);
fileDialog.setVisible(true);
//获取用户选择的图片路径以及名称
String dir = fileDialog.getDirectory();
String fileName = fileDialog.getFile();
try {
image = ImageIO.read(new File(dir,fileName));
drawArea.repaint();
} catch (IOException ex) {
ex.printStackTrace();
}
});
save.addActionListener(e->{
//展示一个文件对话框
FileDialog fileDialog = new FileDialog(frame,"保存图片",FileDialog.SAVE);
fileDialog.setVisible(true);
//获取用户设置的保存路径以及文件名称
String dir = fileDialog.getDirectory();
String fileName = fileDialog.getFile();
try {
ImageIO.write(image,"JPEG",new File(dir,fileName));
} catch (IOException ex) {
ex.printStackTrace();
}
});
menu.add(open);
menu.add(save);
menuBar.add(menu);
//把菜单条放入到窗口中
frame.setMenuBar(menuBar);
frame.add(drawArea);
frame.setBounds(200,200,740,508);
frame.setVisible(true);
frame.addWindowListener(new WindowAdapter() {
@Override
public void windowClosing(WindowEvent e) {
System.exit(0);
}
});
}
public static void main(String[] args) throws Exception {
new ReadAndSaveImage().init();
}
}
145
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
