C++/QT 贪吃蛇小游戏 界面设计

C++/QT 贪吃蛇小游戏 界面设计

前言：本文所写的贪吃蛇是笔者初学QT练手的小项目，做出来的界面较为粗糙。由于很久没有接触C++，程序中类封装的不是很规范。写这篇文章，权当是记录生活了，手动狗头。还有就是写的比较啰嗦，建议跳跃性阅读。文章末尾附代码文件下载链接。

概述：一张16格x16格地图，初始长度为2格，宽度为1格的Snake，地图中随机合法位置刷新食物；

游戏规则：

• 玩家使用上下左右(或者WSAD)控制Snake的前进方向；

• Snake成功吃到食物后长度加1;

• 吃到自己身体或撞到地图边界死亡；

---

设计思路

关于Size：地图为16格x16格，实际编程窗口中取：1格=30x30像素，即地图尺寸为480x480像素

关于地图：使用QT绘制组件QPainter绘制480x480的浅灰色填充矩形

定义MyWin类（继承QWidget基类），用于创建窗口以及按钮、标签、画布等子控件，包含以下变量及成员：

• MyWin()，默认构造函数
• ~Mywin()，默认析构函数
• void paintEvent(QPaintEvent*)，绘图事件重写
• void keyPressEvent(QKeyEvent* event)，键盘监听事件重写
• QTimer* timer，定时器，核心部件，可以定时发出信号，完成程序界面刷新动作
• Snake* m_snake，生成Snake类对象，即初始化一条蛇，根据对象的信息在地图中进行绘制
• QLabel*，QPushButton*等子控件，用于界面功能设计

定义Snake类，用于生成一条蛇，包含以下变量及成员：

• Vector<Vector> snake_node变量，存储Snake身体结点；例如：[[2,2],[2,3],[3,3]…]

• char direction变量，Snake当前方向，‘U’==Up，‘D’=Down，‘L’=Left，‘R’=Right

• int head_x，head_y，蛇头坐标

• int score，游戏得分，成功吃下一个食物，得分加 1

• int snake_length，蛇身长度

• moveSnake()函数，判断移动是否合法，并相应改变Snake的身体结点坐标，

• Vector mapFlag(256，1)，定义一个二维数组mapFlag，大小为16x16，与地图相对应。遍历数组，将Snake身体所处的结点标为 0，当蛇头移动至被标记为 0 的结点，即吃到自己身体，游戏结束。

  同时，将食物结点标为2，当蛇头移动至标为 2 的结点时，即吃到食物。

定义Food类，用于生成食物，包含以下变量及成员：

编写Food类，写到一半发现，Food类中变量成员太少了，单独开.h .cpp文件简直是可耻的浪费，于是干脆把变量成员都塞到Snake类里了，不建议这样写，因为不利于阅读以及后期维护(我就默默偷懒了)

• int food_x，food_y，食物坐标
• void newFood()，生成新的食物

第一步 界面设计

1. 创建顶级窗口：
   • 实例化继承于QWidget的MyWin类对象，生成一个800x600空窗口，标题设置为[贪吃蛇]
2. 往顶级窗口中添加内容：
   • 重写绘画事件paintEvent，使用QPainter控件在顶级窗口中绘制480x480的浅灰色填充矩形，起点为（80,60），地图绘制完成。
   • 调用QLabel，QPushButton等控件，设置字体，控件位置，文本内容（按钮的点击响应事件暂时放一边，先设计好外观），完成以上步骤后界面如下
     

第二步 蛇的绘制&食物的绘制

1. 蛇的绘制：

   • 蛇身体的绘制，Snake类中变量vector<vector> snake_node存储的是蛇身体结点的坐标，数组初始化为[ [0,1], [1,1] ]。绘制第一个结点[0,1]时，要清楚地图尺寸为16x16格，1格为30像素
     
     要想绘制结点[0,1]即图中绿色部分，首先需要获得绿色区域左上角的坐标，根据映射关系可以得到，左上角横坐标 = 80 + 30 * 0；纵坐标 = 60 + 30 * 1；（80，60分别是顶级窗口左上角到地图左上角的横纵距离，计算时要代入），所以绿色区域左上角的像素坐标为(80, 90)，使用以下语句即可填充此区域：

     painterSnakeBody.drawRoundedRect(80, 90, single_size, single_size, 10, 10)
     

     painterSnakeBody是绘画控件对象；drawRoundedRect是画圆角矩形函数；80，90为矩形左上角坐标；single_size为30，是每1格的像素长度；最后两个参数10表示矩形圆角的弯曲程度。

     <