前言: 最近无聊在淘宝弄了个小店,打算做一个兼职.遇到一个客户,要我帮忙拷贝一个html5游戏.. 我这人有一个习惯,拿到自己没见过的东西.都会去研究一番.去网上查了下发现,资料都是英文版.感觉极度不方便..因此拿出来,自己分析分析.... 框架简介: Pixi.js到底是什么呢..  Pixi.js使用WebGL,是一个超快的HTML5 2D渲染引擎.作为一个Javascript的2D渲染器,Pixi.js的目标是提供一个快速的.轻量级而且是兼任所有设备的2D库. Pixi渲染器可以开发者享受…
下面,我们来解释下PIXI里面对象的各个属性.. 首先我们来看看这个各个元素对象里面到底长啥样.. alpha Number 整个舞台对象的透明度. buttonMode Boolean 渲染是否作为一个按钮.此项作者暂未测试.. cacheAsBitmap Boolean 设置元素,不显示对象缓存作为一个位图. children Array [只读] 返回一个包含子元素的数组. defaultCursor String 元素被鼠标进过后的样式. 但是必须设置 interaction = tru…
在线演示 本地下载 ​这篇文章中,介绍HTML5游戏引擎pixi.js的基本使用. 相关代码如下: Javascript 导入类库:(使用极客的cdn服务:http://cdn.gbtags.com) <scripttype="text/javascript"src="http://cdn.gbtags.com/pixi.js/1.6.1/pixi.js"></script> 引擎使用: .... .... 阅读原文:HTML5游戏开发引擎P…
CreateJS为CreateJS库,可以说是一款为HTML5游戏开发的引擎.打造 HTML5 游戏,构建新游戏,提供构建最新 HTML5 的技术.你可以通过这个网站学习如何构建跨平台和跨终端游戏.这个资源库还会告诉你如何构建多人在线游戏.CreateJS 是一套可以构建丰富交互体验的 HTML5 游戏的开源工具包,旨在降低 HTML5 项目的开发难度和成本,让开发者以熟悉的方式打造更具现代感的网络交互体验. v准备工作 1.进入createjs首页:  首页有几个tab页,有EASEJS.Tw…
CutJS 是轻量级的,快速的,基于 Canvas 开发的 HTML5  2D 渲染引擎,可以用于游戏开发.它是开源的,跨平台的,与现代的浏览器和移动设备兼容.CutJS 提供了一个类似 DOM 树的数据模型来编写应用程序,并在内部管理渲染周期,绘制你的应用程序. 您可能感兴趣的相关文章 HTML5 实战教程,提升综合开发能力 小伙伴们惊呆了!8个超炫的 Web 效果 35个让人惊讶的 CSS3 动画效果演示 8个惊艳的 HTML5 和 JavaScript 特效 60款很酷的 jQuery 幻…
HTML5游戏开发进阶指南(亚马逊星畅销书,教你用HTML5和JavaScript构建游戏!) [印]香卡(Shankar,A.R.)著 谢光磊译 ISBN 978-7-121-21226-0 2013年9月出版 定价:79.00元 412页 16开 编辑推荐 在一名专业的游戏开发者指导下,你将开发出两款完整的HTML5游戏:一款与<愤怒的小鸟>类似,基于Box2d物理引擎的策略益智类游戏和一个包括单位.建筑.路径导航.人工智能.多玩家对战模式的即时战略(RTS)游戏.开发游戏的过程中,你将学…
剪刀石头布,非常可爱的小游戏,相信大家都非常的怀念这款小游戏,小时候也玩过很多次,陪伴着我的童年的成长,现在是不是还会玩一下,剪刀石头布游戏的规则我们都知道是:剪刀剪布,石头砸剪刀,布包石头.跟朋友.同学.兄弟姐妹有意见分歧?通过“剪刀石头布游戏”来一局吧,谁赢了听谁的.躲猫猫的时候,通过“剪刀石头布游戏”来一局吧,谁输了谁找.洗衣服.做饭.扫地等等什么的,通过“剪刀石头布游戏”来一局吧,谁输了谁做.这是我的处女座游戏,学校的时候跟着培训老师一步一步写出来的,今天在这里将这款游戏分享给伙伴们,可…
HTML5游戏开发经典视频教程.电子书汇总 HTML5是用于取代1999年所制定的 HTML 4.01 和 XHTML 1.0 标准的 HTML 标准版本,现在仍处于发展阶段,但大部分浏览器已经支持某些 HTML5 技术.HTML 5有两大特点:首先,强化了 Web 网页的表现性能.其次,追加了本地数据库等 Web 应用的功能.在这里整理了一些Oracle学习相关的资源链接,希望对大家有帮助! 资源名称 资源地址 下载量 好评率 15个HTML5入门经典资料合集 http://down.51ct…
一.前言   本次教程将向大家讲解如何用html5将小地图块拼成大地图,以及如何用现有的高级html5游戏开发库件lufylegend.js开发游戏.   首先让我们来了解了解如何用html5实现动画,毕竟“动静结合”是先有动再有静.看了上一章的内容,或许你就有了对html5实现动画有了初步了解:      二.html5实现用小地图块拼成大地图      早在上一章以前我就向大家介绍过,许多游戏的地图是用小地图块拼成的.那么既然那些游戏能通过AS或者其他编程语言实现,那我们的html5也丝毫不…
<HTML5游戏开发进阶指南> 基本信息 作者: (印)香卡(Shankar,A.R.)    译者: 谢光磊 出版社:电子工业出版社 ISBN:9787121212260 上架时间:2013-8-26 出版日期:2013 年9月 开本:16开 页码:412 版次:1-1 所属分类:计算机 更多关于 >>>< HTML5游戏开发进阶指南> 内容简介     计算机书籍 <html5游戏开发进阶指南>介绍了html5 游戏开发的一般过程和技巧.全书共分1…
在基于TypeScript的LayaAir HTML5游戏开发中使用AMD AMD AMD是"Asynchronous Module Definition"的缩写,意思就是"异步模块定义".这是目前最流行的JavaScript/TypeScript代码的管理方式.本文介绍了如何在基于TypeScript的LayaAir HTML5游戏开发中使用AMD来组织代码.本文参考资料列表中包含了更多关于AMD的信息. 示例项目 示例项目源码从这里下载https://githu…
借助AMD来解决HTML5游戏开发中的痛点 游戏开发的痛点 现在,基于国内流行引擎(LayaAir和Egret)和TypeScript的HTML5游戏开发有诸多痛点: 未采用TypeScript编译器的增量编译模式导致无法达到极致的编译效率,进而编码.运行.调试循环不流畅. 代码的组织方式是使用namespace,为了减少代码长度和提高代码输入的效率,一般使用import来创建别名,但是工具流不支持自动的import或者import检查.手动去写import降低了编码的效率. 使用namespa…
自动化的开发流程 在HTML5游戏开发或者说在Web客户端开发中,对项目代码进行修改之后,一般来说,需要手动刷新浏览器来查看代码修改后运行结果.这种手动的方式费时费力,降低了开发效率.另外,如果我们使用了如TypeScript这类需要通过转换器把代码转换成浏览器可识别的JavaScript代码的语言,在运行程序之前,我们还需要进行额外的手动转换,这同样是影响开发效率的一个因素.为了解决这两个问题,本文介绍了如何通过使用TypeScript Compiler(tsc)的watch模式来实现代码修改…
lufy前辈写过<[代码艺术]17行代码的贪吃蛇小游戏>一文,忽悠了不少求知的兄弟进去阅读,阅读量当然是相当的大.今天我不仿也搞一个这样的教程,目地不在于忽悠人,而在于帮助他人. 先看demo效果图: 测试URL: http://www.cnblogs.com/yorhom/articles/3157553.html 关注我的blog的人不仿会看到我最近发布了新引擎lufylegendRPG 1.0.0,今天就算来推广一下这个引擎吧.也好让大家见证一下封装的力量. 引擎下载地址:http://…
开言: 以前lufy前辈写过叫“ HTML5游戏开发-零基础开发RPG游戏”的系列文章,在那里面我学习了他的引擎以及了解了游戏脚本.自从看了那几篇文章,我便对游戏开发有了基本的认识.今天我也以零基础为视点,为大家讲述如何开发一款简单的游戏.希望大家看了这篇文章,能使你对理解游戏开发有帮助. 你可以先测试一下游戏: http://lufylegend.com/lufylegend_developers/yorhom_Christmas/index.html 1,如何进行游戏开发   1.1游戏开发…
一.前言 本次教程将向大家讲解如何用HTML5将小地图块拼成大地图,以及如何用现有的高级html5游戏开发库件lufylegend.js开发游戏. 首先让我们来了解了解如何用html5实现动画,毕竟“动静结合”是先有动再有静.看了上一章的内容,或许你就有了对html5实现动画有了初步了解: html5游戏开发--"动静"结合(一):  http://blog.csdn.NET/yorhomwang/article/details/8301451 二.html5实现用小地图块拼成大地图…
原文地址:http://www.script-tutorials.com/html5-game-development-lesson-8/ 这是我们最新一篇HTML5游戏开发系列文章.我们将继续使用canvas来进行HTML5游戏开发系列的文章.这次我将展示在你的项目中,如何使用Box2D的创建物体.Box2D是一个非常流行的开源物理引擎对于那些需要模拟2D物体的应用来说.在游戏开发中,2D物理引擎是个非常热门的话题.有了物理引擎的帮助,再设定环境和简单的规则,我们可以很容易的创建好玩的游戏.…
HTML5游戏开发进阶指南介绍了HTML5游戏开发的一般过程和技巧.全书共分12章,第1章介绍了本书相关的HTML5的诸多新特性,包括在canvas上绘图.播放声音等,另外还引入了子画面页的概念:第2-4章利用Box2D物理引擎开发了一款非常类似于<愤怒的小鸟>的游戏,全面介绍了物理引擎的概念,以及在游戏中使用物理引擎的方法,这一部分还引入了视差滚动技巧,以实现某种伪3D效果:第5-10章开发了一款简化版的<红色警戒>游戏,这一部分涉及了相当多的内容,包括地图的制作,建筑与单位的设…
随着HTML5标准终于敲定.HTML5将有望成为游戏开发领域的的热门平台. HTML5游戏能够执行于包含iPhone系列和iPad系列在内的计算机.智能手机以及平板电脑上,是眼下跨平台应用开发的最佳实施方案. 本文系依据[HML5 Canvas游戏开发实战]一书中的内容整理而成,是了解和学习HTML5游戏开发的基础内容,希望能够帮助到那些和博主一样致力于游戏开发的朋友们. JavaScript中的面向对象编程 对于游戏开发来说,面向对象编程(OOP)是一种重要并且必要的方法.所以在了解HTML5…
Egret是一套完整的HTML5游戏开发解决方案.Egret中包含多个工具以及项目.Egret Engine是一个基于TypeScript语言开发的HTML5游戏引擎,该项目在BSD许可证下发布.使用Egret Engine开发的游戏可发布为HTML5版本,运行于浏览器之中.同时,也可以发布为iOS.Android和WindowsPhone原生程序.…
原文地址:http://www.script-tutorials.com/html5-game-development-lesson-10/ 最后我们将继续使用canvas来进行HTML5游戏开发系列的文章.今天我准备了一个新游戏--SkyWalker.这游戏基本上算是一个射击模拟类型的游戏(有飞机和敌人).我们的目标是到达终点线.该游戏有几个关键的特征:使用了精灵来处理飞机和爆炸,可以按下多个按键(比如你可以移动飞机的同时发射子弹),a certain level length,增强的碰撞检测…
原文地址:http://www.script-tutorials.com/html5-game-development-lesson-9/ 今天我们将继续使用canvas来进行HTML5游戏开发系列的文章.这次我准备了一个新游戏,是基于第4篇的游戏,但是增加了火球,敌人和碰撞检测.故,我们的龙可以发射火球来杀死敌人,并且记录分数.这样该游戏就有更多的交互性. 之前的翻译文章可以点击这里:http://www.cnblogs.com/pigzhu/p/3234255.html 第一步:HTML 首…
原文地址:http://www.script-tutorials.com/html5-game-development-lesson-7/ 今天我们将完成我们第一个完整的游戏--打砖块.这次教程中,将展示怎样进行基本的碰撞检测和使用HTML5的本地存储.你可以使用鼠标和键盘来操作挡板,上一次游戏的持续时间和分数将会保存. 前一篇的的介绍在HTML5游戏开发系列教程6(译). 第一步:HTML <!DOCTYPE html> <html lang="en"> &l…
原文地址:http://www.script-tutorials.com/html5-game-development-lesson-6/ 这是我们最新一篇HTML5游戏开发系列文章.我们将继续使用canvas来进行HTML5游戏开发系列的文章.这次是个完整的游戏例子,再现一款经典的电脑游戏--坦克大战.我将教你们使用交替的数组地图(alternative array-maps),同时将说明如何检测活动对象(坦克)和周围环境之间的碰撞. 前一篇的的介绍在HTML5游戏开发系列教程5(译). 第一…
原文地址:http://www.script-tutorials.com/html5-game-development-lesson-5/ 最终我决定准备下一篇游戏开发系列的文章,我们将继续使用canvas来进行HTML5游戏开发系列的文章.今天我准备音乐的例子(有点儿像音乐合成器),它用到了使用CSS3来制作的基于DOM的对话框.为什么我使用独立的对话框--简单,最主要是因为CSS有很多处理标准元素的文本和样式的方法,且它可以使JS的代码简单,同时能提升例子程序的速度.所以你可以对这些对话框应…
原文地址:http://www.script-tutorials.com/html5-game-development-lesson-4/ 这篇文章是我们继续使用canvas来进行HTML5游戏开发系列的文章,我们要学习下一个元素:精灵动画和基本的声音处理.在我们这个示例中,你将看见一直正在飞的龙,我们能一直听见它翅膀扇动的声音,当鼠标释放事件发生时还有龙咆哮的声音.最后我们将教会龙移动到鼠标按下处. 前一篇的的介绍在HTML5游戏开发系列教程3(译). 第一步:HTML index.html…
近来想做html5游戏开发些小东西玩一下,因为手边就是笔记本,想怎么玩就怎么玩了,今年可以说是非常重要特殊的一年,感觉有些倒霉,不过,心态最重要,该怎么做的时候就去怎么做吧,日子的24小时是不会变的,不管能活多久. 游戏开发感觉不错,所以就刚看了一个碰撞检测canvas的来做,一段段代码弄下来试,成功运行了,原理也是一些很简单的,不过是 不停地检测 FPS,不停刷新每一帧来达到最终的探测目的: 每一帧里面都去检测范围,是否会碰撞: 有三种检测方法: 范围检测: 光线投影速度向量检测:分离轴定理:…
可在 html5 游戏中使用的 js 工具库 作者: 木頭 时间: September 21, 2014 分类: Utilities,Game 使用 cocos2d-js 3.0 开发游戏项目两三个月,积累了几个有意思的工具库,在此做一点小记. Date/Time 在网络游戏中,不可避免地会使用到一些与日期和时间相关的功能,例如活动倒计时之类的.简单的做法是自己处理时间函数,或者使用 new Date() 来完成计算.但常常会遇到一些坑,导致各种异常.而且处理 strftime 之类的工作也没有…
HTML5 众多强大特性让我们不需要多么高深技术就能创建好玩的网页游戏,同时证明了开放的 Web 技术能与任何其他在游戏开发中使用的技术竞争.正如标题所说,这篇文章推荐的几款很棒 HTML5 游戏开发工具能够帮助你开发出优秀的,好玩的游戏. 您可能感兴趣的相关文章 年度盛宴:最经典的10款 HTML5 游戏 35款非常优秀的基于 HTML5 网页游戏 8个惊艳的 HTML5 和 JavaScript 特效 20个惊艳的 HTML5 Canvas 应用试验 29款基于 HTML5 Canvas 的…
从2014年开始,消除游戏异常火爆,从消除小星星到腾讯的天天消除都赢得了海量用户.目前,各大市场上开心消消乐等游戏依旧火爆.消除游戏一直持续保持着女性和孩子的主流游戏地位.虽然市场上消除游戏种类很多,玩法也不少,但是经典玩法仍是主流.本游戏使用的是最经典的玩法加扩展,亮点是提供了强大的游戏关卡编译器,可以不断完善和创新新的关卡与玩法! 本源码适合有一定App运营经验的人,当然如果你只是为了学习又不差这点钱,这也将是一个非常不错的选择.本源码出售性质为买断性出售,意思是我只会卖1次,这和那些卖了无…