纯js 2048游戏,js 2048游戏实现,无上限的2048游戏,有道具的2048游戏
来源:互联网 发布:就业数据网报系统 编辑:程序博客网 时间:2024/05/21 10:40
2048游戏的实现,如果不考虑数字滑动的动画效果,就很简单了。稍难的是数字滑动的动画效果。
2048游戏规则简单,一共个6个格子,可以4个方向滑动,相同的数字相遇就合并,一个数字翻倍,一个数字清0,清0的腾出一个格子。
当没有空白格子,用来出现新的数字时,游戏结束。
分析2018游戏的数字移动规则,4行(列),4个方向的移动,其实逻辑都一样,不一样的是要移动的方向和,要移动的数字。
我把16个数字放一个数组,索引0-15。0 表示UI不显示,表示没有数字。
4个方向,每个方向4行(列)的数字移动逻辑一样,只需要对一个方向,一行的移动做分析就可以了。其他的逻辑一致。
一个方向,一行就最多只有4个数字。我用从右到左,第一行来分析。
从右到左,第一行的4个数字索引:0,1,2,3
我把0当作初始索引index,他不用动,其他的3个数字向他移动,其他3个数字的索引递增值n,写一个函数处理一个方向,一行的数字合并及移动。
我用的方法比较笨,用了一个临时数组保存合并后的数字及合并前的索引。
再根据合并后的索引和合并前的索引来计算每个数字应该移动的格子数。
应该有更好的方法来实现,不需要3个循环,或许一个循环就OK。好在每个循环最多4次。性能影响不大。
game.line=function(index,n){var tmp=[];for(var i=index,c=0;c<4;i+=n,c++){if(game.nums[i])tmp.push({"index":i,"v":game.nums[i]});}for(var c=0;c<tmp.length-1;c++){if(tmp[c].v==tmp[c+1].v && tmp[c].v>0 ){tmp[c].v*=2;tmp[c+1].v=-1;game.nums[tmp[c].index] = tmp[c].v;game.nums[tmp[c+1].index]=tmp[c].v;game.curScore+=10;}}var count=0;for(var c=0;c<tmp.length;c++){if(game.nums[tmp[c].index]){if(tmp[c].v<0){count++;}setTimeout(( function(e,to){return function (){game.move(e.index, to);};})(tmp[c],index+n*(c-count)),1);}}};
有了每个方向,每一行的处理,其他的就简单了,定义一个数组配置 初始索引index和下一个数子索引递增值x,下一行初始索引递增值y,就可以循环处理所有4个方向,4行的处理了。
// fx 左0 上1 右2 下3// x: 同一行下一个数子索引递增值x, index +x 后为此行的下一个元素,// 下一行初始索引递增值y, index +y 后为下一行的第一个元素,var p=[{index:0,x:1,y:4},{index:0,x:4,y:1},{index:3,x:-1,y:4},{index:12,x:-4,y:1}][fx];for(var i=0;i<4 ;i++){
//p.index+i*p.y 一个指定方向的4行的初始索引game.line(p.index+i*p.y,p.x);//}
核心代码就这些了,数字移动用css3动画。游戏不设置2048的上限。增加道具炸弹,一个炸弹一次可以炸掉任意一个数字。
手机上面,实现滑屏操作,宽度自适应。
试玩及源码:
电脑:无上限的2048游戏,有道具的2048游戏 http://www.cyfhw.top/game/2048/
手机:无上限的2048游戏,有道具的2048游戏 http://m.cyfhw.top/game/2048/
- 纯js 2048游戏,js 2048游戏实现,无上限的2048游戏,有道具的2048游戏
- 纯js 消灭星星游戏,js 消灭星星游戏实现原理,有道具的消灭星星
- 纯JS写的2048游戏,分享之
- JS+Jquery:2048游戏
- 游戏2048的实现
- js、html实现2048游戏源码
- 2048游戏的Java实现
- WPF 2048游戏的实现
- 2048游戏实现的回顾
- Android游戏2048的实现
- 2048游戏的逻辑
- HTML5+Javascript的游戏,叫“html5游戏”还是“js游戏”?
- 2048游戏动画渲染animframe_polyfill.js
- 2048游戏网页版,js源代码
- 2048游戏JS实战笔记1
- 使用JS--->2048游戏项目(一)
- 使用JS--->2048游戏项目(二)
- 实例,js实现的推箱子游戏
- 无法定位程序输入点curl—easy—pause于动态链接库 libcurl.dll上
- (转)情商管理:高EQ的十种表现
- linux特殊权限SetUID-36
- Java 48个关键字
- strut2没有XML提示信息解决办法
- 纯js 2048游戏,js 2048游戏实现,无上限的2048游戏,有道具的2048游戏
- 远程控制问题集锦(你的凭据不工作,之前用于连接到(服务器IP)的凭据无法工作,请输入新的凭据)
- NowCoder-包含一(数学)
- 值得推荐的C/C++框架和库
- 图像采集调试总结
- 伪类与超链接
- android studio导入第三方包
- BZOJ 4103 [Thu Summer Camp 2015]异或运算 可持久化Trie
- VS2013 密钥 – 所有版本