QML小案例 使用QML简单实现翻牌版扫雷游戏（一）

2024-02-23 07:20
文章标签 简单 实现 使用 游戏 案例 扫雷 qml 翻牌

本文主要是介绍QML小案例 使用QML简单实现翻牌版扫雷游戏（一），希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

乘着最近不忙，学习学习QML的相关知识点，本来打算在项目中直接使用QML开发几个小窗体的，但是才学这玩意，把握不注，所以就打算还是先写几个案例学习学习先。
扫雷这个游戏大家都玩过，功能也简单，正好拿来练手。
分为两章节，当前为C++处理部分

导读

    • QML简单介绍
    • 扫雷案例
      • 获取素材
      • 最终效果展示
      • 预处理
      • C++ 类生成数据
        • 定义 元对象宏定义
        • 定义 C++类
        • 生成一个二维矩阵
        • 点击判断点击的是不是炸弹

QML简单介绍

Qt中的QML框架是一种用于描述应用程序用户界面的声明式编程语言，全称是Qt Meta-Object Language（Qt元对象语言）。它允许开发人员和设计人员创建高性能、流畅的动画和具有视觉吸引力的应用程序。

QML主要基于一些可视组件以及这些组件之间的交互、关联来描述用户界面。它是一种高可读性的语言，设计目的是使组件能够以动态方式互连，并且允许在用户界面中轻松地重用和定制组件。Qt QML模块为QML语言开发应用程序和库提供了一个框架，它定义并实现了语言及其引擎架构，并且提供了一个接口，允许应用开发者以自定义类型和集成JavaScript、C++代码的方式来扩展QML语言。

Qt Quick是QML类型和功能的标准库，包含了可视化类型、交互类型、动画、模型和视图、粒子特效和渲染特效等。在QML应用程序中，可以通过一个简单的import语句来使用Qt Quick模块提供的所有功能。Qt Quick模块提供了QML创建用户界面所需的所有基本类型，并允许使用QML语言创建用户界面的QML接口和使用C++语言扩展QML的C++接口。

总的来说，QML框架提供了一种高效的方式来开发用户界面，它结合了声明式编程的灵活性和Qt Quick的强大功能库，使得开发人员能够创建出具有丰富交互和视觉吸引力的应用程序。同时，QML也支持与JavaScript和C++的无缝整合，进一步增强了其开发效率和灵活性。

QML开发资料比较少，也就一些对界面要求比较高的公司会强调需要使用QML开发，我去年看招聘网站上也就三四个公司指定需要掌握QML技术，建议学习的时候多问文言一心或者老北鼻GPT。多了解一些控件使用。

扫雷案例

扫雷这个游戏代码量不高，算法上主要是随机生成一个布设指定数量炸弹的二维数组，循环实现一个9格内的炸弹数量统计和空白处的一个查找临近所有空白的功能。
写案例的时候参考的是蓝色的Win10的扫雷游戏，这个版的扫雷特别经典。敲代码累了就来一局。
在这里插入图片描述

获取素材

没找到免费的蓝色版本的扫雷游戏素材，手动截图也不好看，只好另辟蹊径找了一
个卡牌版的素材，大差不差的就将就用着。
素材来源：https://game-icons.net/
请添加图片描述

最终效果展示

由于素材是单色调的，所有整个窗体就显得很单调。
加载时的特效是随机生成的。炸弹个数限制为40个。
请添加图片描述

预处理

开发环境:Qt Creator 5.13.1,MinGW 64X
使用 C++类 处理数据 ,使用 QML显示界面
要在QML中使用C++类 ，类必须继承QObject对象，使用QT元对象

C++ 类生成数据

定义 元对象宏定义

声明元对象的通用模版，主要用于可供QML读取和修改C++类中变量声明

#define Attribute_INIT(__type__,__Attr__) \Q_INVOKABLE __type__ get_##__Attr__() const {return this->__Attr__; qDebug()<<"get!";} \Q_INVOKABLE void set_##__Attr__(__type__ _##__Attr__)  { this->__Attr__=_##__Attr__; emit __Attr__##_Changed(_##__Attr__);}#define PROPERTY_INIT(__type__,__Attr__) \Q_PROPERTY(__type__ __Attr__ READ get_##__Attr__ WRITE set_##__Attr__( NOTIFY __Attr__##_Changed))#define Signals_INIT(__type__,__Attr__) \void __Attr__##_Changed(__type__);
定义 C++类

定义一个C++操作类 Operate_Connector，用来保存炸弹数量，地图宽带，地图高度，炸弹二维矩阵等参数。
Operate_Connector头文件

///操作类
class Operate_Connector:public QObject
{Q_OBJECTPROPERTY_INIT(int,Bomb_Count)PROPERTY_INIT(int,Plat_Rows)PROPERTY_INIT(int,Plat_Cols)PROPERTY_INIT(int,animType)Q_PROPERTY(QVector<QVector<int>> MapBomb MEMBER MapBomb)public:///必须实现QObject(parent) 否则无法设置idQ_INVOKABLE Operate_Connector(QObject *parent = nullptr);//    Q_INVOKABLE int GetBombCount()  {return this->Bomb_Count;}//    Q_INVOKABLE int SetBombCount(int _count)  {this->Bomb_Count=_count;}Attribute_INIT(int,Bomb_Count)Attribute_INIT(int,Plat_Rows)Attribute_INIT(int,Plat_Cols)Attribute_INIT(int,animType)///生成一个 int类型 二维矩阵Q_INVOKABLE void reconstruction();///是否按住炸弹Q_INVOKABLE int is_Bomb(int index);//加载时的动画特效enum animEffects{//随机random=0,//从左到右leftToright=1,//从中心向左右散开centerToSide=2,//从中心向左右散开centerToSpread=3};//Roster枚举类型注册Q_ENUM(animEffects);private:///炸弹数量int Bomb_Count ;///地图宽带int Plat_Rows;///地图高度int Plat_Cols;///加载时的动画特效int animType;///二维矩阵/// -1 炸弹/// 0 空白/// 1-8 九格之内炸弹数量QVector<QVector<int>> MapBomb;/// 初始化全为 -1/// 当统计-1 个数等于炸弹个数时 胜利QVector<int> VectBomb;///列排序基准点static int datum_mark;/// 列排序/// 适用于中心散开特效static bool sortType(QPair<int,int> a1,QPair<int,int> a2);///查找空白项void findblank(QPair<int,int> item, QList<QPair<int,int>> &blankitems);///验证炸弹数量void verify_bomb();
public://!信号
signals:Signals_INIT(int,Bomb_Count);Signals_INIT(int,Plat_Rows);Signals_INIT(int,Plat_Cols);Signals_INIT(int,animType);//!显示牌Q_INVOKABLE void blank_clearing(int index,int board,int duration) const;//!游戏胜利void gameWin();//!游戏失败void gameFailure();
};
生成一个二维矩阵

初始化二维矩阵QVector<QVector<int>> MapBomb;数据
使用 #include <QRandomGenerator>生成随机数
并随机插入指定Bomb_Count个数的炸弹，
再循环统计每个单元格9格范围内的炸弹数量

void Operate_Connector::reconstruction()
{if(Bomb_Count==0||Plat_Rows==0||Plat_Cols==0)return;datum_mark=ceil(Plat_Cols/2);MapBomb=QVector<QVector<int>>(Plat_Rows, QVector<int>(Plat_Cols, 0));VectBomb=QVector<int>(Plat_Cols*Plat_Rows, -1);//加载特效animType= QRandomGenerator::global()->bounded(4);//随机插入炸弹for(int B=0;B<Bomb_Count;B++){do{// 生成一个介于0（包含）和行数/列数（不包含）之间的随机整数int r_row = QRandomGenerator::global()->bounded(Plat_Rows);int r_col = QRandomGenerator::global()->bounded(Plat_Cols);if(MapBomb[r_row][r_col]!=-1){MapBomb[r_row][r_col]=-1;break;}}while (true);}//统计当前项3*3矩形范围内的炸弹个数for(int r=0;r<Plat_Rows;r++){for(int c=0;c<Plat_Cols;c++){//炸弹不统计if(MapBomb[r][c]==-1)continue;int number=0;//左上if((r-1<Plat_Rows && r-1 >=0 ) &&(c-1<Plat_Cols && c-1 >=0 )){if(MapBomb[r-1][c-1]==-1)number++;}//上if((r-1<Plat_Rows && r-1 >=0 ) &&(c<Plat_Cols && c >=0 )){if(MapBomb[r-1][c]==-1)number++;}//右上if((r-1<Plat_Rows && r-1 >=0 ) &&(c+1<Plat_Cols && c+1 >=0 )){if(MapBomb[r-1][c+1]==-1)number++;}//右if((r<Plat_Rows && r >=0 ) &&(c+1<Plat_Cols && c+1 >=0 )){if(MapBomb[r][c+1]==-1)number++;}//右下if((r+1<Plat_Rows && r+1 >=0 ) &&(c+1<Plat_Cols && c+1 >=0 )){if(MapBomb[r+1][c+1]==-1)number++;}//下if((r+1<Plat_Rows && r+1 >=0 ) &&(c<Plat_Cols && c >=0 )){if(MapBomb[r+1][c]==-1)number++;}//左下if((r+1<Plat_Rows && r+1 >=0 ) &&(c-1<Plat_Cols && c-1 >=0 )){if(MapBomb[r+1][c-1]==-1)number++;}//左if((r<Plat_Rows && r >=0 ) &&(c-1<Plat_Cols && c-1 >=0 )){if(MapBomb[r][c-1]==-1)number++;}MapBomb[r][c]=number;}}
}
点击判断点击的是不是炸弹

判断点击索引处是炸弹还是空白还是概率值
如果是空白则展开所有空白项，如果是概率就翻转自己。
炸弹游戏结束

void Operate_Connector::findblank(QPair<int,int> item, QList<QPair<int,int>> &blankitems)
{int r=item.first;int c=item.second;//左上if((r-1<Plat_Rows && r-1 >=0 ) &&(c-1<Plat_Cols && c-1 >=0 ) &&MapBomb[r-1][c-1]!=-1){if(!blankitems.contains(QPair<int,int>(r-1,c-1))){blankitems.append(QPair<int,int>(r-1,c-1));if(MapBomb[r-1][c-1]==0)findblank(QPair<int,int>(r-1,c-1),blankitems);}}//上if((r-1<Plat_Rows && r-1 >=0 ) &&(c<Plat_Cols && c >=0 ) &&MapBomb[r-1][c]!=-1){if(!blankitems.contains(QPair<int,int>(r-1,c))){blankitems.append(QPair<int,int>(r-1,c));if(MapBomb[r-1][c]==0)findblank(QPair<int,int>(r-1,c),blankitems);}}//右上if((r-1<Plat_Rows && r-1 >=0 ) &&(c+1<Plat_Cols && c+1 >=0 ) &&MapBomb[r-1][c+1]!=-1){if(!blankitems.contains(QPair<int,int>(r-1,c+1))){blankitems.append(QPair<int,int>(r-1,c+1));if(MapBomb[r-1][c+1]==0)findblank(QPair<int,int>(r-1,c+1),blankitems);}}//右if((r<Plat_Rows && r >=0 ) &&(c+1<Plat_Cols && c+1 >=0 &&MapBomb[r][c+1]!=-1)){if(!blankitems.contains(QPair<int,int>(r,c+1))){blankitems.append(QPair<int,int>(r,c+1));if(MapBomb[r][c+1]==0)findblank(QPair<int,int>(r,c+1),blankitems);}}//右下if((r+1<Plat_Rows && r+1 >=0 ) &&(c+1<Plat_Cols && c+1 >=0 &&MapBomb[r+1][c+1]!=-1)){if(!blankitems.contains(QPair<int,int>(r+1,c+1))){blankitems.append(QPair<int,int>(r+1,c+1));if(MapBomb[r+1][c+1]==0)findblank(QPair<int,int>(r+1,c+1),blankitems);}}//下if((r+1<Plat_Rows && r+1 >=0 ) &&(c<Plat_Cols && c >=0 ) &&MapBomb[r+1][c]!=-1){if(!blankitems.contains(QPair<int,int>(r+1,c))){blankitems.append(QPair<int,int>(r+1,c));if(MapBomb[r+1][c]==0)findblank(QPair<int,int>(r+1,c),blankitems);}}//左下if((r+1<Plat_Rows && r+1 >=0 ) &&(c-1<Plat_Cols && c-1 >=0 ) &&MapBomb[r+1][c-1]!=-1){if(!blankitems.contains(QPair<int,int>(r+1,c-1))){blankitems.append(QPair<int,int>(r+1,c-1));if(MapBomb[r+1][c-1]==0)findblank(QPair<int,int>(r+1,c-1),blankitems);}}//左if((r<Plat_Rows && r >=0 ) &&(c-1<Plat_Cols && c-1 >=0 ) &&MapBomb[r][c-1]!=-1){if(!blankitems.contains(QPair<int,int>(r,c-1))){blankitems.append(QPair<int,int>(r,c-1));if(MapBomb[r][c-1]==0)findblank(QPair<int,int>(r,c-1),blankitems);}}}bool Operate_Connector::sortType(QPair<int,int> a1,QPair<int,int> a2)
{return abs(datum_mark-a1.second)>abs(datum_mark-a2.second);
}//验证是否已经打开了所有项
void Operate_Connector::verify_bomb()
{int _BombCount=0;for(int i=0;i<VectBomb.count();i++){if(VectBomb[i]==-1)_BombCount++;}if(_BombCount==Bomb_Count)emit gameWin();
}#include <QPair>
int Operate_Connector::is_Bomb(int index)
{//QML的ceil与Qt的Ceil不一样int row= ceil(index/Plat_Rows);int col=index-row*Plat_Cols;if(row>=Plat_Rows || col>=Plat_Cols)return -1;//默认中心散开特效 centerSpreadQList<QPair<int,int>> blankitems;if(MapBomb[row][col]==-1)goto gameFailure;blankitems.append(QPair<int,int>(row,col));if(MapBomb[row][col]==0){datum_mark=col;//先找到空白附件的所有空白项findblank(QPair<int,int>(row,col), blankitems);//按照列间隔排序 可以不用排序qSort(blankitems.begin(),blankitems.end(),sortType);}//计算时长for(int s=0;s<blankitems.count();s++){int index=blankitems[s].first*Plat_Rows+blankitems[s].second;int board=MapBomb[blankitems[s].first][blankitems[s].second];VectBomb[index]=board;int duration=ceil(((double)abs(blankitems[s].second-col)/Plat_Cols)*1000)+200;emit blank_clearing(index,board,duration);}verify_bomb();//    qDebug()<<"[Row] : "<<row<<" [Col] : "<<col;//    emit blank_clearing(index,MapBomb[row][col],200);return MapBomb[row][col];gameFailure://按住炸弹 全展开for(int r=0;r<Plat_Rows;r++){for(int c=0;c<Plat_Cols;c++){blankitems.append(QPair<int,int>(r,c));}}qSort(blankitems.begin(),blankitems.end(),sortType);//计算时长for(int s=0;s<blankitems.count();s++){int index=blankitems[s].first*Plat_Rows+blankitems[s].second;int board=MapBomb[blankitems[s].first][blankitems[s].second];VectBomb[index]=board;int duration=ceil(((double)abs(blankitems[s].second-col)/Plat_Cols)*1000)+200;qDebug()<<duration;emit blank_clearing(index,board,duration);}emit gameFailure();return MapBomb[row][col];}

C++类中主要涉及到元对象的使用：
Q_INVOKABLE 用于注册方法，
Q_PROPERTY 用于注册变量
Q_ENUM 用于注册枚举
同时需要再main文件中注册实例
qmlRegisterType<Operate_Connector>("DAL_Connector", 1, 0, "Operate_Connector");
这样就能在QML文件中内直接调用C++类
主要信号和槽函数前面可以不加Q_INVOKABLE，也能识别

值得注意的是：

  1. 在QML文件中使用 Connections 链接C++类信号时
    必须on+首字母大写函数名,括号内可直接使用信号参数
    如上例
    Connections
    {
    onBlank_clearing: {
    // console.log("index : ",index) // 当C++信号被发射时，这里将被调用
    // console.log("board : ",board)
    // console.log("duration : ",duration)
    }
    onGameWin: { }
    onGameFailure:{ }
    }

2.C++中 ceil(向下取整) 可以取到0,0为整数
而QML中Math.ceil(向下取整)只取值到1,0不为整数

这篇关于QML小案例 使用QML简单实现翻牌版扫雷游戏（一）的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！


http://www.chinasem.cn/article/737912。

相关文章

如何使用celery进行异步处理和定时任务(django)

如何使用celery进行异步处理和定时任务(django)

《如何使用celery进行异步处理和定时任务(django)》文章介绍了Celery的基本概念、安装方法、如何使用Celery进行异步任务处理以及如何设置定时任务,通过Celery,可以在Web应用中... 目录一、celery的作用二、安装celery三、使用celery 异步执行任务四、使用celery
阅读更多...
使用Python绘制蛇年春节祝福艺术图

使用Python绘制蛇年春节祝福艺术图

《使用Python绘制蛇年春节祝福艺术图》：本文主要介绍如何使用Python的Matplotlib库绘制一幅富有创意的“蛇年有福”艺术图,这幅图结合了数字,蛇形,花朵等装饰,需要的可以参考下... 目录1. 绘图的基本概念2. 准备工作3. 实现代码解析3.1 设置绘图画布3.2 绘制数字“2025”3.3
阅读更多...
Jsoncpp的安装与使用方式

Jsoncpp的安装与使用方式

《Jsoncpp的安装与使用方式》JsonCpp是一个用于解析和生成JSON数据的C++库,它支持解析JSON文件或字符串到C++对象,以及将C++对象序列化回JSON格式,安装JsonCpp可以通过... 目录安装jsoncppJsoncpp的使用Value类构造函数检测保存的数据类型提取数据对json数
阅读更多...
python使用watchdog实现文件资源监控

python使用watchdog实现文件资源监控

《python使用watchdog实现文件资源监控》watchdog支持跨平台文件资源监控,可以检测指定文件夹下文件及文件夹变动,下面我们来看看Python如何使用watchdog实现文件资源监控吧... python文件监控库watchdogs简介随着Python在各种应用领域中的广泛使用，其生态环境也
阅读更多...
el-select下拉选择缓存的实现

el-select下拉选择缓存的实现

《el-select下拉选择缓存的实现》本文主要介绍了在使用el-select实现下拉选择缓存时遇到的问题及解决方案,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的... 目录项目场景：问题描述解决方案：项目场景：从左侧列表中选取字段填入右侧下拉多选框，用户可以对右侧
阅读更多...
Python中构建终端应用界面利器Blessed模块的使用

Python中构建终端应用界面利器Blessed模块的使用

《Python中构建终端应用界面利器Blessed模块的使用》Blessed库作为一个轻量级且功能强大的解决方案,开始在开发者中赢得口碑,今天,我们就一起来探索一下它是如何让终端UI开发变得轻松而高... 目录一、安装与配置：简单、快速、无障碍二、基本功能：从彩色文本到动态交互1. 显示基本内容2. 创建链
阅读更多...
基于Qt开发一个简单的OFD阅读器

基于Qt开发一个简单的OFD阅读器

《基于Qt开发一个简单的OFD阅读器》这篇文章主要为大家详细介绍了如何使用Qt框架开发一个功能强大且性能优异的OFD阅读器,文中的示例代码讲解详细,有需要的小伙伴可以参考一下... 目录摘要引言一、OFD文件格式解析二、文档结构解析三、页面渲染四、用户交互五、性能优化六、示例代码七、未来发展方向八、结论摘要
阅读更多...
springboot整合 xxl-job及使用步骤

springboot整合 xxl-job及使用步骤

《springboot整合xxl-job及使用步骤》XXL-JOB是一个分布式任务调度平台,用于解决分布式系统中的任务调度和管理问题,文章详细介绍了XXL-JOB的架构,包括调度中心、执行器和Web... 目录一、xxl-job是什么二、使用步骤1. 下载并运行管理端代码2. 访问管理页面，确认是否启动成功
阅读更多...
使用Nginx来共享文件的详细教程

使用Nginx来共享文件的详细教程

《使用Nginx来共享文件的详细教程》有时我们想共享电脑上的某些文件,一个比较方便的做法是,开一个HTTP服务,指向文件所在的目录,这次我们用nginx来实现这个需求,本文将通过代码示例一步步教你使用... 在本教程中，我们将向您展示如何使用开源 Web 服务器 Nginx 设置文件共享服务器步骤 0 —
阅读更多...
Java中switch-case结构的使用方法举例详解

Java中switch-case结构的使用方法举例详解

《Java中switch-case结构的使用方法举例详解》：本文主要介绍Java中switch-case结构使用的相关资料,switch-case结构是Java中处理多个分支条件的一种有效方式,它... 目录前言一、switch-case结构的基本语法二、使用示例三、注意事项四、总结前言对于Java初学者
阅读更多...

Copyright China编程 23002807@qq.com

沪ICP备2023033072号-2