2021 年 9月 8 日随笔档案 - hhvfg

2021年9月8日

摘要：这部分功能的实现过程中，笔者遇到了一个问题。原本的drawShot函数是这么写的： const drawShot = () => { // cancelAnimationFrame(handle) // cRole.clearRect(0, 0, WIDTH, HEIGHT) // drawRol 阅读全文

posted @ 2021-09-08 14:56 hhvfg 阅读(128) 评论(0) 推荐(0)

双人打僵尸小游戏开发--canvas(三.4)

摘要：当按下空格键时，有两个步骤。首先绘创建一个子弹类的实例，塞入子弹库数组 Ammunition中，其中的getAmmunPix函数用于根据当前role的位置和方向，确认枪口的位置。。然后调用drawShot函数执行，绘制出弹药库中的所有子弹类实例。drawShot函数如下所示： // 空格键触发射击动阅读全文

posted @ 2021-09-08 14:44 hhvfg 阅读(91) 评论(0) 推荐(0)

双人打僵尸小游戏开发--canvas(三.3)

摘要： (2). 通过方向键控制移动，按下空格射出子弹。首先需要有一个全局函数，能够监听用户的按键值，其实就是onmousedown啦。 // 全局监听按键触发对应操作 document.onkeydown = (e) => { const target = Number(e.which) switch 阅读全文

posted @ 2021-09-08 10:33 hhvfg 阅读(118) 评论(0) 推荐(0)

双人打僵尸小游戏开发--canvas(三.1)

摘要：我们通过canvasRole.getContext('2d')得到了个啥？官方说法是一个canvas上下文，实际看成一个canvas对象就行，拥有着众多属性，当然这不是一个普通对像。。。在前文中，我们借助requestAnimationFrame函数，实现了众多圆球随机跳动的效果。其中所涉及到的知阅读全文

posted @ 2021-09-08 10:23 hhvfg 阅读(92) 评论(0) 推荐(0)

双人打僵尸小游戏开发--canvas(三..2)

摘要：下面，我们一步步的来实现上述的七点需求。 (1): 游戏的开始，我们需要一个函数initCanvas 来初始化游戏世界。具体包括，获取画布，创建并显示人物。代码如下： // 初始化游戏世界 const initCanvas = () => { const canvasRole: any = docu 阅读全文

posted @ 2021-09-08 07:37 hhvfg 阅读(132) 评论(0) 推荐(0)