JavaGUI-坦克大戰

1.Java繪圖坐標體系

坐標體系介紹：下圖說明了一個Java坐標體系，坐標原點位于左上角，以像素為單位，在Java坐標體系中，第一個是x坐標，表示當前位置為水平方向，距離坐標原點x個像素；第二個是y坐標，表示當前位置為垂直方向，距離坐標原點y個像素，

坐標體系-像素：
1. 繪圖還必須要搞清一個非常重要的概念-像素一個像素等于多少厘米？
2. 計算機在螢屏上顯示的內容都是由螢屏上的每一個像素組成的，例如：計算機顯示幕的解析度是800*600，表示計算機螢屏上的每一行由800個點組成，共有600行，整個計算機螢屏共有480 000個像素，像素是一個密度單位，而厘米是一個長度單位，兩者無法比較，

2.繪圖入門和機制

繪圖原理：

Component類提供了兩個和繪圖相關最重要的方法：
1. paint(Graphics g)繪制組件的外觀
2. repaint()重繪組件的外觀
當組件第一次在螢屏顯示的時候，程式會自動地呼叫paint()方法來繪制組件
在以下情況paint()將會被呼叫：
1. 視窗最小化，再最大化
2. 視窗的大小發生變化
3. repaint方法被呼叫

思考：如何證明上面的三種情況會呼叫paint()方法？

例子1：畫出一個圓形

package li.gui;

import javax.swing.*;
import java.awt.*;

public class DrawCircle extends JFrame {//JFrame對應視窗，可以理解成一個畫框

    //定義一個面板
    private MyPanel mp = null;

    public static void main(String[] args) {
        new DrawCircle();
    }

    public DrawCircle() {//構造器
        //初始化面板
        mp = new MyPanel();
        //把面板放入視窗（畫框）
        this.add(mp);
        //設定視窗的的大小
        this.setSize(400, 300);
        //當點擊視窗的小x時，程式完全退出
        this.setDefaultCloseOperation(JFrame.DISPOSE_ON_CLOSE);
        this.setVisible(true);//可以顯示
    }
}

//1 .先定義一個MyPanel，繼承JPanel類，畫圖形，就在面板上畫
class MyPanel extends JPanel {

    // 1.MyPanel 物件就是一個畫板
    // 2. Graphics g 把 g理解成一支畫筆
    // 3. Graphics提供了很多繪圖的方法
    @Override
    public void paint(Graphics g) {//繪圖方法
        super.paint(g);//呼叫父類的方法完成初始化
        System.out.println("paint方法被呼叫~");
        //畫出一個圓形
        g.drawOval(0, 0, 100, 100);
    }
}

在以下情況paint()將會被呼叫：

視窗最小化，再最大化
視窗的大小發生變化
repaint方法被呼叫

思考：如何證明上面的三種情況會呼叫paint()方法？

運行上面的程式，可以看到命令列視窗列印出“paint方法被呼叫~“的字樣，

這時，點擊繪制圓形圖案視窗的最小化按鈕，可以看到命令列視窗又列印了一行paint方法被呼叫的字樣：

拖動列印圓形圖案的視窗，調整其大小，可以看到命令列視窗一直顯示paint方法被呼叫：

repaint方法被呼叫在后面證明，

3.繪圖方法

Graphics類：

Graphics類可以理解就是畫筆，為我們提供了各種繪制圖形的方法[參考JDK幫助檔案]

畫直線 drawLine(int x1, int y1, int x2, int y2);

在該圖形背景關系的坐標系中的點 (x1, y1)和 (x2, y2)之間繪制一條使用當前顏色的線
畫矩形邊框 drawRect(int x, int y, int width, int height)

繪制指定矩形的輪廓，矩形的左右邊緣為x和x + width ，頂部和底部邊緣為y和y + height
畫橢圓邊框drawOval(int x, int y, int width, int height)

x，y為要繪制的橢圓的左上角的坐標，width為橢圓的寬度，height為橢圓的高度
填充矩形 fillRect(int x, int y, int width, int height)

填寫指定的矩形，矩形的左右邊緣為x和x + width - 1 ，頂部和底部邊緣在y和y + height - 1
填充橢圓fillOval(int x, int y, int width, int height)

用當前顏色填充由指定矩形界定的橢圓，x，y為要填充的橢圓的左上角的坐標，width為要填充橢圓的寬度，height為填充橢圓的高度
畫圖片drawImage(Image img,int x,int y, ...)

繪制當前可用的指定影像的大小，該影像在其圖形背景關系的坐標空間中的左上角（ x，y）處繪制，影像中的透明像素不會影響已經存在的任何像素
畫字串drawString(String str,int x,int y)

使用該圖形背景關系的當前字體和顏色繪制由指定字串給出的文本，最左邊角色的基線是在這個圖形背景關系的坐標系中的位置（ x，y）
設定畫筆的字體setFont(Font font)

將此圖形背景關系的字體設定為指定的字體，使用此圖形背景關系的所有后續文本操作都使用此字體，空引數被默認忽略
設定畫筆的顏色setColor(Color c)

將此圖形背景關系的當前顏色設定為指定的顏色，使用此圖形背景關系的所有后續圖形操作都使用此指定顏色

例子：演示具體用法

package li.gui;

import javax.swing.*;
import java.awt.*;

public class DrawCircle extends JFrame {//JFrame對應視窗，可以理解成一個畫框

    //定義一個面板
    private MyPanel mp = null;

    public static void main(String[] args) {
        new DrawCircle();
    }

    public DrawCircle() {//構造器
        //初始化面板
        mp = new MyPanel();
        //把面板放入視窗（畫框）
        this.add(mp);
        //設定視窗的的大小
        this.setSize(400, 300);
        //當點擊視窗的小x時，程式完全退出
        this.setDefaultCloseOperation(JFrame.DISPOSE_ON_CLOSE);
        this.setVisible(true);//可以顯示
    }
}

//1 .先定義一個MyPanel，繼承JPanel類，畫圖形，就在面板上畫
class MyPanel extends JPanel {

    // 1.MyPanel 物件就是一個畫板
    // 2. Graphics g 把 g理解成一支畫筆
    // 3. Graphics提供了很多繪圖的方法
    @Override
    public void paint(Graphics g) {//繪圖方法
        super.paint(g);//呼叫父類的方法完成初始化
        //System.out.println("paint方法被呼叫~");
        //畫出一個圓形
        //g.drawOval(0, 0, 100, 100);

        //演示繪制不同的圖形
        // 1. 畫直線 drawLine(int x1, int y1, int x2, int y2);
        //g.drawLine(10,10,100,100);

        // 2. 畫矩形邊框 drawRect(int x, int y, int width, int height)
        //g.drawRect(10,10,100,100) ;

        // 3. 畫橢圓邊框 drawOval(int x,  int y, int width, int height)
        //g.drawOval(10, 10, 100, 80);
        // 4. 填充矩形 fillRect(int x,  int y, int width, int height)
        //先設定畫筆的顏色
        //g.setColor(Color.blue);
        //g.fillRect(10,10,100,100);

        // 5. 填充橢圓 fillOval(int x,  int y, int width, int height)
        //g.setColor(Color.red);
        //g.fillOval(10,10,100,80);

        // 6. 畫圖片 drawImage(Image img,int x,int y, ...)
        //首先獲取圖片資源
        //注意圖片要放到out目錄的專案的根目錄下
        //Image image = Toolkit.getDefaultToolkit().getImage(Panel.class.getResource("/bg.png"));
        //g.drawImage(image,10,10,186,282,this);

        // 7. 畫字串 drawString(String str,int x,int y)
        //先設定字體顏色
        g.setColor(Color.green);
        g.setFont(new Font("隸書",Font.BOLD,50));
        g.drawString("閃電五連鞭",100,100);

        // 8. 設定畫筆的字體 setFont(Font font)
        // 9. 設定畫筆的顏色 setColor(Color c)

    }

}

4.繪制坦克游戲區域

4.1坦克坐標設計

Tank類

package li.TankGame.VersionFirst;

/**
 * @author 李
 * @version 1.0
 */
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;
    }
}

Hero類

package li.TankGame.VersionFirst;

/**
 * @author 李
 * @version 1.0
 */
public class Hero extends Tank{
    public Hero(int x, int y) {
        super(x, y);
    }
}

MyPanel類

package li.TankGame.VersionFirst;

import javax.swing.*;
import java.awt.*;

/**
 * @author 李
 * @version 1.0
 * 坦克大戰的繪圖區域
 */
public class MyPanel extends JPanel {
    //定義我的坦克
    Hero hero = null;

    public MyPanel() {
        hero = new Hero(100, 100);//初始化自己的坦克
    }

    @Override
    public void paint(Graphics g) {
        super.paint(g);
        g.fillRect(0, 0, 700, 550);//填充矩形，默認為黑色

        //畫出坦克-封裝方法
        drawTank(hero.getX(),hero.getY(),g,0,0);

    }

    /** 撰寫方法，畫出坦克
     * @param x      坦克的左上角橫坐標
     * @param 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-5,x+20,y+30);//畫出炮管
                break;
            default:
                System.out.println("暫時沒有處理");

        }

    }

}

TankGame01類（主方法）

package li.TankGame.VersionFirst;

import javax.swing.*;

/**
 * @author 李
 * @version 1.0
 */
public class TankGame01 extends JFrame {
    //定義一個MyPanel
    MyPanel mp = null;
    public static void main(String[] args) {
        TankGame01 tankGame01 = new TankGame01();
    }

    public TankGame01(){
        mp = new MyPanel();
        this.add(mp);//把面板（就是游戲的繪圖區域）添加進來
        this.setSize(700,550);//設定大小
        this.setDefaultCloseOperation(JFrame.DISPOSE_ON_CLOSE);//點擊視窗的叉時停止運行
        this.setVisible(true);//設定顯示
    }
}

繪圖練習：畫出如下圖形

1.蛤蟆

2.王八

3.小老鼠

轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/503356.html

標籤：其他

上一篇：Spring(四）-宣告式事務