Java绘图坐标体系

坐标体系-介绍

下图说明了Java坐标系。坐标原点位于左上角，以像素为单位。在Java坐标系中，第一个是x坐标，表示当前位置为水平方向，距离坐标原点x个像素；第二个是y坐标，表示当前位置为垂直方向，距离坐标原点y个像素。

坐标体系-像素

计算机在屏幕上显示的内容都是由屏幕上的每一个像素组成的。例如，计算机显示器的分辨率是800*600，表示计算机屏幕上的每一行由800个点组成，共有600行，整个计算机屏幕共有480 000个像素。像素是一个密度单位，而厘米是长度单位，两者无法比较。

Java绘图技术

介绍-快速入门

案例：

在面板上画一个小圆

package com16.draw;import javax.swing.*;
import java.awt.*;/*** @author 甲柒* @version 1.0* @title DrawCircle* @package com16.draw* @time 2023/3/13 20:06*/
public class DrawCircle extends JFrame {//JFrame对应窗口，可以理解为一个画框//定义一个面板private MyPanel mp = null;public DrawCircle() {//初始化面板mp = new MyPanel();//把面板放入到窗口(画框)this.add(mp);//设置窗口大小this.setSize(400, 300);this.setVisible(true);this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);}public static void main(String[] args) {new DrawCircle();}
}//1.先定义一个MyPanel，继承JPanel类，画图形，就在此面板上
class MyPanel extends JPanel {//说明//1.MyPanel 对象就是一个画板//2.Graphics g 把g理解成一支画笔//3.Graphics@Overridepublic void paint(Graphics g) {//绘图方法super.paint(g);//调用父类方法，完成初始化System.out.println("paint方法被调用");//画出一个圆形g.drawOval(10, 10, 100, 100);}
}

绘图原理

Component类提供了两个和绘图相关最重要的方法：

1. paint(Graphics g)绘制组件的外观

2. repaint()刷新组件的外观

当组件第一次在屏幕显示的时候，程序会自动的调用paint()方法来绘制组件

在以下情况下paint()将会被调用：

1. 窗口最小化，再最大化

2. 窗口的大小发生变化

3. repaint函数被调用

Graphics类

Graphics类，可以理解就是画笔，为我们提供了各种绘制图形的方法：[参考JDK帮助文档]

drawLine(int x1, int y1, int x2, int y2)//画直线
drawRect(int x, int y, int width, int height)//画矩形边框
drawOval(int x, int y, int width, int height)//画椭圆边框
fillRect(int x, int y, int width, int height)//填充矩形
fillOval(int x, int y, int width, int height)//填充椭圆
g.drawImage(Image img, int x, int y, ...)//画图片
drawString(String str, int x, int y)//画字符串
setFont(Font font)//设置画笔的字体
setColor(Color c)//设置画笔的颜色

package com16.draw;import javax.swing.*;
import java.awt.*;/*** @author 甲柒* @version 1.0* @title DrawCircle* @package com16.draw* @time 2023/3/13 20:06*/
public class DrawCircle extends JFrame {//JFrame对应窗口，可以理解为一个画框//定义一个面板private MyPanel mp = null;public DrawCircle() {//初始化面板mp = new MyPanel();//把面板放入到窗口(画框)this.add(mp);//设置窗口大小this.setSize(400, 300);this.setVisible(true);this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);}public static void main(String[] args) {new DrawCircle();}
}//1.先定义一个MyPanel，继承JPanel类，画图形，就在此面板上
class MyPanel extends JPanel {//说明//1.MyPanel 对象就是一个画板//2.Graphics g 把g理解成一支画笔//3.Graphics@Overridepublic void paint(Graphics g) {//绘图方法super.paint(g);//调用父类方法，完成初始化System.out.println("paint方法被调用");//画出一个圆形g.drawOval(10, 10, 100, 100);//演示绘制不同的图形//drawLine(int x1, int y1, int x2, int y2)//画直线g.drawLine(10, 10, 100, 100);//drawRect(int x, int y, int width, int height)//画矩形边框g.drawRect(10, 10, 100, 100);//drawOval(int x, int y, int width, int height)//画椭圆边框//fillRect(int x, int y, int width, int height)//填充矩形//设置画笔颜色g.setColor(Color.orange);g.fillRect(10, 10, 50, 50);//fillOval(int x, int y, int width, int height)//填充椭圆g.setColor(Color.CYAN);g.fillOval(50, 50, 50, 50);//g.drawImage(Image img, int x, int y, ...)//画图片//1.获取图片资源，/bg.png 表示在该项目的根目录去获取bg.png图片资源Image image = Toolkit.getDefaultToolkit().getImage(Panel.class.getResource("/bg.png"));g.drawImage(image, 10, 10, 175, 221, this);//drawString(String str, int x, int y)//画字符串g.setColor(Color.cyan);g.setFont(new Font("宋体", Font.BOLD, 50));//这里设置的100,100是字符串的左下角g.drawString("hello甲柒", 100, 100);//setFont(Font font)//设置画笔的字体//setColor(Color c)//设置画笔的颜色}
}

绘出坦克

坦克大战游戏中，会用到坦克，现在就利用Java绘图技术来画出一个小坦克，完成坦克大战游戏1.0版本

package com16.tankgame;/*** @author 甲柒* @version 1.0* @title Tank* @package com16.tankgame* @time 2023/3/13 22:27*/
public class Tank {private int x;//坦克的横坐标private int y;//坦克的纵坐标public Tank(int x, int y) {this.x = x;this.y = y;}public int getX() {return x;}public void setX(int x) {this.x = x;}public int getY() {return y;}public void setY(int y) {this.y = y;}
}

package com16.tankgame;/*** @author 甲柒* @version 1.0* @title Hero* @package com16.tankgame* @time 2023/3/13 22:29*/
public class Hero extends Tank {public Hero(int x, int y) {super(x, y);}
}

package com16.tankgame;import javax.swing.*;
import java.awt.*;/*** @author 甲柒* @version 1.0* @title MyPanel* @package com16.tankgame* @time 2023/3/13 22:30*/
public class MyPanel extends JPanel {//定义我的坦克Hero hero = null;public MyPanel() {hero = new Hero(100, 100);//初始化自己的坦克}@Overridepublic void paint(Graphics g) {super.paint(g);g.fillRect(0, 0, 1000, 750);//填充矩形，默认黑色//画出坦克-封装方法drawTank(hero.getX(), hero.getY(), g, 0, 0);drawTank(hero.getX() + 60, hero.getY(), g, 0, 1);}//编写方法，画出坦克/*** @param x      坦克的左上角x坐标* @param y      坦克的左上角y坐标* @param g      画笔* @param direct 坦克方向(上下左右)* @param type   坦克类型*/public void drawTank(int x, int y, Graphics g, int direct, int type) {switch (type) {case 0://自己的坦克g.setColor(Color.cyan);break;case 1://敌人的坦克g.setColor(Color.yellow);break;}//根据坦克的方向，来绘制坦克switch (direct) {case 0:g.fill3DRect(x, y, 10, 60, false);//画出坦克左边轮子g.fill3DRect(x + 30, y, 10, 60, false);//画出坦克右边轮子g.fill3DRect(x + 10, y + 10, 20, 40, false);//画出坦克的盖子g.fillOval(x + 10, y + 20, 20, 20);//画出圆形盖子g.drawLine(x + 20, y + 30, x + 20, y);//画出炮筒default:System.out.println("暂时没有处理");}}
}

package com16.tankgame;import javax.swing.*;/*** @author 甲柒* @version 1.0* @title TankGame01* @package com16.tankgame* @time 2023/3/13 22:33*/
public class TankGame01 extends JFrame {//定义MyPanelMyPanel mp = null;public TankGame01() {mp = new MyPanel();this.add(mp);//把面板(就是游戏的绘图区域)this.setSize(1000, 750);this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);this.setVisible(true);}public static void main(String[] args) {TankGame01 tankGame01 = new TankGame01();}
}

Java事件处理机制

事件处理机制-看一个问题

看一个小程序，让小球受到键盘的控制，上下左右移动。

package com16.event;import javax.swing.*;
import java.awt.*;
import java.awt.event.KeyEvent;
import java.awt.event.KeyListener;/*** @author 甲柒* @version 1.0* @title BallMove* @package com16.event* @time 2023/3/13 23:03*/
public class BallMove extends JFrame {//窗口MyPanel mp = null;//构造器public BallMove() {mp = new MyPanel();this.add(mp);this.setSize(400, 300);//窗口JFrame对象可以监听键盘事件，即可以监听到面板发生的键盘事件this.addKeyListener(mp);this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);this.setVisible(true);}public static void main(String[] args) {BallMove ballMove = new BallMove();}
}//面板，可以画出小球
//KeyListener是监听事件，可以监听键盘事件
class MyPanel extends JPanel implements KeyListener {//为了然小球可以移动，把它的左上角的坐标(x,y)设置变量int x = 10;int y = 10;@Overridepublic void paint(Graphics g) {super.paint(g);g.fillOval(x, y, 20, 20);//默认黑色}//有字符输出时，该方法会触发@Overridepublic void keyTyped(KeyEvent e) {}//当某个键按下，该方法会触发@Overridepublic void keyPressed(KeyEvent e) {//        System.out.println((char) e.getKeyCode() + "被按下~！~~");//根据用户按下的不同键，来处理小球的移动(上下左右)//在Java中会给每个键分配一个值(int)if (e.getKeyCode() == KeyEvent.VK_DOWN) {// KeyEvent.VK_DOWN 就是向下的箭头对应的codey++;} else if (e.getKeyCode() == KeyEvent.VK_UP) {y--;} else if (e.getKeyCode() == KeyEvent.VK_LEFT) {x--;} else if (e.getKeyCode() == KeyEvent.VK_RIGHT) {x++;}//重绘this.repaint();}//当某个键释放(松开)，该方法会触发@Overridepublic void keyReleased(KeyEvent e) {}
}

基本说明

Java事件处理是采取“委派事件模型”。当事件发生时，产生事件的对象，会把此“信息”传递给“事件的监听者”处理，这里所说的“信息”实际上就是java.awt.event事件类库里某个类所创建的对象，把它称为“事件的对象”。

示意图

机制分析

事件处理机制深入了解

1. 重要概念 事件源、事件、事件监听器

2. 事件源：事件源是一个产生事件的对象，比如按钮、窗口等

3. 事件：事件就是承载事件源状态改变时的对象，比如当键盘事件、鼠标事件、窗口事件等等，会生成一个事件对象，该对象保存着当前事件的很多信息，比如KeyEvent对象含有被按下键的Code值。java.awt.event包 和javax.swing.event包中定义了各种事件类型

4. 事件类型查阅JDK文档

5. 事件监听器接口

(1)当事件源产生一个事件，可以传送给事件监听者处理

(2)事件监听者实际上就是一个类，该类实现了某个事件监听器接口，比如MyPanle就是一个类，它实现了KeyListener接口，它就可以作为一个事件监听者，对接收到的事件进行处理

(3)事件监听器接口有很多种，不同的事件监听器接口可以监听不同发事件，一个类可以实现多个监听接口

(4)这些接口在java.awt.event包和javax.seing.event包中定义。列出常用的事件监听器接口

让坦克动起来

通过Java事件处理机制和Java绘图技术，让坦克可以通过按键控制上下左右的移动

package com16.tankgame02;/*** @author 甲柒* @version 1.1* @title Tank* @package com16.tankgame02* @time 2023/3/13 22:27*/
public class Tank {private int x;//坦克的横坐标private int y;//坦克的纵坐标private int direct;//坦克方向 0 上 1 右 2 下 3 左private int speed = 1;public int getSpeed() {return speed;}public void setSpeed(int speed) {this.speed = speed;}public Tank(int x, int y) {this.x = x;this.y = y;}//上下移动方法public void moveUp() {y -= speed;}public void moveRight() {x += speed;}public void moveDown() {y += speed;}public void moveLeft() {x -= speed;}public int getDirect() {return direct;}public void setDirect(int direct) {this.direct = direct;}public int getX() {return x;}public void setX(int x) {this.x = x;}public int getY() {return y;}public void setY(int y) {this.y = y;}
}

package com16.tankgame02;/*** @author 甲柒* @version 1.1* @title Hero* @package com16.tankgame02* @time 2023/3/13 22:29*/
public class Hero extends Tank {public Hero(int x, int y) {super(x, y);}
}

package com16.tankgame02;import javax.swing.*;
import java.awt.*;
import java.awt.event.KeyEvent;
import java.awt.event.KeyListener;/*** @author 甲柒* @version 1.1* @title MyPanel* @package com16.tankgame* @time 2023/3/13 22:30*/
public class MyPanel extends JPanel implements KeyListener {//定义我的坦克Hero hero = null;public MyPanel() {hero = new Hero(100, 100);//初始化自己的坦克hero.setSpeed(10);}@Overridepublic void paint(Graphics g) {super.paint(g);g.fillRect(0, 0, 1000, 750);//填充矩形，默认黑色//画出坦克-封装方法drawTank(hero.getX(), hero.getY(), g, hero.getDirect(), 0);}//编写方法，画出坦克/*** @param x      坦克的左上角x坐标* @param y      坦克的左上角y坐标* @param g      画笔* @param direct 坦克方向(上下左右)* @param type   坦克类型*/public void drawTank(int x, int y, Graphics g, int direct, int type) {switch (type) {case 0://自己的坦克g.setColor(Color.cyan);break;case 1://敌人的坦克g.setColor(Color.yellow);break;}//根据坦克的方向，来绘制对应形状坦克//direct表示方向(0：向上 1：向右 2：向下 3：向左)switch (direct) {case 0://表示向上g.fill3DRect(x, y, 10, 60, false);//画出坦克左边轮子g.fill3DRect(x + 30, y, 10, 60, false);//画出坦克右边轮子g.fill3DRect(x + 10, y + 10, 20, 40, false);//画出坦克的盖子g.fillOval(x + 10, y + 20, 20, 20);//画出圆形盖子g.drawLine(x + 20, y + 30, x + 20, y);//画出炮筒break;case 1://表示向右g.fill3DRect(x, y, 60, 10, false);//画出坦克左边轮子g.fill3DRect(x, y + 30, 60, 10, false);//画出坦克右边轮子g.fill3DRect(x + 10, y + 10, 40, 20, false);//画出坦克的盖子g.fillOval(x + 20, y + 10, 20, 20);//画出圆形盖子g.drawLine(x + 30, y + 20, x + 60, y + 20);//画出炮筒break;case 2://表示向下g.fill3DRect(x, y, 10, 60, false);//画出坦克左边轮子g.fill3DRect(x + 30, y, 10, 60, false);//画出坦克右边轮子g.fill3DRect(x + 10, y + 10, 20, 40, false);//画出坦克的盖子g.fillOval(x + 10, y + 20, 20, 20);//画出圆形盖子g.drawLine(x + 20, y + 30, x + 20, y + 60);//画出炮筒break;case 3://表示向左g.fill3DRect(x, y, 60, 10, false);//画出坦克左边轮子g.fill3DRect(x, y + 30, 60, 10, false);//画出坦克右边轮子g.fill3DRect(x + 10, y + 10, 40, 20, false);//画出坦克的盖子g.fillOval(x + 20, y + 10, 20, 20);//画出圆形盖子g.drawLine(x + 30, y + 20, x, y + 20);//画出炮筒break;default:System.out.println("暂时没有处理");}}@Overridepublic void keyTyped(KeyEvent e) {}//处理ADWS键按下的情况@Overridepublic void keyPressed(KeyEvent e) {if (e.getKeyCode() == KeyEvent.VK_W) {//按下W键//改变坦克的方向hero.setDirect(0);//修改坦克坐标 y+=1hero.moveUp();} else if (e.getKeyCode() == KeyEvent.VK_D) {//D键hero.setDirect(1);hero.moveRight();} else if (e.getKeyCode() == KeyEvent.VK_S) {//S键hero.setDirect(2);hero.moveDown();} else if (e.getKeyCode() == KeyEvent.VK_A) {//A键hero.setDirect(3);hero.moveLeft();}//重绘this.repaint();}@Overridepublic void keyReleased(KeyEvent e) {}
}

package com16.tankgame02;import javax.swing.*;/*** @author 甲柒* @version 1.1* @title TankGame02* @package com16.tankgame02* @time 2023/3/13 22:33*/
public class TankGame02 extends JFrame {//定义MyPanelMyPanel mp = null;public TankGame02() {mp = new MyPanel();this.add(mp);//把面板(就是游戏的绘图区域)this.setSize(1000, 750);this.addKeyListener(mp);//让JFrame监听mp的键盘事件this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);this.setVisible(true);}public static void main(String[] args) {TankGame02 tankGame02 = new TankGame02();}
}

章节练习

在TankGame02.java的基础上画出三辆敌人的坦克，注意颜色，如图

分析：

1. 因为敌人的坦克，是在MyPanel上，所以，代码在MyPanel

2. 因为敌人的坦克，后面有自己特殊的属性和方法，可以单开一个EnemyTank

3. 敌人坦克数量多，可以放在集合Vector，因为考虑多线程问题

package com16.tankgame02;/*** @author 甲柒* @version 1.1* @title Tank* @package com16.tankgame02* @time 2023/3/13 22:27*/
public class Tank {private int x;//坦克的横坐标private int y;//坦克的纵坐标private int direct;//坦克方向 0 上 1 右 2 下 3 左private int speed = 1;public int getSpeed() {return speed;}public void setSpeed(int speed) {this.speed = speed;}public Tank(int x, int y) {this.x = x;this.y = y;}//上下移动方法public void moveUp() {y -= speed;}public void moveRight() {x += speed;}public void moveDown() {y += speed;}public void moveLeft() {x -= speed;}public int getDirect() {return direct;}public void setDirect(int direct) {this.direct = direct;}public int getX() {return x;}public void setX(int x) {this.x = x;}public int getY() {return y;}public void setY(int y) {this.y = y;}
}

package com16.tankgame02;/*** @author 甲柒* @version 1.1* @title Hero* @package com16.tankgame02* @time 2023/3/13 22:29*/
public class Hero extends Tank {public Hero(int x, int y) {super(x, y);}
}

package com16.tankgame02;/*** @author 甲柒* @version 1.0* @title EnemyTank* @package com16.tankgame02* @time 2023/3/20 12:06* 敌人的坦克*/
public class EnemyTank extends Tank{public EnemyTank(int x, int y) {super(x, y);}
}

package com16.tankgame02;import javax.swing.*;
import java.awt.*;
import java.awt.event.KeyEvent;
import java.awt.event.KeyListener;
import java.util.Vector;/*** @author 甲柒* @version 1.1* @title MyPanel* @package com16.tankgame* @time 2023/3/13 22:30*/
public class MyPanel extends JPanel implements KeyListener {//定义我的坦克Hero hero = null;//定义敌人的坦克，放到VectorVector enemyTanks = new Vector<>();int enemyTankSize = 3;public MyPanel() {hero = new Hero(100, 100);//初始化自己的坦克//初始化敌人的坦克for (int i = 0; i < enemyTankSize; i++) {//创建一个敌人的坦克EnemyTank enemyTank = new EnemyTank((100 * (i + 1)), 0);//设置方向enemyTank.setDirect(2);//加入enemyTanks.add(enemyTank);}hero.setSpeed(10);}@Overridepublic void paint(Graphics g) {super.paint(g);g.fillRect(0, 0, 1000, 750);//填充矩形，默认黑色//画出坦克-封装方法drawTank(hero.getX(), hero.getY(), g, hero.getDirect(), 0);//画出敌人的坦克，遍历Vectorfor (int i = 0; i < enemyTanks.size(); i++) {//取出坦克EnemyTank enemyTank = enemyTanks.get(i);drawTank(enemyTank.getX(), enemyTank.getY(), g, enemyTank.getDirect(), 1);}}//编写方法，画出坦克/*** @param x      坦克的左上角x坐标* @param y      坦克的左上角y坐标* @param g      画笔* @param direct 坦克方向(上下左右)* @param type   坦克类型*/public void drawTank(int x, int y, Graphics g, int direct, int type) {switch (type) {case 0://自己的坦克g.setColor(Color.cyan);break;case 1://敌人的坦克g.setColor(Color.yellow);break;}//根据坦克的方向，来绘制对应形状坦克//direct表示方向(0：向上 1：向右 2：向下 3：向左)switch (direct) {case 0://表示向上g.fill3DRect(x, y, 10, 60, false);//画出坦克左边轮子g.fill3DRect(x + 30, y, 10, 60, false);//画出坦克右边轮子g.fill3DRect(x + 10, y + 10, 20, 40, false);//画出坦克的盖子g.fillOval(x + 10, y + 20, 20, 20);//画出圆形盖子g.drawLine(x + 20, y + 30, x + 20, y);//画出炮筒break;case 1://表示向右g.fill3DRect(x, y, 60, 10, false);//画出坦克左边轮子g.fill3DRect(x, y + 30, 60, 10, false);//画出坦克右边轮子g.fill3DRect(x + 10, y + 10, 40, 20, false);//画出坦克的盖子g.fillOval(x + 20, y + 10, 20, 20);//画出圆形盖子g.drawLine(x + 30, y + 20, x + 60, y + 20);//画出炮筒break;case 2://表示向下g.fill3DRect(x, y, 10, 60, false);//画出坦克左边轮子g.fill3DRect(x + 30, y, 10, 60, false);//画出坦克右边轮子g.fill3DRect(x + 10, y + 10, 20, 40, false);//画出坦克的盖子g.fillOval(x + 10, y + 20, 20, 20);//画出圆形盖子g.drawLine(x + 20, y + 30, x + 20, y + 60);//画出炮筒break;case 3://表示向左g.fill3DRect(x, y, 60, 10, false);//画出坦克左边轮子g.fill3DRect(x, y + 30, 60, 10, false);//画出坦克右边轮子g.fill3DRect(x + 10, y + 10, 40, 20, false);//画出坦克的盖子g.fillOval(x + 20, y + 10, 20, 20);//画出圆形盖子g.drawLine(x + 30, y + 20, x, y + 20);//画出炮筒break;default:System.out.println("暂时没有处理");}}@Overridepublic void keyTyped(KeyEvent e) {}//处理ADWS键按下的情况@Overridepublic void keyPressed(KeyEvent e) {if (e.getKeyCode() == KeyEvent.VK_W) {//按下W键//改变坦克的方向hero.setDirect(0);//修改坦克坐标 y+=1hero.moveUp();} else if (e.getKeyCode() == KeyEvent.VK_D) {//D键hero.setDirect(1);hero.moveRight();} else if (e.getKeyCode() == KeyEvent.VK_S) {//S键hero.setDirect(2);hero.moveDown();} else if (e.getKeyCode() == KeyEvent.VK_A) {//A键hero.setDirect(3);hero.moveLeft();}//重绘this.repaint();}@Overridepublic void keyReleased(KeyEvent e) {}
}

package com16.tankgame02;import javax.swing.*;/*** @author 甲柒* @version 1.1* @title TankGame02* @package com16.tankgame02* @time 2023/3/13 22:33*/
public class TankGame02 extends JFrame {//定义MyPanelMyPanel mp = null;public TankGame02() {mp = new MyPanel();this.add(mp);//把面板(就是游戏的绘图区域)this.setSize(1000, 750);this.addKeyListener(mp);//让JFrame监听mp的键盘事件this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);this.setVisible(true);}public static void main(String[] args) {TankGame02 tankGame02 = new TankGame02();}
}