CMake
MinGW
Qt 5.15
飞机大战是我们大家所熟知的一款小游戏,本教程就是教大家如何制作一款自己的飞机大战
首先我们看一下效果图
玩家控制一架小飞机,然后自动发射子弹,如果子弹打到了飞下来的敌机,则射杀敌机,并且有爆炸的特效
接下来再说明一下案例的需求,也就是我们需要实现的内容
创建项目步骤如下:
点击菜单 中的文件 -> 新建文件或项目 或者 在首页面中点击New Project
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-V2s8J5B9-1679839271058)(null)]
模板选择 Application -> Qt Widget Application
给项目起个名称以及选中项目要保存的地方
这一步选择后在Kits 构建套件中直接点击下一步即可
基类选择 QWidget
类名也就是我们第一个窗口场景的名称,这里我起名为 MainScene
代表游戏中的主场景
取消创建界面中的内容
在汇总页面中点击完成,我们就迈开了项目的第一步!
主场景设置的步骤如下:
创建新的头文件为config.h
主要记录程序中所有的配置数据,方便后期修改
注意使用CMake
的情况下要在对应CMakeLists.txt
文件中添加对应文件
set(PROJECT_SOURCES
main.cpp
mainscene.cpp
mainscene.h
config.h #游戏标题等主体配置数据
)
添加窗口宽度、高度的配置信息,依据背景图大小进行设置
#ifndef CONFIG_H
#define CONFIG_H
//游戏配置数据
#define GAME_WIDTH 512 //界面宽度
#define GAME_HEIGHT 768//界面高度
#define GAME_TITLE "飞机大战 v1.0"//标题
#endif // CONFIG_H
mainScene.h
中添加新的成员函数initScene
用来初始化游戏场景
void initScene();
mainScene.cpp
中实现如下代码void MainScene::initScene()
{
//初始化窗口大小
setFixedSize(GAME_WIDTH,GAME_HEIGHT);
//设置窗口标题
setWindowTitle(GAME_TITLE);
}
MainScene
中调用该函数 initScene
MainScene::MainScene(QWidget *parent)
: QWidget(parent)
{
//调用初始化场景函数
this->initScene();
}
测试运行效果如图:
在主场景中其实还有一个配置项没有实现,也就是窗口左上角的那个图标资源
那么接下来我们将游戏中的资源进行导入并且设置游戏图标
资源导入步骤
qrc
文件qrc
,加入前缀和文件
CMakeLists
中添加文件qrc
生成二进制文件 rcc
rcc
文件放入到debug同级目录下qrc
文件生成右键项目,点击添加新文件
选择Qt -> Qt Resource File
资源文件起名 如:res
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-rqJkXVZh-1679839268640)(null)]
生成res.qrc
文件
项目的同级目录下创建文件夹res,并将准备好的资源粘贴进去
qrc
文件右键qrc
文件,选中Open in Editor
添加前缀为 ‘’/‘’
添加文件 将res下所有文件选中即可
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-tFqdfWGf-1679839275554)(null)]
qrc
生成 rcc
二进制文件由于资源过大,会提示错误:
这个错误也就是“编译器的堆空间不足”。
由于资源文件qrc
过大,超出分配的内存范围
因此我们需要利用二进制资源,而生成二进制资源就需要我们刚刚的qrc
文件
利用cmd
打开终端,定位到res.qrc
的目录下,输入命令
rcc -binary .\res.qrc -o plane.rcc
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-I5dPcZGq-1679839270374)(null)]
将生成好的rcc文件,放入到debug同级目录中一份
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-PGU3DTsM-1679839276912)(null)]
在config.h
中追加配置数据
#define GAME_RES_PATH "./plane.rcc" //rcc文件路径
在main.cpp
中修改代码
#include "mainscene.h"
#include
#include
#include "config.h"
int main(int argc, char *argv[])
{
QApplication a(argc, argv);
//注册外部的二进制资源文件
QResource::registerResource(GAME_RES_PATH);
MainScene w;
w.show();
return a.exec();
}
此时,qrc
文件已经没用了,删除即可!
最简单的删除方式就是 .pro工程文件中删除代码,与工程无瓜葛
删除以下代码:
RESOURCES += \
res.qrc
配置文件config.h
中追加代码
虚拟资源路径语法如下:
" : + 前缀名 + 文件路径 "
#define GAME_ICON ":/res/img/app.ico" //游戏图标
在mainScene.cpp
的 initScene
函数中追加代码:
//设置图标资源
setWindowIcon(QIcon( GAME_ICON)); //加头文件 #include
运行测试:
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-5eqlUqf7-1679839274868)(null)]
步骤:
右键项目,添加新文件
选择C++ -> C++ Class
修改类名为map,点击下一步,直到创建完毕
至此,地图Map的文件和类创建完毕
在map.h
中添加如下代码
#ifndef MAP_H
#define MAP_H
#include //绘图设备
//地图类
class Map{
public:
//构造函数
Map();
//地图滚动坐标计算
void mapPosition();
public:
//地图图片对象
QPixmap map1;
QPixmap map2;
//地图Y轴坐标
int map1_posY;
int map2_posY;
//地图滚动幅度
int map_scroll_speed;
};
#endif // MAP_H
在config.h
中添加新的配置数据
/********** 地图配置数据 **********/
#define MAP_PATH ":/res/img_bg_level_1.jpg" //地图图片路径
#define MAP_SCROLL_SPEED 2 //地图滚动速度
在map.cpp
中实现成员函数
#include "map.h"
#include "config.h" //配置文件
//构造函数
Map::Map()
{
//初始化加载地图对象
map1.load(MAP_PATH);
map2.load(MAP_PATH);
//设置地图初始坐标
map1_posY=-GAME_HEIGHT;
map2_posY=0;
//设置地图加载速度
map_scroll_speed=MAP_SCROLL_SPEED;
}
//地图滚动坐标计算
void Map::mapPosition(){
//处理第一张图片滚动
map1_posY+=MAP_SCROLL_SPEED;//向下移动
if(map1_posY>=0){//如果全部移动到了界面 重置位置
map1_posY=-GAME_HEIGHT;
}
//处理第二张图片滚动
map2_posY+=MAP_SCROLL_SPE ED;//向下移动
if(map2_posY>=GAME_HEIGHT){//如果全部移动到了界面外 重置位置
map2_posY=0;
}
}
在mainScene.h
中添加新的定时器对象
QTimer m_timer;//定时器用于地图运动
在 config.h
中添加 屏幕刷新间隔
#define GAME_RATE 10 //刷新间隔,帧率 单位毫秒
在MainScene.cpp
的initScene
中追加代码
//定时器设置
m_Timer.setIntervalGAME_RATE);
在MainScene.h
中添加新的成员函数以及成员对象
//启动游戏 用于启动定时器对象
void playGame();
//更新坐标
void updatePosition();
//绘图事件
void paintEvent(QPaintEvent *event);
Map map;//地图对象 注意包含头文件
在MainScene.cpp
中实现成员函数
//启动游戏 用于启动计时器对象
void MainScene::playGame()
{
//启动定时器
m_timer.start();
//监听计时器 用于刷新地图
connect(&m_timer,&QTimer::timeout,this,[=](){
//更新游戏中元素的坐标
updatePosition();
//重新绘制图片
update();
});
}
//更新坐标
void MainScene::updatePosition()
{
//更新地图坐标
map.mapPosition();
}
//绘图事件
void MainScene::paintEvent(QPaintEvent *)
{
QPainter painter(this);
//绘制地图
painter.drawPixmap(0,map.map1_posY,map.map1);
painter.drawPixmap(0,map.map2_posY,map.map2);
}
步骤如下:
创建HeroPlane
类以及生成对应的文件
和创建地图的步骤一样,这里就不在详细截图了
创建好后生成HeroPlane.h
和 HeroPlane.cpp
两个文件
在HeroPlane.h
中添加代码
#ifndef HEROPLANE_H
#define HEROPLANE_H
#include
#include
class HeroPlane
{
public:
HeroPlane();
//发射子弹
void shoot();
//设置飞机位置
void setPosition(int x,int y);
public:
//飞机资源对象
QPixmap m_plane;
//飞机坐标
int x;
int y;
//飞机的矩形边框,用于碰撞检测
QRect m_rect;
};
#endif // HEROPLANE_H
这里飞机有个发射子弹的成员函数,由于我们还没有做子弹
因此这个成员函数先写成空实现即可
在config.h
中追加飞机配置参数
//飞机配置数据
#define HERO_PATH ":/res/img/hero2.png"//英雄飞机
heroPlane.cpp
中实现成员函数代码:
#include "heroplane.h"
#include "config.h"
HeroPlane::HeroPlane()
{
//初始化飞机图片资源
m_plane.load(HERO_PATH);
//初始化坐标
x=GAME_WIDTH*0.5-m_plane.width()*0.5;
y=GAME_HEIGHT-m_plane.height()-20;
//初始化矩形框
m_rect.setWidth(m_plane.width());
m_rect.setHeight(m_plane.height());
m_rect.moveTo(x,y);
}
//
void HeroPlane::shoot()
{
}
//设置飞机位置,包括碰撞检测框
void HeroPlane::setPosition(int x, int y)
{
this->x=x;
this->y=y;
m_rect.moveTo(x,y);
}
在MainScene.h
中追加新的成员属性
//飞机对象
HeroPlane hero;
在MainScene.cpp
的paintEvent
中追加代码
//绘制英雄
painter.drawPixmap(hero.x,hero.x,hero.m_Plane);
测试飞机显示到屏幕中
在MainScene.h
中添加鼠标移动事件
//鼠标移动事件
void mouseMoveEvent(QMouseEvent *event);
重写鼠标移动事件
void MainScene::mouseMoveEvent(QMouseEvent *event)
{
//记录鼠标坐标
int x=event->x()-hero.m_rect.width()*0.5;//鼠标位置减去碰撞检测矩形位置的一半
int y=event->y()-hero.m_rect.height()*0.5;//鼠标位置减去碰撞检测矩形位置的一半
//边界检测
if(x<=0){
x=0;
}
if(x>GAME_WIDTH-hero.m_rect.width()){
x=GAME_WIDTH-hero.m_rect.width();
}
if(y<=0){
y=0;
}
if(y>=GAME_HEIGHT-hero.m_rect.height()){
y=GAME_HEIGHT-hero.m_rect.height();
}
hero.setPosition(x,y);
}
测试飞机可以拖拽
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-dvt5DpOj-1679839265577)(https://cdn.jsdelivr.net/gh/ChaseYangGithub/MyBlogResource@main/MD/202303231955225.png)]
制作步骤如下:
创建Bullet类以及生成对应的文件
创建好后生成bullet.h
和 bullet.cpp
两个文件
在Bullet.h
中添加代码
#ifndef BULLET_H
#define BULLET_H
#include
class Bullet
{
public:
Bullet();
//更新子弹坐标
void updatePosition();
public:
QPixmap bullet;//子弹资源对象
//子弹坐标
int x;
int y;
int speed;//子弹移动速度
bool free;//子弹是否闲置
QRect rect;//子弹矩形碰撞检测狂
};
#endif // BULLET_H
在config.h
中追加子弹配置信息
/********** 子弹配置数据 **********/
#define BULLET_PATH ":/res/bullet_11.png" //子弹图片路径
#define BULLET_SPEED 5 //子弹移动速度
在bullet.cpp
中实现成员函数,代码如下:
#include "bullet.h"
#include"config.h"//配置文件
Bullet::Bullet()
{
// 加载子弹资源
bullet.load(BULLET_PATH);
//子弹坐标,初始位置可以随意设置,后续会重置
x=GAME_WIDTH*0.5-bullet.width()*0.5;
y=GAME_HEIGHT;
//子弹状态--默认为true;
free=true;
//子弹速度
speed=BULLET_SPEED;
//子弹矩形框
rect.setWidth(bullet.width());
rect.setHeight(bullet.height());
rect.moveTo(x,y);
}
//更新子弹坐标
void Bullet::updatePosition()
{
//如果子弹处于闲置状态,不需要进行坐标计算 直接返回
if(free){
return;
}
//子弹向上移动
y-=speed;
rect.moveTo(x,y);
// //如果在界面外,设置为闲置
if(y<=-rect.height()){
free=true;
}
}
子弹本身应该由飞机发射,测试阶段我们写一段辅助代码,看看效果即可
测试过后,这些代码可以删除掉
在MainScene.h
中添加测试代码
//测试子弹代码
Bullet temp_bullet;
在MainScene.cpp
中的updatePosition
里添加测试代码
//测试子弹代码
temp_bullet.m_Free = false;
temp_bullet.updatePosition();
在MainScene.cpp
中的paintEvent
里添加测试代码
//测试子弹代码
painter.drawPixmap(temp_bullet.m_X,temp_bullet.m_Y,temp_bullet.m_Bullet);
运行程序,此时会有一发子弹从屏幕中射出
测试完毕后,测试代码删除或注释即可
玩家发射子弹制作步骤如下:
在config.h
中添加新的配置数据
#define BULLET_NUM 30 //弹匣中子弹数目
#define BULLET_INTERVAL 20//子弹发射间隔
在HeroPlane.h
中新增成员属性如下:
//弹匣
Bullet bullets[BULLET_NUM];
//发射间隔记录
int record;
在构造函数HeroPlane
中初始化发生间隔记录
//初始化发射间隔记录
recorder = 0;
之前在英雄飞机类中预留的一个shoot函数我们进行实现,代码如下:
//射击实现
void HeroPlane::shoot()
{
//累计时间间隔记录变量
record++;
//判断记录数字,如果没有到达发射间隔,直接return
if(record
在MainScene.cpp
的updatePosition
成员函数中追加如下代码
//发射子弹
hero.shoot();
//计算子弹坐标
for(int i=0;i
在MainScene.cpp
的paintEvent
成员函数中追加如下代码:
//绘制子弹
for(int i=0;i
测试运行,玩家可以发射子弹
敌机制作与子弹制作原理类似,也是每隔一定的时间让敌机出场
制作步骤如下:
创EnemyPlane
类以及生成对应的文件
创建好后生成enemyPlane.h
和 enemyPlane.cpp
两个文件
在enemyPlane.h
中添加如下代码:
#ifndef ENERMYPLANE_H
#define ENERMYPLANE_H
#include
#include
class EnermyPlane
{
public:
EnermyPlane();
//更新坐标
void updatePosition();
public:
//低级资源对象
QPixmap enermy;
//位置
int x;
int y;
//敌机的边距检测
QRect rect;
//状态,与子弹类似
bool free;
//速度
int speed;
};
#endif // ENERMYPLANE_H
在config.h
中追加敌机配置信息
//敌机配置数据
#define ENERMY_PATH ":/res/img/img-plane_6.png" //敌机路径
#define ENERMY_SPEED 5 //敌机飞行速度
#define ENERMY_NUM 20 //敌机总量
#define ENERMY_INTERVAL 30 //敌机出场间隔
在enemyPlane.cpp
中实现成员函数,代码如下:
#include "enermyplane.h"
#include "config.h"
EnermyPlane::EnermyPlane()
{
//敌机资源加载
enermy.load(ENERMY_PATH);
//敌机位置
x=0;
y=0;
//敌机状态
free=true;
//敌机速度
speed=ENERMY_SPEED;
//敌机矩形
rect.setWidth(enermy.width());
rect.setHeight(enermy.height());
rect.moveTo(x,y);
}
void EnermyPlane::updatePosition()
{
//空闲状态不计算坐标
if(free){
return;
}
y+=speed;
rect.moveTo(x,y);
//离开屏幕或者被击毁设置为true
if(y>=GAME_HEIGHT){
free=true;
}
}
在MainScene.h
中追加敌机出场的成员函数
在MainScene.h
中追加敌机数组 和 敌机出场间隔记录 的成员属性
//敌机出现
void enermyToScene();
EnermyPlane enermys[ENERMY_NUM];//敌机数组
int record;//敌机出现间隔
初始化间隔记录属性,在MainScene.cpp
的initScene
成员函数中追加
m_recorder = 0;
实现成员函数enemyToScene
//敌机出现
void MainScene::enermyToScene()
{
record++;
//如果没到达间隔时间(record*timer.interval) 直接返回
if(record
在PlayGame
成员函数的timeout信号发送时候,槽函数中首先追加enemyToScene
//敌机出场
enemyToScene();
更新敌机坐标,在updatePosition
成员函数中追加代码
//计算敌机坐标
for(int i=0;i
绘制敌机,在paintEvent
成员函数中追加绘制敌机代码
//绘制敌机
for(int i=0;i
添加随机数种子
在MainScene.cpp
中 initScene
成员函数里添加随机数种子
//随机数种子
srand((unsigned int)time(NULL)); //头文件 #include
运行测试敌机出场效果
实现碰撞检测步骤如下:
在MainScene.h
中添加新的成员函数
void collisionDetection();
在MainScene.cpp
中实现该成员函数
//碰撞检测
void MainScene::collisionDetection()
{
//实现方式,遍历所有飞机和子弹,如果发生碰撞,释放为free
//遍历所有非空闲飞机
for(int i=0;i
在MainScene.cpp
中 playGame
成员函数里,追加碰撞检测代码
运行查看效果,子弹和敌机碰撞后会同时消失
爆炸效果功能实现步骤如下:
创建Bomb类以及生成对应的文件
创建好后生成bomb.h
和 bomb.cpp
两个文件
在config.h
中加入爆炸配置数据
#define BOMB_PATH ":/res/bomb-%1.png" //爆炸资源图片
#define BOMB_NUM 20 //爆炸数量
#define BOMB_MAX 7 //爆炸图片最大索引
#define BOMB_INTERVAL 20 //爆炸切图时间间隔
在bomb.h
中添加如下代码:
#ifndef BOMB_H
#define BOMB_H
#include
#include
class Bomb
{
public:
Bomb();
//更新信息
void updateInfo();
public:
//爆炸资源数组
QVector pix;
//爆炸位置
int x;
int y;
//爆炸状态
bool free;
//爆炸切图的时间间隔
int record;
//爆炸时加载图片的下标
int index;
};
#endif // BOMB_H
#include "bomb.h"
#include "config.h"
Bomb::Bomb()
{
//初始化爆炸图片数组
for(int i=0;iBOMB_MAX-1){
index=0;
free=true;
}
}
在MainScene.h
中加入爆炸数组 成员属性
//爆炸数组
Bomb m_bombs[BOMB_NUM];
在碰撞检测成员函数中,当发生碰撞时,设置爆炸对象的信息
//播放爆炸效果
for(int k=0;k
在 MainScene.cpp
的**updatePosition
**中追加代码
//计算爆炸坐标
for(int i=0;i
在 MainScene.cpp
的**paintEvent
** 中追加绘制爆炸代码
//绘制爆炸图片
for(int i=0;i
测试,实现爆炸效果
音效添加步骤如下:
在工程文件planeWar.pro
中修改代码
QT += core gui multimedia
CMake方式
在配置文件中修改添加
找到对应版本包
链接包和项目
当前版本 Qt5.15
cmake VERSION 3.5
#添加包Qt5::Multimedia
find_package(Qt${QT_VERSION_MAJOR} REQUIRED COMPONENTS Widgets Multimedia)
#添加引用链接Qt5::Multimedia
target_link_libraries(00PlaneWar PRIVATE Qt${QT_VERSION_MAJOR}::Widgets Qt5::Multimedia)
在config.h
中 添加音效的配置路径
//音效配置
#define SOUND_BACKGROUND ":/res/sounds/bg.wav"//背景音乐
#define SOUND_BOMB ":/res/sounds/bomb.wav"//爆炸音乐
注:
QSound
使用时候要包含头文件#include \
在PlayGame
中添加背景音乐
//启动背景音乐
QSound::play(SOUND_BACKGROUND);
在爆炸时候添加爆炸音效
//播放音效
QSound::play(SOUND_BOMB);
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-4pJg3vAT-1679839270667)(null)]
测试音效
程序先修改为release
版本
完成之后先运行
到项目的release版本build
文件复制exe程序到任意空文件夹中中运行cmd程序
低版本要找到Qt自带的命令行工具运行
并且切换到对应文件目录下
示例 文件名9_TurnOverGame.exe
C:\Users\yangc\Desktop\conin>windeployqt 9_TurnOverGame.exe
使用HM NIS Edit将上述文件打包成安装包教程实例
启动 HM NIS EDIT 软件,在软件中选择: 文件->新建脚本向导, 接下来跟着向导操作.
为了让安装包安装软件也有快捷方式图标,在生成的脚本里。进行修改:
CreateShortCut "$DESKTOP\飞机大战.lnk" "$INSTDIR\PlaneWar.exe"
CreateShortCut "$DESKTOP\飞机大战.lnk" "$INSTDIR\PlaneWar.exe" "" "$INSTDIR\app.ico"
点击菜单栏的 NSIS
,然后选择编译,在桌面生成安装包.
至此本案例实现完毕!