0


【前端网页游戏开发】Vue3+PixiJS开发2D闯关打怪游戏,开发时长为6天,成功推出v1.0正式版

更新内容

增加了地图切换功能,扩展了游戏的游玩长度,进入每一关时,击杀10只怪物就会提示通关成功,进入下一关,点击按钮后会恢复玩家的血量,然后重新生成怪物,如果玩家死亡,就会回到提示回到主界面

点击后

游戏最后增加了BOSS,在玩家进入第四关时会出现BOSS角色,血量为20,玩家伤害为攻击一次减少1血量,当击杀BOSS后玩家通关游戏,回到主界面

当进入下一关时,清除所有怪物尸体,然后恢复玩家状态,如果是第四关的话,不再刷新怪物,出现BOSS

  1. next = () => {
  2. groundSprite.switchMap();
  3. guanqia.value = groundSprite.index;
  4. isSuccess.value = false;
  5. keySet = new Set();
  6. personSprite.container.position.set(50, 415);
  7. personSprite.hp = 10;
  8. hp.value = 10;
  9. killNum.value = 0;
  10. let children = app.stage.children;
  11. while (children.length > 2) {
  12. app.stage.removeChild(children[children.length - 1]);
  13. }
  14. enemySpriteList = [];
  15. isForEndList.value = [];
  16. if (guanqia.value == 4) {
  17. clearInterval(timer)
  18. bossSprite = new BossSprite();
  19. bossSprite.container.position.set(app.screen.width / 2, app.screen.height / 2)
  20. app.stage.addChild(bossSprite.container);
  21. bossHp.value = bossSprite.hp
  22. }
  23. };

玩家击杀最终BOSS,游戏结束

回到主界面


小结

历经6天的游戏开发,本游戏终于迎来了1.0正式版本,虽说游戏开发完成,但还是仍存在一些小问题,但是我修BUG修的累,就没有管了,不会特别影响到游戏的游玩,本游戏使用Vue3加PixiJS开发,将免费开源,感兴趣的话可以下载运行(需要环境)或者使用在线地址预览游戏,喜欢请点个关注,本游戏告一段落!

在线预览地址: http://www.topbox.top:8089/

哔哩哔哩: https://space.bilibili.com/35310250?spm_id_from=333.1007.0.0

项目源码:https://gitee.com/violet_wmtxdy/original-game---discomfort

往期日志

【前端网页游戏开发】PixiJS开发2D闯关打怪游戏_前端游戏闯关-CSDN博客

【前端网页游戏开发】PixiJS开发2D游戏,更新内容-CSDN博客

【前端网页游戏开发】Vue3+PixiJS开发2D闯关打怪游戏,更新内容(打斗-CSDN博客

标签: 游戏 html5 vue.js

本文转载自: https://blog.csdn.net/m0_61279136/article/details/139837819
版权归原作者 violet_evergarden. 所有, 如有侵权,请联系我们删除。

“【前端网页游戏开发】Vue3+PixiJS开发2D闯关打怪游戏,开发时长为6天,成功推出v1.0正式版”的评论:

还没有评论