最近接触了Egret白鹭引擎,感觉非常好用,提供了各种各样的开发工具让开发者和设计者更加便捷,并且基于typescript语言开发省去了很多学习成本,对于我们这种掉微软坑许久的童鞋来说,确实很有吸引力,在开发中最浪费时间就是设计和调试的阶段,js的语言过于自由,自由到有时候写错了都不知道,但typescript可以使用开发IDE帮助排错和调试,不得不说确实很有效率,在这之前,我在egret论坛里发了几个小游戏做练手,最近的一个<疯狂猜歌名>在素材齐备的情况下,仅用了不到1天的时间完成了开发,以…

现在我们使用egret来起步开发一个名叫<成语大挑战>的小游戏,关于egret的开发环境就不在这里啰嗦了,直接去官方下载安装就可,egret是我见过开发环境部署最简单的解决方案,这个系列教程中,使用了egret的Wing和ResDepot,只需要安装这两个就行,首先打开EgretWing,选择创建项目,输入你想要的项目名称,项目类型为“Egret EUI项目”,然后下一步: 由于游戏设计的是竖屏,而素材的分辨率为720x1136,所以设置是如上的选择,然后选择完成,稍等就会构建一个模板项目出来…

在游戏中,我们一般会有各种各样的二级页面,比如游戏暂停界面或者游戏结束界面,这些界面组成了对玩家交互主要手段,在游戏开发中,对于这些界面的coding组织是非常有学问的,如果倒退到十年前,游戏开发的老前辈们一定孜孜不倦的上课如何设计好“易读”“可维护”“逻辑清晰”的界面代码,本人曾深陷其中变得对代码抠抠索索,结果事倍功半,原因是什么?老前辈们的一个项目或一段代码可能是长期维护长期使用的,而现在的高速code和超短的产品生命周期,使得完全不用规划那么好的交互代码,有时候可能过几个月自己的代码都不认…

本篇将主要讲解游戏界面的构建和设计,会应用到egret.eui的自定义组件,可以很直观的构建一个游戏整体,这里我们仍然只需要使用EgretWing就可以达到目的,本篇可能是篇幅最少的一个,但是涉及自定义组件和类继承,希望能够读者能够看明白,这对将来的游戏开发的思维帮助非常大. 自定义控件布局 首先先创建一个名为SceneGameSkin的exml皮肤,直接在这里面拖拖拽拽拼出初步的界面: 上面是题目区,下面是回答区,此时,找了了一下资源,发现字的方块没有放进资源文件,没关系,我们可以直接使用eu…

本篇需要在前面的素材准备完毕,才可以开始,使用egret的eui结合代码编辑,快速完成基本的界面搭建,这里写的可能比较细,目的是减少大家对于其中一些操作疑问,我去掉了很多无用的步骤,以最精简的流程来完成,如果比较熟练的话,这些操作只需要不到15分钟就完全可以搞定. 特别说明:如果已经对EUI 有基础了解的童鞋,可以直接跳过这篇,因为实在是太简单了. 创建一个exml的皮肤,这里特别说一下,到现在仍然对于项目中的“包”和“目录”有什么具体区别仍然还是不是很清晰,反正对我来说就是一个目录,习惯性的会…

在上一篇中,简单的使用界面元素快速实现了一个游戏中的二级页面,这种直接在游戏页面上做UI的做法并不太好,原因是,UI会让游戏的压力变大,即使它是隐蔽的,如果同样的功能在其它的地方也是一样的,那么就要写多个同样的逻辑吗?例如设置界面,游戏中的设置界面基本上功能都是一样,如果每个UI中都做一遍,是多么愚蠢的办法?在UI的代码设计中,一般来说,单独的功能不会在其它的地方用到,如GameOver,就直接写在UI里,而如果是通用功能,则最好的做法是做一个通用的单例类或者工厂类在需要的时候将它们初始化,在多…

本篇在前面的基础上,将进行逻辑的编码开发让游戏能够正式的玩起来,这里没有注重太多的体验细节,而是直接实现游戏的规则逻辑,将分成两个部分说明:数据处理和游戏逻辑. 初始化游戏数据 在前面的第五篇中,我们通过数据的构建已经读取了所有的关卡数据在关卡选择界面中,LevelDataManager负责管理所有的关卡数据,在SceneLevels类中,当onclick_level触发时,就会切换到Game界面中,所以改造代码如下: private onclick_level(e:egret.TouchEve…

通过前面的开始界面基本上了解了eui的使用方法,可以简单快速的制作一个UI界面,本篇使用第二界面选关界面展示更为难一点的代码控制,来展现关卡地图的内容,请确保素材和资源完整,可以在前面的教程中找到下载. 选关界面和开始界面不太一样,请参考开篇的结构图,需要一个推进式上下拉动的地图界面,创建基本的exml和开始界面是一样的,这里的名字叫“SceneLevelsSkin”,在组件库中把Scroller组件拖进去并给其下属内容命名group_levels,用来承载地图内容,最后加一个返回按钮. <?x…

经过前面的制作,使用Egret的Wing很快完成了开始界面和选关卡界面,下面通常来说就是游戏界面,但此时界面切换和关卡数据还没有准备好,这次讲解界面的切换和关卡数据的解析.前面多次修改了Main.ts文件中startCreateScene的方法,这个方法就是当游戏的前置Loading全部完成之后,执行的开始方法,Main本身就是UI容器,所以直接Add进去做好的UI逻辑即可. 界面切换 这里涉及到一个界面切换的代码设计问题,以开始界面为例,当“开始游戏”按钮点击之后,应将开始界面移除,进入到选关…

自上一章公布到如今已时隔四月,实在对不住大家.让大家久等了~话说不是我不关注我的博客,而是事情一多起来写博客的时间就少了. 待到今日有空了,回头看了看自己曾经写的文章,猛得发现已经四个月不曾写文章了.便仅仅得叫声:"苦也~",我害怕本系列文章会拖得更久,于是立马提笔,也好为本系列文章留个凤尾. 首先,大家来温习一下前面两篇里的内容吧: HTML5物理游戏开发 - 越野山地自行车(二)创建一辆可操控的自行车 http://blog.csdn.net/yorhomwang/article/…

HTML5 Canvas游戏开发实战主要讲解使用HTML5 Canvas来开发和设计各类常见游戏的思路和技巧,在介绍HTML5 Canvas相关特性的同时,还通过游戏开发实例深入剖析了其内在原理,让读者不仅知其然,而且知其所以然.在本书中,除了介绍了HTML5 Canvas的基础API之外,还重点阐述了如何在JavaScript中运用面向对象的编程思想来进行游戏开发. 本书在介绍每个游戏开发的过程时,都会包括游戏分析.开发过程.代码解析和小结等相关内容,以帮助读者了解每种类型游戏开发的详细步骤,…

Phaser是一款专门用于桌面及移动HTML5 2D游戏开发的开源免费框架,提供JavaScript和TypeScript双重支持,内置游戏对象的物理属性,采用Pixi.js引擎以加快Canvas和WebGL渲染,基于浏览器支持可自由切换. Flappy Bird的下架让许多开发者做个爆管子.夹小鸟的Flappy类游戏的兴致盎然了起来,也让Phaser这一专门用于桌面及移动HTML5 2D游戏开发的开源免费框架为更多人所知晓.Phaser支持JavaScript和TypeScript,采用Pix…

cocos2d-x 游戏开发之有限状态机(FSM) (三) 有限状态机简称FSM,现在我们创建一个专门的FSM类,负责管理对象(Monkey)的状态.然后Monkey类就实现了行为与状态分离.Monkey类只负责自己的行为,MonkeyFSM作为Monkey的成员,负责状态调度.MonkeyFSM调用状态模式类的方法,状态模式类调用真实对象Monkey的方法.注意本文例子代码只是为了说明问题,并不能真正用于实际当中.其中Monkey与MonkeyFSM互相保存对方的指针,存在循环引用问题.…

一.引子 在游戏开发中,我们少不了和数据打交道,数据的存储格式可谓是百花齐放,xml.json.csv.bin等等应有尽有.在这其中Json以其小巧轻便.可读性强.兼容性好等优点受到广大程序员的喜爱.目前市面上有许多针对Json类型数据的序列化与反序列化库,比如Newtonsoft.Json.LitJson.SimpleJson.MiniJson等等,在这之中马三比较钟意于LitJson,其源码规模适中.代码规范可读性好.跨平台能力强.解析速度快,但是美中不足的是LitJson对float(官方…

lufylegend可以解决HTML5开发游戏中会遇到的一些问题: 1.各种浏览器对于JavaScript和HTML的解析是不一致的. 2.手机浏览器和PC浏览器的区别. 3.JavaScript并非面向对象编程,影响了代码的可读性. 使用开源库件之前先进行初始化,在带中链接框架,并且在HTML中加上以下代码 <div id="mylegend">loading...</div> 接下来使用库件内置的init方法进行初始化.init函数的原型如下: init(s…

一,前言   本 游戏 是鄙人研究lufylegend数日之后,闲暇之余写下的.本游戏运用全新的技术 html 5写成的.游戏引擎为国产的lufylegend.js,大家可以去它的官网看看.游戏处于测试阶段,希望各位为游戏提点意见.另外游戏中的拼图是随即分配,保证游戏的随即性.     二,怎么玩?    下载地址(含原码+图片):    http://files.cnblogs.com/ducle/Puzzle.rar 在线试玩:   http://www.shengshiyouxi.com…

有非常多游戏採用H5技术开发.比方三国来了.巴哈姆特之怒.切绳子等. 我们公司也有多款游戏用H5开发.H5开发成本低.效率高,方便做自己主动更新,可移植性好. 受益于H5技术,我们公司的非常多产品都非常方便跨平台. 早在2012年.我就非常荣幸负责技术攻关,把我们的游戏移植到win8和wp8平台,当时在国内的win8和wp8平台是率先的.我们的一款游戏,跨ios.android.win8.wp8和黑莓10五大移动平台,这在国内肯定是唯一的吧? <无尽大陆>获微软win8商店重点推广 water…

提要 在Unity工作流程内,地形是一个必不可少的重要元素.不论是游戏或虚拟现实都会使用到各种类型的地形效果,在这个教学中我们须要了解到地形的制作基本概念与,当中对于Unity的地形操作部分须要大量的操作练习.熟悉这些功能操作之后,相信对于游戏地形的制作与运用将会更得心应手. 先看终于效果: 环境:windows7 64bit Unity3d4.2.1 所需资源:terrain.raw 创建project File  ->  New project 选择project存放的位置,同一时候导入 S…

一.文本 LTextField对象是lufylegend库件中专门用于显示文本信息的一个对象. 1.文本属性 创建的文本框对象不会自动加入可视化对象列表中.只有手动调用addChild()方法才能使它显示. var layer = new LSprite(); //初始化LSprite对象 addChild(layer); //将对象添加进canvas画布中 var field = new LTextField(); //创建文本框对象 field.text = "Hello World!&qu…

一.变形 1.放大和缩小 scale(X,Y)函数. 当使用该函数时,其起始坐标值也被放大或缩小.当X.Y为负值时,可以实现翻转. 2.平移变换 translate(X,Y)函数. 表示水平方向向左移动,竖直方向向下移动. 3.旋转变换 rotate(角度)函数. 旋转一定角度,是以canvas的起始坐标坐标(0,0)为中心旋转.可使用translate修改canvas的中心. 4.setTransfrom函数实现倾斜效果 可使用transfrom()函数代替上述三种函数的功能. 二.图形的渲染…

一.绘制基本图形 在每次用canvas画布时,都有几步是“套路” 1.在HTML中创建Canvas画布: <canvas id="mycanvas" width="960px" height="580px"> 浏览器不支持canvas <!-- 如果不支持会显示这段文字 --> </canvas> 2.获取画布标签,并得到一个2D对象: var c = document.getElementById('myca…

变换 学习目标 理解如何使用矩阵表示线性变换和仿射变换 学习对几何体进行缩放.旋转和平移的坐标变换 根据矩阵之间的乘法运算性质,将多个变换矩阵合并为一个单独的净变换矩阵 找寻不同坐标系之间的坐标转换方法,并利用矩阵来表示此坐标变换 熟悉DirectXMath库中专门为构建变换矩阵所提供的相关函数 3.1线性变换 3.1.1定义 如果有一个函数t可以使 t(u + v) = t(u) + t(v) t(ku) = tk(u) 成立,则函数t称为线性函数,也称为线性变换.其中u和v为3D向量,k为标…

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <…

…

前情回顾 上个博客说道我们象棋程序进入了欢迎界面,在欢迎界面下等待一秒进入主界面 进入主界面的关键代码如下: CCScene* pScene = CCMainMenu::scene();  创建scene ... CCDirector::sharedDirector()->replaceScene(ps);  显示scene 最关键的是CCMainMenu::scene函数,说明后面要显示的scene类型是CCMainMenu类型的 所以接下来我们一起来看CCMainMenu是怎么回事 CCMa…

尊重开发人员的劳动成果,转载的时候请务必注明出处:http://blog.csdn.net/haomengzhu/article/details/27094663 前言 Cocos2d-x 是一个通用平面游戏引擎.基于一个相同十分著名的游戏引擎 Cocos2d-iPhone 设计. 它继承了 Cocos2d 系列引擎一贯的特点:使用简单.执行高效.灵活,且功能强大. 与 Cocos2d-iPhone 不同的是.Cocos2d-x 还拥有强大的跨平台能力,仅仅须要编写一次代码. 就能够无缝地部署在…

尊重开发人员的劳动成果,转载的时候请务必注明出处:http://blog.csdn.net/haomengzhu/article/details/27094663 前言 Cocos2d-x 是一个通用平面游戏引擎,基于一个相同十分著名的游戏引擎 Cocos2d-iPhone 设计. 它继承了 Cocos2d 系列引擎一贯的特点:使用简单,执行高效.灵活.且功能强大. 与 Cocos2d-iPhone 不同的是,Cocos2d-x 还拥有强大的跨平台能力,仅仅须要编写一次代码, 就能够无缝地部署在…

对于玩家来说,游戏是动态的:对于游戏开发人员来说,游戏是静态的,只是不停地播放不通的画面,让玩家看到了动态的效果. 进入Android之前,首先要熟悉三个重要的类:View(视图).Canvas(画布).Paint(画笔).通过画笔,可以在画布上画出各种精彩的图形.图片等等,然后通过视图可以将画布上的内容展现在手机屏幕上. 其次要熟悉“刷屏”的概念.绘制在画布中的图像不管是图片还是图形,都是静态的,只有通过不断的展现不同的画布,才能实现动态的效果.在手机上,画布永远只是一张,所以不可能通过不断地…

一,话说天下大事 前不久看到lufy的博客上,有一位朋友想要一个RPG游戏引擎,出于兴趣准备动手做一做.由于我研究lufylegend有一段时间了,对它有一定的依赖性,因此就准备将这个引擎基于lufylegend.暂时命名为lufylegendRPG.毕竟基于lufylegend,如果名称中不加上lufylegend这几个字的话,有点说不通啊...最近发布了0.1.0版,但是不理想,连一惯都是鼓励和赞赏我的lufy老先生都是出于真心的表示不满意.想了解0.1.0版的朋友可以看看这里(其实最好别看…

背景: 在网上看到,65行实现flappy bird,感到很好奇.原来是使用开源的2D游戏框架 phaser开发的. 什么是phaser2D游戏开发框架呢? 借鉴与网上的资料: 1.    Phaser是一款专门用于桌面及移动HTML5 2D游戏开发的开源免费框架,提供JavaScript和TypeScript双重支持,内置游戏对象的物理属性,采用Pixi.js引擎以加快Canvas和WebGL渲染,基于浏览器支持可自由切换. 2.主要特性: JavaScript.TypeScript双重支持…