手起刀落-一起来写经典的贪吃蛇游戏
回味
小时候玩的经典贪吃蛇游戏我们印象仍然深刻,谋划了几天,小时候喜欢玩的游戏,长大了终于有能力把他做出来(从来都没有通关过,不知道自己写的程序,是不是能通关了...),好了,闲话不多谈,先来看一下效果吧!!
功能和小时候玩的贪吃蛇一样,
1、选择速度 slownormalfast
2、选择是否有墙作为障碍物onoff
看完效果就先附上地址喽:大山深处修炼的小龙虾,欢迎fork.
结构分解
如果构建一个简单的经典贪吃蛇游戏呢?我们根据面板可以分解出如下结构:
因为其他面板比较简单,我们重点来看一下游戏面板
游戏面板
游戏面板是核心,在游戏面板中,我们来分解一下游戏面板我们需要的因素:
场景、snake、食物
首先我们需要一个游戏场景、snake、食物这些基础设施
这里使用canvas作为我们的整个游戏的场景:
<canvas class="wrap" id="snake" width="400" height="400" tabindex="1"></canvas>
需要一只snake,后面初始化他的位置
var activeDot = function (x, y) {ctx.fillStyle = "#eee";ctx.fillRect(x * 10, y * 10, 10, 10);
}
需要食物作为对象(关于食物我们需要定义一些规则,如食物的产生)
var food = {x: 0,y: 0
};
规则
规则是游戏的核心
1、关于游戏的规则
snake的方向控制:(使用键盘的上下左右键控制蛇的方向)
// changer dirvar changeDir = function (key) {if (key == 38 && snake_dir != 2) {snake_next_dir = 0;} else {if (key == 39 && snake_dir != 3) {snake_next_dir = 1;} else {if (key == 40 && snake_dir != 0) {snake_next_dir = 2;} else {if (key == 37 && snake_dir != 1) {snake_next_dir = 3;}}}}}
关于食物,如果食物被吃掉,我们就需要产生新的食物
// add foodvar addFood = function () {food.x = Math.floor(Math.random() * ((canvas.width / 10) - 1));food.y = Math.floor(Math.random() * ((canvas.height / 10) - 1));for (var i = 0; i < snake.length; i++) {// 如果食物被吃就增加食物if (checkBlock(food.x, food.y, snake[i].x, snake[i].y)) {addFood();}}}var checkBlock = function (x, y, _x, _y) {return (x == _x && y == _y) ? true : false;}
接下来是核心的函数,根据选择的速度和是否有墙体作为障碍物的设置,让蛇运动起来,并且实现
1、根据选择slow、norma、fast决定蛇运动速度速度
2、如果蛇碰到自己==自杀,游戏结束
3、有墙模式碰到墙体,游戏结束
4、无墙模式蛇穿过墙体,从另一侧出现
5、使蛇碰到食物就加入自身身体的一部分,执行增加食物函数
var mainLoop = function () {var _x = snake[0].x;var _y = snake[0].y;snake_dir = snake_next_dir;// 0 — up 1 — right 2 — down 3 — leftswitch (snake_dir) {case 0:_y--;break;case 1:_x++;break;case 2:_y++;break;case 3:_x--;break;}snake.pop();snake.unshift({x: _x,y: _y})// --wallif (wall == 1) {if (snake[0].x < 0 || snake[0].x == canvas.width / 10 || snake[0].y < 0 || snake[0].y == canvas.height / 10) {showScreen(3);return;}} else {// off 无墙for (var i = 0, x = snake.length; i < x; i++) {if (snake[i].x < 0) {snake[i].x = snake[i].x + (canvas.width / 10);}if (snake[i].x == canvas.width / 10) {snake[i].x = snake[i].x - (canvas.width / 10);}if (snake[i].y < 0) {snake[i].y = snake[i].y + (canvas.height / 10);}if (snake[i].y == canvas.height / 10) {snake[i].y = snake[i].y - (canvas.height / 10);}}}// Autophagy deathfor (var i = 1; i < snake.length; i++) {if (snake[0].x == snake[i].x && snake[0].y == snake[i].y) {showScreen(3);return;}}// Eat foodif (checkBlock(snake[0].x, snake[0].y, food.x, food.y)) {snake[snake.length] = {x: snake[0].x,y: snake[0].y};score += 1;altScore(score);addFood();activeDot(food.x, food.y);}// --------------------ctx.beginPath();ctx.fillStyle = "#111";ctx.fillRect(0, 0, canvas.width, canvas.height);// --------------------for (var i = 0; i < snake.length; i++) {activeDot(snake[i].x, snake[i].y);}// --------------------activeDot(food.x, food.y);setTimeout(mainLoop, snake_speed);}
ok以上展示出一些核心部分,构建出一个舞台中一只小蛇的故事.
小时候爸妈手机里有一款小游戏叫贪吃蛇。就是一条小蛇,不停地在屏幕上游走,吃各个方向出现的蛋,越吃越长。只要蛇头碰到屏幕四周,或者碰到自己的身子,小蛇就立即毙命。方寸的舞台间,亦有无限精彩;PS:到现在也没有通关过..现在不知道能不能通关了...
最后在附上次源码,欢迎fork交流:okaychen... 因为自己测试用的服务器被占用,目前只有做的效果图供大家参考喽.
掘金地址:手起刀落-一起来写经典的贪吃蛇游戏
转载于:https://www.cnblogs.com/okaychen/p/7954207.html
手起刀落-一起来写经典的贪吃蛇游戏相关推荐
- python60行绘图程序_不敢相信,60行python代码就写出了贪吃蛇游戏
通过写游戏玩编程是一个非常有趣的事,网上用Python写贪吃蛇的代码很多,大部分都用类来写的,比较复杂.今天看到一个非常简洁的贪吃蛇游戏代码,只有60几行,非常适合小白上手,而且思路极其清晰,赶紧分享 ...
- 用C++实现经典的贪吃蛇游戏
目录 前言 一.准备工作 二.实现过程 1.类的确定及其属性和行为 2.全局常量和变量的定义 3.每个行为的实现 3.1蛇的初始化 3.2蛇的移动 3.3蛇的绘制 3.4食物的初始化 3.5绘制食物 ...
- 贪吃蛇python撞墙不死_不敢相信,60行python代码就写出了贪吃蛇游戏
通过写游戏玩编程是一个非常有趣的事,网上用Python写贪吃蛇的代码很多,大部分都用类来写的,比较复杂.今天看到一个非常简洁的贪吃蛇游戏代码,只有60几行,非常适合小白上手,而且思路极其清晰,赶紧分享 ...
- 使用Python实现经典贪吃蛇游戏
先上效果图: 目录 一.简介 二.项目目的 三.turtle的详细介绍 3.1.简单介绍turtle.Screen() 3.2.简单介绍turtle.Turtle() 四.项目源码 五.总结 一.简介 ...
- python游戏贪吃蛇_Python写的贪吃蛇游戏例子_python
这篇文章主要介绍了Python写的贪吃蛇游戏例子,练手作品,又好玩又可以学到东西,需要的朋友可以参考下 第一次用Python写这种比较实用且好玩的东西,权当练手吧 游戏说明: * P键控制" ...
- bat贪吃蛇游戏代码_C语言写个贪吃蛇游戏
贪吃蛇是个非常经典的游戏,用C语言来实现也是一个好玩的事情.这个游戏我写完后放在知乎,竟然点赞的人数超级多.我觉得大家喜欢,一个方面是因为写得简单,大家都能看得懂,一个可扩展性还是非常强的. 我试了说 ...
- python制作贪吃蛇游戏_用Python写贪吃蛇游戏的代码实例
这篇文章主要为大家详细介绍了Python贪吃蛇游戏的编写代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 最近在学Python,想做点什么来练练手,命令行的贪吃蛇一般是C的练手项目,但是一时之间 ...
- C语言写个贪吃蛇游戏
贪吃蛇是个非常经典的游戏,用C语言来实现也是一个好玩的事情.这个游戏我写完后放在知乎,竟然点赞的人数超级多.我觉得大家喜欢,一个方面是因为写得简单,大家都能看得懂,一个可扩展性还是非常强的. 我试了说 ...
- x x x x c程序语言,C语言写个贪吃蛇游戏
贪吃蛇是个非常经典的游戏,用C语言来实现也是一个好玩的事情.这个游戏我写完后放在知乎,竟然点赞的人数超级多.我觉得大家喜欢,一个方面是因为写得简单,大家都能看得懂,一个可扩展性还是非常强的. 我试了说 ...
最新文章
- pytorch 加载模型:
- linux IP局域网监控工具——iptraf
- 多线程inline hook
- Office HPDeskjetD2468 打印机电源灯闪烁不停,打印机不工作怎么办
- 显示纯服务器_不止于手机!华为台式机真的来了,网友:这次真的“纯国产”...
- linux的svn同步文件在哪里,linux svn服务器同步文件在哪里
- leetcode 85. 最大矩形(dp)
- JAVA创建一个私有域_使用java基础反射访问私有域、方法和构造函数
- 跟我一起写 Makefile 上
- SystemError: Negative size passed to PyUnicode_New
- 技术管理实战笔记-团队建设篇
- 钟茜的工作日志跟在这里
- 图说职场贴士:护航职场的八力
- Map.containsKey() 的一个使用场景.
- Windows10更新后耳机没声音
- 9种防止电脑辐射的方法
- 手把手完成智慧路灯的开发,完成设备上云【华为云IoT】
- java计算机毕业设计网上扶贫农产品销售系统源代码+数据库+系统+lw文档
- badger mremap size mismatch数据库异常
- HMC7044芯片配置总结
热门文章
- 一位java大牛10年资料总结
- 产品经理必须要了解的经济学原理--“口红效应”
- java宠物店多态源代码
- java求完数(完全数 完美数)
- 安卓 android:windowsoftinputmode,Android:windowSoftInputMode="adjustResize"无效解决方法
- excel打印预览在哪里_Excel如何打印表格,每页纸都有标题?
- nginx会话保持值sticky模块
- autopep8规范你的python代码
- WGAN-GP代码注释
- 第10课:动手实战基于 CNN 的电影推荐系统