我和扫雷
我其实不是一个爱玩游戏的人,不管是PC、iPad、手机还是PS4上的游戏,我都是浅尝辄止,过了一段时间之后甚至记不起自己装过什么游戏。
小学大概三、四年级时家里开始有台式机了,然而我一个半文盲并不怎么会操作电脑,只是观察我爸爸玩电脑自带的游戏,后来我就学会玩了,并且一直持续到大学。
大二的时候爸爸给我买了个苹果壳子的无牌笔记本电脑,由于里面装的是盗版精简Windows系统,小游戏和日语输入法这种一般人用不到的东西就没有装,于是我用优盘从学校的机房把它们拷出来,装进了自己的电脑。
当然了,这也证明了小游戏和日语都是一般人不需要的东西。
我写扫雷
好了,现在说说我做的这个扫雷。
首先写一个雷区的算法,获得一个地雷的矩阵,然后把它渲染到画面上。
这个雷区的算法是我在codefights上刷题的时候想到的,也是因为做了这道题,我才兴起了做这个游戏的念头。
一开始想挑战下用原生JavaScript,可仅仅是写document.getElementsByTagName就已经累个半死了,点击事件也都写得很长,还只完成了基本的翻开单个方块、标记地雷、确认输赢、开始新一局等功能,远没有达到我想要的复刻经典版功能的目标。
后来第二版用了jQuery,在DOM操作上确实简单了一些,但是仍然免不了在看不见摸不着的数据和眼见着要操作的DOM之间纠缠,而且由于各种限制,游戏在功能上并没有增多。
再来是第三版,尝试用微信小程序的wxml、wxss、JS来写。
学习微信小程序的文档和各类经验贴的时候确实有不少收获,由于它和Vue的相似性,顺带还学了点Vue,而游戏的功能上则新增了计时、计数、保存成绩等功能。
然而由于微信小程序限制了开发游戏的时候不可以使用wxml、wxss、JS,它就这么死掉了。
它死掉之后,我因为过于伤心,直到11月之前都没有再碰过。
上个星期五晚上,我突发奇想,要用Vue来重写一遍,于是我重新设计了CSS,再结合Vue的文档,终于用了一个周末的时间写出了这个最新的VueJS版本的扫雷游戏。
Vue版扫雷
这个Vue版本的最大特点是实现了根据窗口大小调整雷区和地雷数,而且可以做到点开周围没有雷的方块时可以一连翻开一大片。
之前的三个版本中,我一直想做成片翻开方块的功能,但是写着写着就报错call stack limit exceeded,自查又查不出bug在哪,简直令人头秃。
这次我着重在这个功能上花了心思,每写一步都去console输出一下,一旦报错就立刻调整。
最终结果是,大概报错3、4次之后就完成了这个功能,开心~
除了成片翻开的功能之外,我还在设置按钮和它的弹出窗口上下了功夫。
设置按钮的图标是我以前用CSS画的八齿空心齿轮,而它的弹出窗口本身是一个轮播图的形式,以后也可以直接复用。
轮播图在 这里
我想做的功能都实现了,这个版本基本上算是圆满了。
扫雷游戏完整版在 这里
其他人的扫雷
在查找各种用法资料的时候,我顺便还看了一些关于扫雷的帖子,才发现原来世界上还有比我更沉迷于扫雷的人。
他们专门建立了扫雷的论坛,按照各人的扫雷成绩进行排名,甚至还拿到世界上参与排名。
跟他们比起来,我的扫雷成绩可能只能算新手入门,但我对扫雷这个游戏的热爱跟他们是一样的。
有那么点爱好,真的挺好。
完~