文档章节

CitrusEngine系列教程二:结合starling和Box2D开发游戏

clschen
 clschen
发布于 2013/05/05 16:58
字数 1639
阅读 361
收藏 1

教程出自 cls分享站

 

  1. CitrusEngine系列教程一:认识CitrusEngine

  2. CitrusEngine系列教程二:结合starling和Box2D开发游戏

  3. CitrusEngine系列教程三:使用flash cs 设计关卡

  4. CitrusEngine系列教程四:Citrus的2D动画和摄像头

  5. CitrusEngine系列教程五:使用PhysicsEditor创建box2d刚体

  6. CitrusEngine系列教程六:使用Tiled Map Editor创建地图

............................................................................


 

首先脑补一下相关知识吧

Starling是一个ActionScript类库,它模仿了传统的Flash显示列表。然而,和传统的显示对象不同,Starling对象完全存在于Stage3D环境。这意味着,所有的显示对象都直接由GPU渲染,这会带来非常明显的性能提升。=》 Starling中文站

Box2DFlashAS3 是Box2D物理引擎的ActionScript 3.0移植版本。它具有功能强大,效率较高等优点,应用Box2DFlashAS3可以使我们的网站模拟真实世界的物理效果,从而使我们的站点具有非常强的真实感。而我们热心的拉登大叔给我们写过不少 优质教程
这个教程参考官方例子,=》 官方例子演示

最后效果:


http://www.chenlinsheng.com/?p=415 


开始之前,可以下载  CEV3-1-6-Starling-Feathers-Box2D.swc  ,也可以像我一样单独去下载box2d,starling等源码来自己配置折腾…当然,也可以直接下载本文末尾提供的flex项目源码
1.创建主类
在StriusEngine中使用Starling,你必须继承StarlingCitrusEngine类,这个类继承于CitrusEngine(在教程一的时候我们使用的就是这个),主要提供了Starling的简单实现。
为了成功实现Starling,我们需要在构造函数中调用setUpStarling函数,该函数有三个参数debugMode(调试模式),viewport 抗锯齿(默认为1)与anti-aliasing视图大小(默认是舞台大小)。同时需要是运行于Flash player11。
  1. public class Main extends StarlingCitrusEngine {
  2. public function Main() {
  3. setUpStarling(true);
  4. }
  5. }
复制代码


2.创建游戏state
直译为状态,一个state可以是一个关卡,也可以将很多关卡放在一个state。state包含了游戏的逻辑,主类用来管理目录。同样这个我们需要用StarlingState代替之前的State。不过同样是通过重写initialize()方法来添加游戏元素,同样别忘了

super.initialize().

  1. public function StarlingDemoGameState() {
  2. super();
  3. }
  4. override public function initialize():void {
  5. super.initialize();
  6. }
复制代码


主类
state = new StarlingDemoGameState();


3.添加box2d
注意!box2d需要第一个被添加!否则在新建其他基于box2d的游戏元素(hero等)时候会报错,另外这个物理引擎的注册点事基于对象的中心点,所以坐标以中心点为准
  1. var box2D:Box2D = new Box2D("box2D");
  2. box2D.visible = true;
  3. add(box2D);
复制代码



接下来我们新建一些预设好的游戏元素,(新建元素的时候一般有两个参数,第一个参数是name(必选),CitrusEngine中是使用那么访问元素的,第二个Object类型,可选,可以给该元素的一些属性设置默认值

  1. add(new Platform("bottom", {x:stage.stageWidth / 2, y:stage.stageHeight, width:stage.stageWidth}));
  2. add(new Platform("cloud", {x:250, y:250, width:170, oneWay:true}));
  3. var coin:Coin = new Coin("coin", {x:360, y:200});
  4. add(coin);
  5. var hero:Hero = new Hero("hero", {x:100, y:350, width:60, height:135});
  6. add(hero);
  7. var enemy:Enemy = new Enemy("enemy", {x:stage.stageWidth - 50, y:350, width:46, height:68, leftBound:20, rightBound:stage.stageWidth - 20});
  8. add(enemy);
复制代码



简单介绍一下上面用到的元素吧(英文好的朋友,可以直接查看 官网api ,顺便求路过的大神帮忙翻译一下,各种求啊~)
Platform:平台,可以用来做地板,站台,障碍物等,oneWay属性设置为ture的话,英雄可以从Platform下面往上跳,差不多可以说是穿墙术吧,哈
Coin:钱币,默认被英雄触碰后会消失,同时抛出一个事件,下问添加互动的时候会演示如何监听这个事件
hero:英雄,游戏主角,可以想超级玛丽那样杀死敌人(压死敌人),当他接触敌人coin时候,coin会消失,hurtVelocityX, hurtVelocityY可以设置英雄受伤时候回跳的距离
enemy:敌人,leftBound, rightBound设置敌人的活动范围,敌人会依据设置来回走动直到遇到障碍物

4.添加 Starling  素材
添加素材的方法很多,这个教程我用了三种,直接给地址:
var coin:Coin = new Coin("coin", {x:360, y:200, view:"levels/SoundPatchDemo/jewel.png"});

使用Quad类,Quad根据指定的尺寸和颜色创建一个四边形。 最后一个参数决定是否在渲染的时候预乘透明度值,从而影响混合输出的颜色值,大多数情况下可以使用默认值。
add(new Platform("cloud",{x:450,y:580,width:170,height:30,oneWay:true,
view:new Quad(170,30,0x000FF0)}))



通过Embed嵌入预先画好的美术图与xml和动画片系列组合完成素材的导入;
  1. [Embed(source="../embed/Hero.xml", mimeType="application/octet-stream")]
  2. private var _heroConfig:Class;
  3. [Embed(source="../embed/Hero.png")]
  4. private var _heroPng:Class;
  5. var bitmap:Bitmap = new _heroPng();
  6. var texture:Texture = Texture.fromBitmap(bitmap);
  7. var xml:XML = XML(new _heroConfig());
  8. var sTextureAtlas:TextureAtlas = new TextureAtlas(texture, xml);
  9. hero.view = new AnimationSequence(sTextureAtlas, ["walk", "duck", "idle", "jump", "hurt"], "idle");
复制代码


这里也脑补一下一些 Starling  的纹理知识吧,=》 中文api
Texture:纹理是用来储存展示图像的信息。它不能直接被添加到显示列表;
相应的它必须映射到一个显示对象上。 在Staring中那个显示对象就是“Image”类。
Texture.fromBitmap():fromBitmap通过一个bitmap来创建纹理对象。 注意:如果Starling需要处理一个丢失的设备
上下文,那么不允许你释放纹理数据。
TextureAtlas: TextureAtlas纹理集是一个将许多小的纹理整合到一张大图中。这个类是用来从一个纹理集中读取    纹理
TextureAtlas(texture:Texture, atlasXml:XML = null)通过指定纹理和用于描述范围的XML来创建一个纹理集
5.添加声音交互(主类添加声音,state中用_ce.sound 调用)
a.在主类添加声音
sound.addSound("Collect", "sounds/collect.mp3");
b.给coin添加触碰监听
  1. coin.onBeginContact.add(coinTouched);
  2. private function coinTouched(contact:b2Contact):void {
  3. trace('coin touched by an object');
  4. }
复制代码


c.coinTouched添加播放声音的方法,
_ce.sound.playSound("Collect",1,0);
这样就可以了,当coin被触碰时,就会播放collect.mp3了
6.使用控制台
运行游戏的时候,按“Tab”键,控制台会在顶部出现,基本上是一个输入框,这时我们可以通过name访问游戏中的元素并进行设置,如:
  1. set hero y 0
复制代码


呼,终于写完了。下期见

=》原文及源码下载

© 著作权归作者所有

clschen
粉丝 4
博文 21
码字总数 10662
作品 1
广州
程序员
私信 提问
CitrusEngine系列教程一:认识CitrusEngine

教程作者:cls分享站 CitrusEngine系列教程一:认识CitrusEngine CitrusEngine系列教程二:结合starling和Box2D开发游戏 CitrusEngine系列教程三:使用flash cs 设计关卡 CitrusEngine系列教...

clschen
2013/05/03
316
0
CitrusEngine系列教程五:使用PhysicsEditor创建box2d刚体

作者:cls分享站 目前已有教程: CitrusEngine系列教程一:认识CitrusEngine CitrusEngine系列教程二:结合starling和Box2D开发游戏 CitrusEngine系列教程三:使用flash cs 设计关卡 Citrus...

clschen
2013/05/15
187
0
CitrusEngine系列教程三:使用flash cs 设计关卡

教程出自 cls分享站 CitrusEngine系列教程一:认识CitrusEngine CitrusEngine系列教程二:结合starling和Box2D开发游戏 CitrusEngine系列教程三:使用flash cs 设计关卡 CitrusEngine系列教程...

clschen
2013/05/07
82
0
Cocos2D泰然教程推荐学习步骤

文章转自泰然教程:http://article.ityran.com/cocos2dstudy 这是一个学习Cocos2D的非常好的学习指引。保存下来。 Cocos2D泰然教程推荐学习步骤 cocos2d学习Iven推荐步骤 校对:子龙山人 一、...

andyhe91
2014/10/10
95
0
【iOS-Cocos2d游戏开发之十一】使用Box2d物理系统以及在cocos2d框架添加Box2d物理系统lib包的方法

上一节讲述了粒子的相关问题,当然啦,不示弱,今天继续将物理系统给大家进行简单的介绍和讲述; 首先先介绍,如何在cocos2d中加入box2d开发lib包,因为一般使用cocos2d引擎进行开发游戏时,...

junwong
2012/03/02
1K
0

没有更多内容

加载失败,请刷新页面

加载更多

OSChina 周一乱弹 —— 年迈渔夫遭黑帮袭抢

Osc乱弹歌单(2019)请戳(这里) 【今日歌曲】 @tom_tdhzz :#今日歌曲推荐# 分享Elvis Presley的单曲《White Christmas》: 《White Christmas》- Elvis Presley 手机党少年们想听歌,请使劲...

小小编辑
39分钟前
99
8
CentOS7.6中安装使用fcitx框架

内容目录 一、为什么要使用fcitx?二、安装fcitx框架三、安装搜狗输入法 一、为什么要使用fcitx? Gnome3桌面自带的输入法框架为ibus,而在使用ibus时会时不时出现卡顿无法输入的现象。 搜狗和...

技术训练营
昨天
5
0
《Designing.Data-Intensive.Applications》笔记 四

第九章 一致性与共识 分布式系统最重要的的抽象之一是共识(consensus):让所有的节点对某件事达成一致。 最终一致性(eventual consistency)只提供较弱的保证,需要探索更高的一致性保证(stro...

丰田破产标志
昨天
8
0
docker 使用mysql

1, 进入容器 比如 myslq1 里面进行操作 docker exec -it mysql1 /bin/bash 2. 退出 容器 交互: exit 3. mysql 启动在容器里面,并且 可以本地连接mysql docker run --name mysql1 --env MY...

之渊
昨天
10
0
python数据结构

1、字符串及其方法(案例来自Python-100-Days) def main(): str1 = 'hello, world!' # 通过len函数计算字符串的长度 print(len(str1)) # 13 # 获得字符串首字母大写的...

huijue
昨天
6
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部