最近闲着没事干,刷短视频老是刷到一些魔性小游戏,看着挺有意思。刷到一个“灭星星”的游戏,看着挺简单,就想着自己动手也做一个。
先说说大概思路,我这脑子,不写下来过一会儿就忘。得有个界面,上面铺满花花绿绿的星星,点一下,相同颜色的星星就能消掉,消完就过关。差不多就这样。
开干!
先得把游戏界面搭起来。我这里就简单粗暴,直接用div+css画格子。
小编温馨提醒:本站只提供游戏介绍,下载游戏推荐89游戏,89游戏提供真人恋爱/绅士游戏/3A单机游戏大全,点我立即前往》》》绅士游戏下载专区
代码大概长这样:
(这里省略具体代码,就说说思路,真写出来太占地方。)
然后,在这个container里面,用JavaScript动态生成一个个小格子,每个小格子就是一个星星。
光秃秃的格子多难看,得给它们上色。
我琢磨着,搞个颜色数组,比如红的、黄的、蓝的、绿的……
然后在生成小格子的时候,随机从颜色数组里挑一个颜色,给它涂上。
这样一来,每个星星的颜色就是随机的,五颜六色的,看着也热闹。
这可是核心功能!得让星星能点,点能消!
给每个小格子(也就是每个星星)绑定一个点击事件。
点一下,就看看它周围有没有和它颜色一样的星星。
有的话,就把它们一起“干掉”(从页面上移除)。
这里我用一个笨办法,就是上下左右挨个检查,看看颜色是不是一样。肯定有更聪明的办法,不过我这水平,先这样,能跑就行!
总得有个结束条件,不能一直点点点。
每次消除完星星,就检查一下,看看还有没有剩下的星星。
没有?恭喜你,过关!
简单粗暴,直接弹个提示框,告诉玩家“你赢!”。
这游戏,基本功能算是完成。还能加很多东西,比如计分,关卡,各种特效……不过我这人懒,先这样,能玩就行!
这回实践还挺有意思的。从啥也不会,到一步步把游戏做出来,虽然过程磕磕巴巴,但看到成果,还是挺有成就感的。
下次再整个啥?要不,搞个俄罗斯方块?