打怪兽啊biubiubiu
文章平均质量分 61
无智老衲
这个作者很懒,什么都没留下…
展开
-
前备知识 -- 使用canvas制作动画
前端动画有很多种实现方式,CSS3动画animation、transition等,flash,js+dom等。H5新元素canvas非常适合开发游戏。直接粘贴上常用绘制的代码啦!<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>canvas</title></head><body>原创 2017-10-10 08:40:02 · 1149 阅读 · 0 评论 -
前备知识 -- 动画requestAnimationFrame
动画的基本原理是依靠人类具有视觉暂留的特性人的眼睛看到一幅画或一个物体后,在 1/24 秒内不会消失(即每秒钟至少更换24张画面)。利用这一原理,在一幅画(一帧)还没消失前播放下一幅画(下一帧),就会给人造成流畅的视觉变化效果。如下面的翻书动画,就是利用我们人的视觉暂留的特性的。 因此我们可以得出:如果我们需要实现动画,只需要设置定时不断地绘制下一帧的画面便可以了。在 JavaScript原创 2017-10-10 08:49:48 · 454 阅读 · 0 评论 -
前备知识 -- 键盘事件
键盘事件处理在制作 PC 端的游戏的时候,我们经常需要监听键盘的事件,以便响应用户的键盘操作。目前,对键盘事件的支持主要遵循的是 DOM0级。按键相关事件键盘操作涉及下面三种事件:keydown:当用户按下键盘上的任意键时触发,而且如果按住按住不放的话,会重复触发此事件。keypress:当用户按下键盘上的字符键时触发,而且如果按住不放的,会重复触发此事件(按下Esc键也会触发这个事件)。ke原创 2017-10-10 13:26:08 · 398 阅读 · 0 评论 -
前备知识 -- 检测碰撞
碰撞检测关键步骤碰撞检测需要处理经历下面两个关键的步骤:计算判断两个物体是否发生碰撞发生碰撞后,两个物体的状态和动画效果的处理计算碰撞只要两个物体相互接触,它们就会发生碰撞。矩形物体碰撞检测假设检测发生碰撞的物体是 矩形1 和 矩形2 时,我们只需检测 矩形1 的上下左右四侧的和 矩形2 是否存在着距离。我们可以看看下面的图: 我们可以看到 矩形2 和 矩形1 之间没有发生碰撞共有四种可原创 2017-10-10 13:32:22 · 562 阅读 · 0 评论 -
前备知识 -- Javascript 对象与继承
很激动能自己开发一款基于canvas的小游戏了,虽然技术实现中很有用到很高深的原理,但是对很多涉及到的知识点都进行了一定程度的深入的学习。那么今天我们就开始进行复习的总结归纳吧!第一个总结归纳的知识点是,对象。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>继承</title> <sc原创 2017-10-10 08:22:30 · 298 阅读 · 0 评论 -
游戏准备工作 -- 计算, 思路解析
项目说明概述:Canvas 射击小游戏要求玩家控制飞机发射子弹,消灭会移动的怪兽,如果全部消灭了则游戏成功,如果怪兽移动到底部则游戏失败。目标:实现一个 Cavnas 射击小游戏项目git clone地址http://git.imweb.io/f3-t1/game 具体的项目要求解释等亦可在此获得项目演示地址以下是已经实现的射击游戏的 demo 地址,大家可以参考该游戏进行开发: 游戏基础原创 2017-10-10 21:00:41 · 208 阅读 · 0 评论 -
项目实践 -- 打怪兽biubiubiu
我的项目的git地址git的commit日志即开发过程。愿志同道合的人一同探讨研究!原创 2017-10-12 22:22:43 · 345 阅读 · 0 评论