day01-GUI坦克大戰01

来源:https://www.cnblogs.com/liyuelian/archive/2022/09/01/16648000.html
-Advertisement-
Play Games

JavaGUI-坦克大戰 1.Java繪圖坐標體系 坐標體系介紹：下圖說明瞭一個Java坐標體系。坐標原點位於左上角，以像素為單位。在Java坐標體系中，第一個是x坐標，表示當前位置為水平方向，距離坐標原點x個像素；第二個是y坐標，表示當前位置為垂直方向，距離坐標原點y個像素。 坐標體系-像素： 繪 ...


JavaGUI-坦克大戰

1.Java繪圖坐標體系

  • 坐標體系介紹：下圖說明瞭一個Java坐標體系。坐標原點位於左上角，以像素為單位。在Java坐標體系中，第一個是x坐標，表示當前位置為水平方向，距離坐標原點x個像素；第二個是y坐標，表示當前位置為垂直方向，距離坐標原點y個像素。
image-20220831204636998
  • 坐標體系-像素：
    1. 繪圖還必須要搞清一個非常重要的概念-像素 一個像素等於多少釐米？
    2. 電腦在屏幕上顯示的內容都是由屏幕上的每一個像素組成的。例如：電腦顯示器的解析度是800*600，表示電腦屏幕上的每一行由800個點組成，共有600行，整個電腦屏幕共有480 000個像素。像素是一個密度單位，而釐米是一個長度單位，兩者無法比較。

2.繪圖入門和機制

繪圖原理：

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

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

例子1：畫出一個圓形

image-20220901001323839image-20220901002720848

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);
    }
}
image-20220901004020979 image-20220901004706222

在以下情況paint()將會被調用：

  1. 視窗最小化，再最大化
  2. 視窗的大小發生變化
  3. repaint方法被調用

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

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

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

image-20220901011147382

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

image-20220901011341138

repaint方法被調用在後面證明。

3.繪圖方法

Graphics類：

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

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

    在該圖形上下文的坐標系中的點 (x1, y1)和 (x2, y2)之間繪製一條使用當前顏色的線

  2. 畫矩形邊框 drawRect(int x, int y, int width, int height)

    繪製指定矩形的輪廓， 矩形的左右邊緣為x和x + width 。 頂部和底部邊緣為y和y + height

  3. 畫橢圓邊框drawOval(int x, int y, int width, int height)

    x，y為要繪製的橢圓的左上角的坐標，width為橢圓的寬度，height為橢圓的高度

  4. 填充矩形 fillRect(int x, int y, int width, int height)

    填寫指定的矩形。 矩形的左右邊緣為x和x + width - 1 。 頂部和底部邊緣在y和y + height - 1

  5. 填充橢圓fillOval(int x, int y, int width, int height)

    用當前顏色填充由指定矩形界定的橢圓。x，y為要填充的橢圓的左上角的坐標，width為要填充橢圓的寬度，height為填充橢圓的高度

  6. 畫圖片drawImage(Image img,int x,int y, ...)

    繪製當前可用的指定圖像的大小。 該圖像在其圖形上下文的坐標空間中的左上角（ x，y）處繪製。 圖像中的透明像素不會影響已經存在的任何像素

  7. 畫字元串drawString(String str,int x,int y)

    使用該圖形上下文的當前字體和顏色繪製由指定字元串給出的文本。 最左邊角色的基線是在這個圖形上下文的坐標系中的位置（ x，y）

  8. 設置畫筆的字體setFont(Font font)

    將此圖形上下文的字體設置為指定的字體。 使用此圖形上下文的所有後續文本操作都使用此字體。 空參數被預設忽略

  9. 設置畫筆的顏色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坦克坐標設計

image-20220901221039821

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);//設置顯示
    }
}
image-20220901220407229

繪圖練習：畫出如下圖形

1.蛤蟆

2.王八

3.小老鼠


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 拋磚引玉：純前端代碼讓手機變為一把吉他
    前言 前段時間一時興起想學一下吉他，但是一門樂器要演奏成“能聽”的程度也不是一天兩天的事情，對我這種音樂基礎為 0 的人來說學習周期太長了，不想耗費太多時間在學習樂器上面，於是想找個取巧的方法。 最終方案就是做了個簡單粗陋的微信小程式 Demo 去彈奏吉他樂，勉強算是成功吧，可以很簡單地彈奏出樂曲。 ...
  • 前端面試題每日3題——2022-09-01
    每日 3 題 7 以下代碼執行後，控制臺中的輸出內容為？ const obj = { flag: false, }; function A() { this.flag = true; return obj; } const a = new A(); console.log(a.flag); 8 以下 ...
  • 一種比css_scoped和css_module更優雅的避免css命名衝突小妙招
    我們來回憶一下，在`css_scoped`和`css_module`出現之前，人們是如何避免css命名衝突的？對，就是人為的定義一些`css命名空間`。那個時候，對每個Component組件都會在其根節點上定義一個不重覆的ID或者class作為其**命名空間**，然後其內部的其它class都會以此命... ...
  • iOS開發之進階篇（1）—— 證書、打包上架流程、p12文件
    iOS開發相關的證書有很多種，iOS開發證書（iOS App Development）、iOS發佈證書（iOS Distribution (App Store and Ad Hoc)）、網站推送ID證書（Website Push ID Certificate）、Apple Pay付款處理證書（App ...
  • 設計模式之（7）——裝飾設計模式
    Serverless 架構將成為未來雲計算領域重要的技術架構，將會被更多的業務所採納。進一步深究，Serverless 架構在什麼場景下有優秀的表現，在什麼場景下可能表現得並不是很理想呢？或者說，有哪些場景更適合 Serverless 架構呢？ ...
  • 初識設計模式 - 建造者模式
    顧名思義，如何建房子一樣，建造者模式可以將複雜對象的建造過程抽象出來，使用相同的構建過程可以構造出不同表現的對象。 ...
  • 用Python做一個中秋節嫦娥投食小游戲《千里嬋娟》
    山河遠闊，煙火人間，又一年，千里嬋娟~ 今天給大家帶來的是給玉兔投喂月餅的小游戲。八月十五中秋夜晚，讓我們對著月亮許願：希望我們在意和在意我們的人，諸邪避退、百事無忌、平安喜樂、萬事勝意。提前祝大家中秋節快樂。 中秋節的起源 中秋節起源於上古時代，普及於漢代，定型於唐朝初年，盛行於宋朝以後。中秋節是 ...
  • Windows OpenGL 圖像飽和度調節
    目錄 一.OpenGL 圖像飽和度調節 1.原始圖片 2.效果演示 二.OpenGL 圖像飽和度調節源碼下載 三.猜你喜歡 零基礎 OpenGL ES 學習路線推薦 : OpenGL ES 學習目錄 >> OpenGL ES 基礎 零基礎 OpenGL ES 學習路線推薦 : OpenGL ES 學 ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發（一）：使用.NET MAUI開發第一個安卓APP
    移動開發（一）：使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說，近來想嘗試開發一款安卓APP，考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP，畢竟是使用Visual Studio開發工具，使用起來也比較的順手，結合微軟官方的教程進行了安卓 ...
  • wpf ToggleButton選中效果和一個登錄界面
    前言 QuestPDF 是一個開源 .NET 庫，用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫，它徹底改變了我們生成 PDF 文檔的方 ...
  • 彈幕樹洞項目功能新增篇
    項目地址 項目後端地址： https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址： ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址： http://tree ...
  • 第27篇 sqlserver2022詳細安裝步驟
    話不多說，直接開乾 一.下載 1.官方鏈接下載： https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe，運行開始下載SQL server； 二. ...
  • .NET 開源高性能 MQTT 類庫
    前言 隨著物聯網（IoT）技術的迅猛發展，MQTT（消息隊列遙測傳輸）協議憑藉其輕量級和高效性，已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫，為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog文檔翻譯系列（六） - 可用的接收器、增強器、格式化輸出
    Serilog支持多種接收器用於日誌存儲，增強器用於添加屬性，LogContext管理動態屬性，支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項，適用於不同需求。 ...
  • 警惕 Visual Studio 屬性求值副作用導致邏輯不符合預期
    目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據，爬取信息時需要模擬瀏覽器行為，否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下： 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • [使用目前最新版]HybridCLR6.9.0+YooAsset2.2.4實現純C# Unity熱更新方案 (一)
    1.前言 什麼是熱更新 游戲或者軟體更新時，無需重新下載客戶端進行安裝，而是在應用程式啟動的情況下，在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR，Xlua，ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles，Addressable， ...
  • 在 ASP.NET Core Web API 中使用操作篩選器統一處理通用操作
    本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺，其實像阿裡雲，騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後，它會送 ...
  • 第28篇 如何.net中實現高效可靠數據同步api
    通過以下方式可以高效，並保證數據同步的可靠性 1.API設計 使用RESTful設計，確保API端點明確，並使用適當的HTTP方法（如POST用於創建，PUT用於更新）。 設計清晰的請求和響應模型，以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證，確保接收到的數據符合預期格 ...
所有分類