V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
mumuy
V2EX  ›  程序员

分享下自己学习 HTML5 游戏开发的试水作品及想法-吃豆人游戏

  •  1
     
  •   mumuy ·
    mumuy · 2022-12-31 08:38:44 +08:00 · 1509 次点击
    这是一个创建于 697 天前的主题,其中的信息可能已经有所发展或是发生改变。

    想法的来源最开始是自己在研究如何在迷宫中寻径问题:迷宫寻径算法 。当时我并不知道什么 Dijkstra 和 A*,只觉得好玩,于是参考物理知识“波的传播”特性,波阵面上的任一点都是下一个波源,然后参考实现了寻径算法。后来觉得仅仅一个 Demo 没意思,正好我正在学 canvas ,对于一些 api 掌握没有很大把握,就想着做一个小游戏试试巩固下。最短的路径寻找在游戏一定是大有用处的。但是如果用它呢?我想起了经典的游戏一些游戏:围住神经猫、吃豆人……可是,这时候有个问题,我不会作图啊!围住神经猫看来没有戏了,于是我就选中了最容易靠代码画图实现的吃豆人~

    吃豆人的寻径大体上就是 4 个幽灵如何抓玩家,问题是最短路径算法只能是一对一寻找。由于游戏设定一定是玩家跑的速度比 NPC 快的,如果只是单独 NPC 寻径追着玩家,那必然会出现几个 NPC 跟在玩家后面跑,这样的游戏体验将大打折扣。那么如何实现多个 NPC 相互配合呢?我想起了小时候和小伙伴追赶的游戏,第一反应是,如果我和几个小伙伴一起围堵一个人,那么当我在这个巷子发现有人已经在堵他了,那我一定是找下一个巷子包抄。那么这时候一起配合追赶的小伙伴对于我来说就是一堵墙吧?

    于是乎,我有了清晰的实现逻辑:当 NPC 各自在寻找玩家的过程中,相互都把其他 NPC 当做游戏中的墙,然后利用最短路径算法去追玩家,这就实现了几个 NPC“智能”的围堵逻辑!

    另外在做游戏过程中发觉,一个游戏系统比如少不了对对象的管理,还加入了一些动画管理及事件绑定等操作。觉得做下来,确实颇有收获。所以特别想分享给一些也正在学习 HTML5 画布的小伙伴,相信多多少少应该会提供一些思路吧……

    项目演示地址:https://passer-by.com/pacman/

    项目开源地址:https://github.com/mumuy/pacman

    项目是 2015 年开始开源的吧,都过去好多年了,也是当年的一腔热忱,后来也没怎么管过它。期间也有不少人提过建议,说按键不是很敏感之类的。其实也是一种实现时候的逻辑选择吧,我不想让错过路口的玩家还能回头走,就没想好如果提高灵敏度了。

    3 条回复    2022-12-31 21:00:36 +08:00
    gowl
        1
    gowl  
       2022-12-31 09:02:49 +08:00
    真好~
    pursuer
        2
    pursuer  
       2022-12-31 10:30:33 +08:00
    不是错过路口的问题,大部分用户会提前转向,提前转向也会因为还没到路口操作无响应,角色 update 又会重置操作,所以必须一直频繁按方向键,而且依然会错过,体验可以说比较糟糕。我试着调整成记住上次操作的方向以后体验感觉还是好不少的。
    mumuy
        3
    mumuy  
    OP
       2022-12-31 21:00:36 +08:00
    @pursuer 是有提前记住哦,你可以试着看代码
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   5489 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 22ms · UTC 08:52 · PVG 16:52 · LAX 00:52 · JFK 03:52
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.