Cocos2d-x 的3D游戏制作官方教程(中文翻译)

原创 2015年05月13日 23:02:46

Cocos2d-x 在版本3开始已经支持了3D游戏开发的特性,我在官网文档看到3D开发的部分,觉得有必要记录一下,权当做学习笔记。因为只花了半天时间翻译,而且能力有限,各位看官勿喷。

本博客虽然水分很足,但是也算是博主的苦劳了,

如需转载,请附上本文链接http://blog.csdn.net/cyh_24/article/details/45702343,不甚感激!


相信,你已经对Cocos2d-x有所了解,并且将它作为一种2D游戏引擎来看待。但是,从版本3开始,我们已经将3D一些特性添加到了Cocos2d-x里面。因为3D游戏是一个巨大的市场,所以,为了方便您进行3D游戏的开发,Cocos2d-x向您提供了所有你开发3D游戏时所需要的特性。或许对你而言,3D开发是一个新的领域,这里有一些软件、工具是你所需要了解了。

深吸一口气,不要紧张,我们将一步一步地带你走进3D开发的奇妙之旅!

1. Sprite3D

跟2D游戏一样,3D游戏开发同样也需要Sprite对象。Sprite对象是所有游戏的一个基础构件。3D Sprite相比于2D,除了x轴跟y轴,还多了一个z轴。Sprite3D的大部分用法都跟图片的Sprite没有两样。加载并显示一个Sprite3D对象非常简单,看代码:

auto sprite = Sprite3D::create("boss.c3b");
sprite->setScale(5.f);
sprite->setPosition(Vec2(200,200));
scene->addChild(sprite);

以上代码,非常简单的就创建了一个Sprite3D对象,显示效果如下:
此处输入图片的描述

2. 专有名词

虽然并不涉及语言范畴,但是,在使用3D特性的时候,你还是需要了解这个领域的一些被广泛使用的专有名词。

  • Mesh - 这是当你进行渲染的时候,构造形状和纹理所用的顶点。
  • Model - 这是一个可以被渲染的对象,它是mesh的集合。在外面的引擎中,它就是Sprite3D。
  • Camera - 因为,3D世界不是一个平面,所以你需要从一个视角去看它。这个视角就是Camera,当你使用不同的Camera的参数(即使用了不同的视角),你看到的场景是不同的。
  • Light - 光照的作用是为了让场景看起来更具真实感。为了让对象看起来更真实,你需要根据光照的情况来改变颜色。很简单,光线照射的地方是亮的,背对光照的地方是暗的。

3. 使用Sprite3D

3.1 将3D模型载入到Sprite3D对象

上文已经提到,3D模型是一系列的mesh集合。你可以将一个3D模型附加到另一个3D模型中,以此来产生一些丰富的特效。比如,你可以将一个武器模型附加到任务模型中。为了达到这个效果,你需要找到武器需要附加的位置。在代码中,你可以使用 getAttachNode() 来进行添加。
例子:将一个3D模型附加到另一个3D模型中:

auto sp = Sprite3D::create("axe.c3b");
sprite->getAttachNode("Bip001 R Hand")->addChild(sp);

代码显示的效果如下:
此处输入图片的描述

3.2 互换 3D Model

当进行3D开发的时候,你可以想要对模型进行动态的修改。比如,当人物能力值的变化,服装的改变,或者你想要通过模型在视觉上的变化来提醒用户状态的改变。如果你的3D模型是由mesh构成的,那么你可以使用 getMeshByIndex() 和 getMeshByName() 轻松的访问这些mesh。通过这些函数,你可以实现人物更换武器或者服装的效果。
我们来看一个关于女孩更换外套的例子:

此处输入图片的描述

我们可以通过改变一系列mesh对象,来更换女孩穿着的外套。下面的代码演示了如何实现这一功能:

auto sprite = Sprite3D::create("ReskinGirl.c3b");

// display the first coat
auto girlTop0 = sprite->getMeshByName("Girl_UpperBody01");
girlTop0->setVisible(true);

auto girlTop1 = sprite->getMeshByName("Girl_UpperBody02");
girlTop1->setVisible(false);

// swap to the second coat
girlTop0->setVisible(false);
girlTop1->setVisible(true);

上述代码的演示效果如下:

此处输入图片的描述

4. Animation

Sprite3D 对象是构成游戏最本质的对象。我们已经在前面学会了如何操作它们。但是,你可能还想要一些更丰富的效果体验。加入一些动画效果吧!为了执行了一个动画效果,你需要使用 Animation3DAnimation3D 对象。然后,你可以使用 Animation3D 对象来创建一个Animate3D动作效果。来看例子:

// the animation is contained in the .c3b file
auto animation = Animation3D::create("orc.c3b");

// creates the Action with Animation object
auto animate = Animate3D::create(animation);

// runs the animation
sprite->runAction(RepeatForever::create(animate));

文字无法展示动画效果,所以,你还是使用”Programmer Guide Sample”中的代码,来亲自体验这个动画特效吧!需要注意的是,3D动画和2D动画有共通之处,可以回到第4章再仔细研读一番。

4.1 多个动作

如果你想要在同一时间执行多重动作效果的时候,你该怎么做?
通过动画开始时间和动画序列长度这两个参数,你可以创建多重动画特效的叠加效果。这两个参数的单位都是秒,例子如下:

auto animation = Animation3D::create(fileName);

auto runAnimate = Animate3D::create(animation, 0, 2);
sprite->runAction(runAnimate);

auto attackAnimate = Animate3D::create(animation, 3, 5);
sprite->runAction(attackAnimate);

在上面的例子中,有两个动画特效得到了执行。第一个动作立刻执行,并执行了2秒钟。第二个在开始后的三秒钟才开始执行,并持续了5秒钟。

4.2 动画执行速度

动画的速度属性是一个正数,当然也有负数的速度,表示反方向。在这个例子中,速度被设定为10,这表示动画长度是10秒。

4.3 动画混合

当你使用多重动画的时候,每个动画之间的融合协调是自动进行的。动画融合的目的是在不同动画效果之间进行平滑过度。给定两个动画,A和B,在动画A的最后几帧,和B的前几帧会重叠,使得动画看起来的效果更自然。
Cocos2d-x 中默认的平滑过渡时间是0.1秒。你也可以通过 Animate3D::setTransitionTime 来设置这个时间长短。
Cocos2d-x 目前只提供帧间的线性差值。它能填充间断的曲线,使得路径能够平滑。如果你在模型的制作过程中使用其他的差值方法,我们的内置工具–fbx-conv 将会生成额外的帧间补偿。这种补偿的是与目标帧相一致的。为了获取更多的信息,请参看本章最后的讨论部分。

5. Camera

Camera对象是3D开发中非常重要的一个部分。因为3D世界并不是平面的,所以你需要一个Camera来观察、导航,这就像你正在看一场电影,通过不同的镜头看到不同的场景。在使用Camera对象的时候,你需要有这样的概念。Camera对象是从Node继承而来的,因此,它同样可以支持大多数的动作对象。需要注意的是,Camera对象分为两种,一种是透视Camera,另一种是正交投影Camera.
透视Camera是用来观察对象由近到远的变化。一个透视Camera试图可以是如下:

此处输入图片的描述

通过这个透视Camera,你可以看到物体越近看起来越大,反之看起来更小。
而正交投影Camera则被用来在远距离中观察物体。你可以将它的作用理解为将一个3D世界投影成一个二维的表达。正交投影Camera可能长成如下模样:

此处输入图片的描述

你可以看到不管物体有多远,它的尺寸还是一样的。例如,如果游戏的地图很小,通常会使用正交投影Camera来渲染。

5.1 Camera 的使用

不要紧张,可能Camera对象听起来很复杂,但是放心,我们已经确保你使用它进行开发的时候会很轻松。实际上,当使用3D的开发的时候,你完全不需要做什么来创建一个Camera对象。每一个场景都会根据Director对象的映射属性自动生成一个默认的Camera。如果你需要不止一个Camera,你可以使用下面的代码来再创建一个:

auto s = Director::getInstance()->getWinSize();
auto camera = Camera::createPerspective(60, (GLfloat)s.width/s.height, 1, 1000);

// set parameters for camera
camera->setPosition3D(Vec3(0, 100, 100));
camera->lookAt(Vec3(0, 0, 0), Vec3(0, 1, 0));

addChild(camera); //add camera to the scene

5.2 创建一个正交投影Camera

默认的Camera是透视Camera。如果你想要创建一个正交投影的Camera,也非常简单,只需要使用 Camera::createOrthographic(). 例如:

auto s = Director::getInstance()->getWinSize();
auto camera = Camera::createOrthographic(s.width, s.height, 1, 1000);

5.3 Hide objects from camera

有时候,你并不想将所有的物体都显示到视野中。在Cocos2d-x 中,想要隐藏一个物体非常简单,使用如下操作即可:

//Camera
camera->setCameraFlag(CameraFlag::USER1);

//Node
node->setCameraMask(CameraFlag::USER1);

6. Light

如果你想要你的游戏更精美,画面的氛围更真实,控制好Light同样是一件非常重要的事情。目前Cocos2d-x支持4中光照技术。你可以根据你的需要,选择最适合你的光照技术。每一种光照效果都是不同的。

6.1 Ambient Light(环境光)

环境光没有固定的位置,也没有具体的方向。使用环境光可以为模型的每个表面都提供相同的照明,每个表面都显示出同样的亮度。想象一下你在办公室的环境中,所有地方都有光,你看到的所有物体的光照情况都是一样的。想要使用环境光照,可以按如下做法:

auto light = AmbientLight::create (Color3B::RED);
addChild (light);

它产生的效果如下:

此处输入图片的描述

6.2 Directional Light(定向光/平行光)

定向光通常被用来模拟类似太阳光的光源。定向光源是沿着同一方向发射的平行光线,因此定向光光也没有固定的位置,而是沿着指定的方向无限延伸。当你使用定向光的时候,你需要意思到对于每一个被定向光照射的表面,其光线强度都与光源处相同。想象一下,你在晴朗的户外,当你直视太阳的方向,即使你走了几步,光照还是一样强烈。使用定向光可以如下操作:

auto light = DirectionLight::create(Vec3(-1.0f, -1.0f, 0.0f), Color3B::RED);
addChild (light);

它产生的效果如下:

此处输入图片的描述

6.3 Point Light(点光源)

点光源通常被用来模拟灯泡,灯或者火炬的光照效果。点光源从一点出发向所有方向发射光线,类似于灯泡所发出的光线。点光源的位置决定了光线与模型各个表面的夹角,因此可以在不同位置指定多个点光源,提供不同的光照效果。此外,点光源的强度可以随着距离的增加而进行衰减,并且可以使用不同的衰减方式,从而可以更加逼真地模拟实际的光照效果。使用点光源可以如下操作:

auto light = PointLight::create(Vec3(0.0f, 0.0f, 0.0f), Color3B::RED, 10000.0f);
addChild (light);

它产生的效果如下:

此处输入图片的描述

6.4 Spot Light(聚光灯)

聚光灯通常被用作模拟手电筒的效果。聚光灯从一点出发,沿指定的方向和范围发射具有方向性的圆锥形光束。聚光灯所产生的圆锥形光锥分为两部分:内部光锥是光束中最亮的部分,其顶角称为聚光角;整个光锥的顶角称为照射角,在照射角和聚光角之间的光锥部分,光的强度将会产生衰减,这一区域称为快速衰减区。同点光源一样,聚光灯的强度也可以从光源开始,随着光线传播距离的增加而逐渐衰减,并且可以使用不同的衰减方式。使用聚光灯可以如下操作:

auto spotLight = SpotLight::create(Vec3(-1.0f, -1.0f, 0.0f), Vec3(0.0f, 0.0f, 0.0f),
Color3B::RED, 0.0, 0.5, 10000.0f) ;
addChild (spotLight);

它产生的效果如下:

此处输入图片的描述

6.5 Light Masking(光罩)

你在你的厨房或者卧室使用什么样的照明?可能是几盏灯?你是否注意到,或许你只使用了一个灯就能把整个房间照亮?那是因为你使用了灯罩!
当你有一个Node需要一个特定的光照源的时候,你需要使用灯罩。比如,在一个场景中有三个光照源,但是一个Node只能别其中的一个光照作用。这时,你就可以使用 setLightFlag 来人为控制Node受哪个光照源作用。由于移动平台的性能问题,我们并不建议使用多个光照源。默认的光照源数量是1个。如果你想要开启多个光照源,你需要修改info.plist中的参数,如下所示:

<key> cocos2d.x.3d.max_dir_light_in_shader </key>
<integer> 1 </integer>
<key> cocos2d.x.3d.max_point_light_in_shader </key>
<integer> 1 </integer>
<key> cocos2d.x.3d.max_spot_light_in_shader </key>
<integer> 1 </integer>

7. 3D 软件包

7.1 3D 编辑器

3D编辑器包含了你创建3d图形的各种工具。这里提供包括商业版和免费版的一下主流的编辑器:

  • Blender (免费)
  • 3DS Max
  • Cinema4D
  • Maya

大部分3D编辑器,通常保存的文件可以在各个编辑器之间互用,而且也可以导入到游戏引擎中使用的。

7.2 Cocos2d-x 提供的工具

Cocos2d-x 提供一些工具来帮你将你的3D模型转化成Cocos2d-x能够访问的文件格式。

7.3 fbx-conv 命令行工具

fbx-conv 能够帮你将FBX文件转换成Cocos2d-x 特有的格式(c3t,c3b)。FBX是最流行的3D文件格式,主流的3D编辑器基本都支持这一文件格式。使用 fbx-conv 非常简单,你只需要提供几个参数即可:

fbx-conv [-a|-b|-t] FBXFile

可供选择使用的参数如下:

  • -?: 显示帮助文档
  • -a: 导出文本格式和二进制格式
  • -b: 导出二进制格式
  • -t: 导出文本格式
    例如:
fbx-conv -a boss.FBX

这里还需要注意一些小细节:模型需要有一个至少包含一个纹理图案的材质;而且目前只支持一个骨骼动画,多个骨骼对象现在还不能被支持。但是,你可以创建一个3d场景,然后后导出多个静态模型。mesh最多支持的顶点数是32767.

8. 3D 文件格式

Cocos2d-x 目前提供两种3d文件格式:

  • 通用的格式(Wavefront Object files): .obj 文件
  • Cocos2d-x 特有的格式:c3t, c3b 文件.

Wavefront文件格式是一种应用十分广泛的格式,主流的3D编辑器都支持它,而且它能够很简单被解析。但是,它也有局限性,比如它不支持动画特性。
另一方面,c3t和c3b是Cocos3d-x特有的文件格式,它允许动画、材质和其它3d特性。c3t的后缀t代表text(文本),c3b的后缀b表示binary(二进制文件)。建议开发者使用c3b进行开发,因为它的性能更高。如果,你想要调试文件,或者跟踪它在git或者其他VCS(版本控制系统)上的变化,那么你需要c3t。而且,你可以通过.c3b或者.c3t来创建Animation3D对象,但是.obj文件就无法创建动画了。

9. 高级模块

9.1 BillBoard

或许,在此之前,你根本没有听说过BillBoard(翻译为广告牌)。不要误会,我不是再说你在高速路上总是看到的令人厌恶的广告牌。我说的BillBoard是一个特殊的Sprite,它总是面对着Camera。当你旋转Camera的时候,BillBoard对象也会随之一起旋转。使用BillBoard是一个十分普遍的渲染技术。举个例子:高山滑雪游戏。在这种游戏中,滑雪者道路上出现的任何树、石头或者其他问题都是BillBoard对象。下图演示了Camera跟BillBoard对象之间的关系:

此处输入图片的描述

9.2 BillBoard的使用

Billboard 对象可以被很轻松地创建。BillBoard衍生自Sprite,所以Sprite拥有的大部分特性,它也都支持。我们可以使用以下方法来创建BillBoard:

auto billboard = BillBoard::create("Blue_Front1.png", BillBoard::Mode::VIEW_POINT_ORIENTED);

通过改变BillBoard对象的类型,你可以创建一个XOY平面上的BillBoard对象:

auto billboard = BillBoard::create("Blue_Front1.png", BillBoard::Mode::VIEW_PLANE_ORIENTED);

上面的两种方法,差异只在于传递了不同的 BillBoard::Mode 类型,一个是 _VIEW_POINT_ORIENTED 第二个是 VIEW_PLANE_ORIENTED.

VIEW_POINT_ORIENTED 表示BillBoard对象是朝向Camera的,其效果如下:

此处输入图片的描述

VIEW_PLANE_ORIENTED 表示BillBoard对象是朝向XOY平面的,其效果如下:

此处输入图片的描述
同样,你可以BillBoard对象设置其他属性,就像你对其他Node所做的一样。这些属性包括到不完全是:scale,position,rotation,例如:

billboard->setScale(0.5f);
billboard->setPosition3D(Vec3(0.0f, 0.0f, 0.0f));
billboard->setBlendFunc(BlendFunc::ALPHA_NON_PREMULTIPLIED);
addChild(billboard);
版权声明:如需转载,请附上本文链接。作者主页:http://blog.csdn.net/cyh_24

相关文章推荐

Cocos 3D功能初探学习笔记(3)---光照

3D游戏中光照对于游戏效果占有举足轻重的作用,也是与2D游戏的重要区别。cocos引擎也提供了完善的光效效果支持。 光照就是光源照到物体上的效果,cocos引擎支持四种光源,继承自Node类,也就是说...

Cocos2d-x 3.3 的3D开发功能介绍

主要有以下功能: 1. 基本的Sprite3D使用,加载静态模型和动态模型,看 Sprite3DBasicTest 2.Sprite3D对象的旋转,缩放等Action操作 3.Sprite3D中使用S...
  • sdhjob
  • sdhjob
  • 2014-09-26 12:12
  • 12487

2014腾讯校招面试之二总结

昨天下午3点刚完一面,昨天晚上就收到信息说今天10点去面试了,真是赶啊,让我想做好个准备都不行。 知道信息后,昨晚睡得不好,今天精神一般,不过应付面试还是足够有多的。 今天的面试官看上去好不和蔼,比较...

Cocos2d-x-Lua示例项目HelloLua

Cocos2d-x-Lua示例项目HelloLua 本篇博客介绍Cocos2d-x中Lua的实例项目,就是使用Cocos2d-x创建的初始项目运行所呈现的农场,这里笔者取名为HelloLua。本篇博客...

一 手游开发工具cocos2d-x editor初识

cocos2dx editor是开发跨平台的手机游戏工具 运行window和mac系统上,javascript脚本语言,基于cocos2d-x跨平台游戏引擎, 集合代码编辑,场景设计,动画制作,字体设...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)