900字范文,内容丰富有趣,生活中的好帮手!
900字范文 > 图形化界面扫雷(C语言+easyx实现 多图教学)

图形化界面扫雷(C语言+easyx实现 多图教学)

时间:2020-04-21 04:01:56

相关推荐

图形化界面扫雷(C语言+easyx实现 多图教学)

扫雷

前言准备工作EasyX的下载一些准备知识头文件的引用图形化界面的创建图形化界面简介图片加载与放置图片鼠标操作提示框其它的准备知识思路分析代码实现准备工作初始化游戏的函数在界面上放置图片的函数执行鼠标操作的函数打开关闭格子的函数判断游戏是否已经结束的函数执行游戏的函数主函数完整代码程序的缺陷发给同学玩(装逼)时的缺陷游戏结束时的缺陷游戏进行中的缺陷写在最后

前言

学了那么长时间的C语言,我们所有的一切似乎都被禁锢在黑框框(控制台)里,让人觉得很无趣,学习unity那样的平台又太过困难,那么有没有什么是适合我们这些新手使用的?答案是:有!

EasyX 是针对 C/C++ 的图形库,可以帮助使用C/C++语言的程序员快速上手图形和游戏编程。

这是百度百科上的解释,目前就我的理解,下载并安装Easyx就相当于为我们的VS(或者是别的)增加了一些库函数,以便我们实现图形化界面。那这里我会带大家实现图形化界面的扫雷,实现后的效果大概是这样的:

当然,本人水平有限,最后实现的功能也较少,还有些地方有小的问题不会解决,希望大佬们有想法的话多多和我交流,有问题也希望大佬指正!此程序的问题和不足我会放到文章最后

准备工作

EasyX的下载

EasyX官网

下载是非常简单的,因为它只是相当于为我们的VS增加了一些库函数

找到EasyX官网,点击下载EasyX

下载完成后,找到下载的位置,点击打开

点击下一步

它会自动检测我们使用的开发平台,我们安装对应的库就可以了,以后不想用了就直接点击卸载就可以了。另外,帮助文档也推荐大家安装一下吧,一般遇到什么问题都可以在那查。

这样我们EasyX的安装就完成了,是不是非常简单呢!

一些准备知识

注意:这里不要问原理,只需知道作用就好了,不然会学不下去的!我们只需要知道怎么用!

头文件的引用

EasyX的安装为我们提供了一些库函数,我们只需要引用一个头文件就可以使用那些函数了。

#include<graphics.h>

图形化界面的创建

我们要实现图形化界面,这要使用一个库函数

initgraph(400,400,0);/*这个函数有三个参数第一个参数是界面水平方向的大小第二个参数是界面竖直方向的大小第三个参数我们可以有几种选择:1:设为02:设为SHOWCONSOLE作者只了解这两种,可能还有别的,不过做扫雷够了*/

下面我们来测试一下:

我的天!怎么一下子这么多错误,别着急,我们发现:

原来EasyX只能给C++文件用!

那我们就把文件后缀改为cpp再测试

运行成功了,可是界面呢?其实,仔细观察,程序运行后有个界面一闪而过了,那个就是我们的图形化界面,我们怎么让他停下来呢?

其实,界面一闪而过是因为整个程序结束后,我们的界面也就结束了

那我们就加个死循环,让程序无法结束,就能看到界面了。

图中的closegraph()函数是用来关闭界面的。(以后这个图形化界面我们就叫做界面),由于程序无法执行到那一步,所以界面未关闭。

仔细管察,我们会发现,控制台不见了!

其实这是initgraph()函数的功能第三个参数设为0或NULL时,我们的控制台会被关闭实际上程序运行后控制台仍会存在一段时间,因为函数的执行需要一定时间

那我们能不能选择保留界面呢,答案是可以,我们把initgraph()函数的第三个参数修改为SHOWCONSOLE(全部大写)就可以了:

注意:关掉控制台或者界面都会关掉整个程序,即如果关掉控制台,界面也会被关闭,如果关掉界面,控制台也会被关闭

图形化界面简介

有同学会问了,这不是图形化界面吗,怎么tm全黑啊,你什么也不干,它怎么知道你要什么!在后面我们可以在这个界面中插入图片,那插入的位置怎么确定呢?通过坐标!

该界面对应的坐标轴是这样的,而我们又知道界面的大小(宽度,高度),我们就可以在指定的位置插入图片了。这里我们先不讲解,在扫雷中用到的时候我再告诉大家具体怎么插入图片。

图片加载与放置图片

引用<graphics.h>头文件后,我们就可以使用图片的数组或变量来存放图片(还是那就话,知道怎样用就好,不用知道原理!),下面我们就来测试一下:

图片素材及其位置如下:

因为后面我们在加载图片时需要知道图片的储存位置,我们最好把图片放在我们的CPP文件的同一路径下,实现效果如下:

你失败了?别急,往下看

我们首先创建了一个图片数组,如果只有一张图片的话,我们可以直接用

IMAGE img;

来创建一个图片变量,img为变量名,是可以自由起名字的(不要与关键字重名

如果图片较多,我们可以用图中方式创建图片数组,[ ]中的数字为数组大小,使用时下标从0开始。

loadimage()函数的功能是加载图片,也就是“告诉”程序我们有这个图片,我们可以理解为“此函数将图片的位置存入了变量中”,第一个参数为变量的地址,第二个变量是图片的地址,其中“./”表示与我们当前编辑的文件(cpp文件)同一目录下的文件路径(也可以省略,因为在同一路径下,可以直接写为"1.png"),如果这些基础知识还不知道的话推荐一篇博客:路径的表示与含义

putimage()函数的功能即为放置图片,第一个参数是图片开始位置的X坐标,第二个参数是Y坐标,第三个参数是变量的地址

有的同学会发现自己的VS在loadimage()函数那报错了,你可以理解为该函数需要的字符集与VS默认的不同,不懂也没关系,直接修改VS的一个设置就好了:

提示:这里只是修改了这个项目的字符集,后面创建的字符集还会是默认的“Unicode”,不会影响我们以后创建的项目的使用。

但是我们图片太大了,界面太小了,加载不完,这不太好看,其实我们可以loadimage()函数后面再加两个参数,修改载入图片的大小:

你可能会问:函数的参数个数不是只能是确定的吗,怎么你既可以用两个参数,又可以用四个参数,其实这涉及到函数的重载,就是说库中会有多个名为loadimage()的函数,这些函数的参数类型、个数不太相同,程序会根据我们使用的参数帮我们调用对应的函数。

鼠标操作

MouseHit()函数,无参数,返回值为bool型,判断有无鼠标信息,如果有则返回true,没有则返回false,可以理解为有则返回1,否则返回0,鼠标信息包括的内容很多:

MOUSEMSG结构体,以下是头文件中它的定义,是不是看的很懵,等会下面会有解释

GetMouseMsg()函数,无参数,返回类型为结构体类型,很懵?先继续

我们写一个这样的代码片段:

while(1)/*为防止程序执行过快以致我们还没来得及操控鼠标它就判断我们没有鼠标信息,定义一个死循环*/{if (MouseHit())//判断有没有鼠标消息,有的话进入循环{/*我们定义一个结构体变量来接收此函数的返回值也就是说msg会接收所有上图中的信息,如x,y,wheel等*/MOUSEMSG msg = GetMouseMsg();int r = msg.y / size;/*通过msg.y我们就可以使用前面得到的鼠标信息中鼠标所在位置的Y坐标msg.x同理*/int c = msg.x / size;switch (msg.uMsg)/*msg.uMSG代表我们获取的鼠标信息,上面有对鼠标信息的介绍各鼠标信息对应的值会在下面介绍*/{//看懂这里不懂了?往下看case WM_LBUTTONDOWN:break;case WM_RBUTTONDOWN:break;}break;//跳出循环}}

这是头文件中的说明:

看到这,我们明白了,它可能是这样实现的:

这些鼠标信息对应的都有整数值,msg.uMsg得到的也是这些信息对应的值,因此我们可以用switch语句对情况分类。

作个假设:

WM_LBUTTONDOWN代表左击,他的值假如为1,当我们左击时,msg.uMsg就是1

到这里,我们就明白该怎样使用这些东西了,暂时不要深究原理

提示框

这个看得我更蒙蔽,直接看下怎么使用就好了

int main(){initgraph(400,400,SHOWCONSOLE);loadimage(&img, "1.png",100,100);putimage(100, 100,&img);MessageBox(GetHWnd(), "You win! Do you want to play again?", "notice", MB_OKCANCEL);while (1) {;}closegraph();return 0;}

效果:

这里我们点确定或取消都没有任何效果,那他有什么用呢,其实它有一个int型返回值,当我们点确定时它会返回1,否则返回其它值,这样我们用一个变量接受返回值,就能通过if或switch语句执行不同的选择了

这个函数是不是看得你很懵逼?我也是,我们只要知道这个函数的第二个参数是提示内容,第三个参数是提示标题就可以了,其它内容只要照着格式写就可以了。

另外,判断时我们一般这样用:

int isok = MessageBox(GetHWnd(), "You win! Do you want to play again?", "notice", MB_OKCANCEL);if (isok == IDOK){game();}else{exit(666);}

其中IDOK就是1,exit()函数就是退出程序,666就是退出的代码,这个函数一般用于判断程序在哪里退出

这是头文件里的定义:

这是exit()函数执行的效果,这个程序执行完exit(666);后就退出了

其它的准备知识

这里需要的是一些其它知识,如果这些内容不会的话我会推荐相应的博客

srand()函数和rand()函数的使用:

srand()函数和rand()函数的使用黑框框版扫雷能看懂

扫雷

思路分析

和黑框框里的扫雷一样,我们首先创建数组表示整个棋盘(这么说好像有点不对?),并随机放置一定个数的雷,为了方便后期修改我们用宏来定义行、列、雷数我们想实现图形化界面,那我们就需要相应的扫雷中的图片,这里我分享一下:

链接:/s/1JBz0Pq0R5zvuS7l92qJi5Q

提取码:nh5f

文件夹里是这样的:

我们用函数实现图片的放置,数组的每个要使用的元素放置一张图片

因为我们创建的数组会有额外的两行两列来防止越界,那些元素我们不使用。可是这都是静态图片啊,我们怎么能实现鼠标点击后的转化呢,我们知道,在黑框框里我们用-1表示雷,数字表示该非雷位置九宫格内雷的个数,我们这里还在数组中存数字,根据数字的不同我们放置不同的图片,再利用鼠标操作得到鼠标操作的位置,转化为数组的下标,修改对应元素的值,就可以改变该位置的图片了,因此我们需要经常调用放置图片的函数以完成修改,你已经看懵了?没问题,下面使用的时候更容易懂我们用gamedraw()函数绘制棋盘,当数组元素为-1时,我们在这里放置雷的图片(9.jpg),为0时我们放置空的那张(0.jpg,我们称为空格),为1~8时我们放置相应的图片(1-8.jpg),但是我们该开始展示的应该全部是10.jpg(我们称为关闭的格子)那张图片,我们给所有元素加上20,那么这些元素的值都在19-28之间,当元素的值在此范围内时,我们放置10.jpg,当我们鼠标左键点击相应位置时,我们让此位置对应的数组元素的值减去20,这样它的值就在-1到8之间了,它就会显示打开后的图片,标记也是同理,当我们右键点击的位置是关闭的格子时,我们把它对应的元素值再加上20,这样我们把大于30的元素换为11.jpg,即标记的格子,同时,如果我们右键点击位置元素的值大于30,我们让它减少20,这样它又变回关闭的格子了

小总结:

这样我们就可以实现图片的转换了

代码实现

在这次演示中,我把所有的东西都放在一个.cpp文件中了,还是推荐大家分三个文件去放置,不过那样的话函数需要传参,感觉挺麻烦的,在一个文件中我们定义几个全局变量,就不用老是传参了,也可以分多个文件并在一个文件中定义全局变量,在别的文件中声明这些全局变量

准备工作

#define _CRT_SECURE_NO_WARNINGS 1#include<graphics.h>//产生随机数需要用的头文件:#include<Windows.h>#include<time.h>#include<stdio.h>#pragma warning(disable : 4996)/*因为我们使用的部分函数是已经被弃用的使用上面这句命令后,即使被弃用的函数我们也能使用其实这些被弃用的函数已经有新函数替代了我为什么不用?我不会!*/#define ROW 10//行数#define COL 10//列数#define MINE 10//雷数#define PIC_SIZE 40//图片大小,程序中我们把图片加载为正方形,宽、高相同,因此只需一个大小int map[ROW + 2][COL + 2];//数组,存放数据int i, j, flag;//flag代表我们已经打开的格子数,后面用来判断输赢//因为我们会用到多次遍历数组,我直接创建两个全局变量i,j//后面在每个函数中使用时就不用再创建了IMAGE img[12];//存放我们需要的12个图片/*下面两个函数因为我定义的比较晚而使用的比较早,就在前面声明一下,防止报错*/void open(int r, int c);void game();

提示:

我有一次用宏定义图片大小的名字为大写的SIZE,结果一堆错误,后来发现只是重名了,用个别的名字就可以了

初始化游戏的函数

void gameinit(){flag = 0;//打开的格子数置为0for (i = 1; i <= ROW; i++){for (j = 1; j <= COL; j++){map[i][j] = 0;}}for (i = 0; i < MINE; )//随机放10个雷并确保没有多个雷放在一个重复的位置{int r = rand() % ROW+1;int c = rand() % COL+1;if (map[r][c] == 0){map[r][c] = -1;i++;}}//初始化数组的值,雷九宫格内的非雷元素加一for (i = 1; i <= ROW; i++){for (j = 1; j <= COL; j++){if (map[i][j] == -1){for (int m = i - 1; m <= i + 1; m++){for (int n = j - 1; n <= j + 1; n++){if (map[m][n] != -1){map[m][n]++;}}}}}}//把数组的值都加上20,放图片时就会是关闭的格子了for (int i = 1; i <= ROW; i++){for (int j = 1; j <= COL; j++){map[i][j] += 20;}}char tmp[20] = {0 };//加载图片for (i = 0; i < 12;i++){sprintf(tmp, "./image/%d.jpg",i);loadimage(&img[i], tmp, PIC_SIZE, PIC_SIZE);}}

推荐一篇介绍sprintf函数的博客:sprintf()函数的用法

在界面上放置图片的函数

void gamedraw(){for ( i = 1; i <= ROW; i++){for ( j = 1; j <= COL; j++){//下面放置图片的坐标为什么是这样呢?结合坐标轴就能明白了if (map[i][j] == -1){putimage((j - 1) * PIC_SIZE, (i - 1) * PIC_SIZE, &img[9]);//雷}else if (map[i][j] >= 0 && map[i][j] <= 8){putimage((j - 1) * PIC_SIZE, (i - 1) * PIC_SIZE, &img[map[i][j]]);//0-8的数字}else if (map[i][j] >= 19 && map[i][j] <= 28){putimage((j - 1) * PIC_SIZE, (i - 1) * PIC_SIZE, &img[10]);//空白}else if (map[i][j] > 30){putimage((j - 1) * PIC_SIZE, (i - 1) * PIC_SIZE, &img[11]);//标记图片}}}}

举个例子吧,假如map[4] [5]位置值为28,那我们应该放置关闭的格子:

执行鼠标操作的函数

int mouse(){if (MouseHit())//判断有没有鼠标消息{MOUSEMSG msg = GetMouseMsg();//获取当前鼠标信息//找到对应数组的下标int r = msg.y / PIC_SIZE + 1;int c = msg.x / PIC_SIZE + 1;switch (msg.uMsg)//根据鼠标消息执行不同操作{case WM_LBUTTONDOWN://左击if (map[r][c] > 8&&map[r][c]<29)//打开关闭的格子{map[r][c] -= 20;flag++;//打开格子数加一open(r, c);}break;case WM_RBUTTONDOWN://右击if (map[r][c] > 8 && map[r][c] < 29)//标记关闭的格子{map[r][c] += 20;}else if(map[r][c] > 30)//取消标记{map[r][c] -= 20;}break;}return map[r][c];//返回打开位置后该位置的值//如果为-1则游戏结束}}

打开关闭格子的函数

void open(int r,int c)//打开空格周围未被标记且不是雷的格子{if (map[r][c] == 0){for (int m = r - 1; m <= r + 1; m++){for (int n = c - 1; n <= c + 1; n++){if (map[m][n]!=19&&map[m][n]>8){map[m][n]-=20;flag++;//打开周围的格子,格子数也要加一open(m, n);//递归打开(空格周围的空格)周围的格子//括号内为主语}}}}}

判断游戏是否已经结束的函数

void judge(){gamedraw();//放置图片if (mouse() == -1)//执行mouse()函数,返回-1则游戏结束,弹出提示框{gamedraw();//放置图片int isok = MessageBox(GetHWnd(), "You lose! Do you want to play again?", "notice", MB_OKCANCEL);if (isok == IDOK){game();//再次进入游戏}else{exit(666);//退出程序}}if (flag == ROW * COL - MINE)//判断游戏是否结束,即格子全部打开//只需判断总格子数-雷数==当前打开格子数即可{gamedraw();//放置图片int isok = MessageBox(GetHWnd(), "You win! Do you want to play again?", "notice", MB_OKCANCEL);if (isok == IDOK){game();//再次进入游戏}else{exit(666);//退出程序}}}

执行游戏的函数

void game(){gameinit();//初始化游戏while (1){judge();//进入判断函数}}

主函数

int main(){srand((unsigned)time(NULL));//设置随机数种子initgraph(ROW* PIC_SIZE,COL* PIC_SIZE,NULL);//初始化界面,宽度为列数乘以图片大小,高度为行数乘以图片大小//关闭控制台/*刚开始写时我们可以保留控制台,并写一个打印数组的函数来判断我们程序的正确性*/game();//进入game()函数closegraph();//关掉界面return 0;}

完整代码

#define _CRT_SECURE_NO_WARNINGS 1#include<graphics.h>#include<Windows.h>#include<stdio.h>#include<time.h>#pragma warning(disable : 4996) #define ROW 10#define COL 10#define MINE 10#define PIC_SIZE 40int map[ROW + 2][COL + 2];int i, j, flag;IMAGE img[12];void open(int r, int c);void game();void gameinit(){flag = 0;srand((unsigned)time(NULL));for (i = 1; i <= ROW; i++){for (j = 1; j <= COL; j++){map[i][j] = 0;}}for (i = 0; i < MINE; ){int r = rand() % ROW+1;int c = rand() % COL+1;if (map[r][c] == 0){map[r][c] = -1;i++;}}for (i = 1; i <= ROW; i++){for (j = 1; j <= COL; j++){if (map[i][j] == -1){for (int m = i - 1; m <= i + 1; m++){for (int n = j - 1; n <= j + 1; n++){if (map[m][n] != -1){map[m][n]++;}}}}}}for (int i = 1; i <= ROW; i++){for (int j = 1; j <= COL; j++){map[i][j] += 20;}}char tmp[20] = {0 };for (i = 0; i < 12;i++){sprintf(tmp, "./image/%d.jpg",i);loadimage(&img[i], tmp, PIC_SIZE, PIC_SIZE);}}void gamedraw(){for ( i = 1; i <= ROW; i++){for ( j = 1; j <= COL; j++){if (map[i][j] == -1){putimage((j - 1) * PIC_SIZE, (i - 1) * PIC_SIZE, &img[9]);}else if (map[i][j] >= 0 && map[i][j] <= 8){putimage((j - 1) * PIC_SIZE, (i - 1) * PIC_SIZE, &img[map[i][j]]);}else if (map[i][j] >= 19 && map[i][j] <= 28){putimage((j - 1) * PIC_SIZE, (i - 1) * PIC_SIZE, &img[10]);}else if (map[i][j] > 30){putimage((j - 1) * PIC_SIZE, (i - 1) * PIC_SIZE, &img[11]);}}}}int mouse(){if (MouseHit()){MOUSEMSG msg = GetMouseMsg();int r = msg.y / PIC_SIZE + 1;int c = msg.x / PIC_SIZE + 1;switch (msg.uMsg){case WM_LBUTTONDOWN:if (map[r][c] > 8&&map[r][c]<29){map[r][c] -= 20;flag++;open(r, c);}break;case WM_RBUTTONDOWN:if (map[r][c] > 8 && map[r][c] < 29){map[r][c] += 20;}else if(map[r][c] > 30){map[r][c] -= 20;}break;}return map[r][c];}}void open(int r,int c){if (map[r][c] == 0){for (int m = r - 1; m <= r + 1; m++){for (int n = c - 1; n <= c + 1; n++){if (map[m][n]!=19&&map[m][n]>8){map[m][n]-=20;flag++;open(m, n);}}}}}void judge(){gamedraw();if (mouse() == -1){gamedraw();//放置图片int isok = MessageBox(GetHWnd(), "You lose! Do you want to play again?", "notice", MB_OKCANCEL);if (isok == IDOK){game();}else{exit(666);}}if (flag == ROW * COL - MINE){gamedraw();//放置图片int isok = MessageBox(GetHWnd(), "You win! Do you want to play again?", "notice", MB_OKCANCEL);if (isok == IDOK){game();}else{exit(666);}}}void game(){gameinit();while (1){judge();}}int main(){initgraph(ROW* PIC_SIZE,COL* PIC_SIZE,NULL);game();closegraph();return 0;}

程序的缺陷

发给同学玩(装逼)时的缺陷

一般发给别人的程序是release版,注意,切换到release后需要再修改一次字符集

切换到该版本后再运行一次程序,然后去找生成的.exe文件

找到解决方案"扫雷"并右击,选择在文件资源管理器中打开

进入release文件夹:

打开.exe文件

奇怪,怎么什么都没有?因为我们没有在这个位置放置图片,把图片文件夹和.exe文件放在同一个位置,就能正确运行了

我们要把这两个文件放在一个文件夹中发给朋友,但朋友不知道怎么玩,我们写个帮助文档readme.txt:

把这三个文件放在一个文件夹中,发给朋友,朋友就也能玩了!(装逼成功)

游戏结束时的缺陷

在游戏结束(不管是输还是赢)时,最后一个格子无法打卡,我试了好多种方法,还是没有解决。

如图,我点到了雷。游戏结束,雷却未显示

游戏进行中的缺陷

上图中暴露了另一个缺陷,没有规避第一次就点到雷的情况没有难度的选择、计时、计分功能我学习了添加音乐的方法,但没找到相关音乐,于是就未添加开始游戏和结束游戏时控制台都会一闪而过,无法让控制台不出现

写在最后

本文章是在我观看了B站视频后总结改进的,欢迎大家去B站看原视频

EasyX的使用

图形化界面扫雷

本人能力有限,实现的此程序也不太行,如有错误望指正,如果有大佬能解决我的一些问题,希望能和您交流,有问题有欢迎和我交流,这篇文章我也写了好久,就先到这里吧。

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。