第八章：图册、Sprite和粒子系统

第八章：图册、Sprite和粒子系统中锐教育研究院学习目标纹理和纹理图册Sprite动画粒子系统给游戏带来了生机什么是纹理？纹理是指将拍摄一副图像把它应用于一个多边形的时候，我们通常将这幅图像称为纹理。为什么要使用纹理？在OpenGL应用程序中，使用OpenGl可以特别高效地将纹理绘制在多边形上，这样可以提高速度，同时也能够节约内存的消耗。什么是纹理映射？在建模时为每个顶点都定义纹理坐标(s,t)，

s和t取值都在[0,1]。这样可得到每个顶点对应的纹理像素颜色。OpenGL纹理在程序中要使用OpenGL纹理，大概分以下步骤：创建纹理对象，并为它指定一个纹理。确定纹理如何应用到每个像素上。启用纹理贴图。绘制场景，提供纹理和几何坐标由于我们提供的纹理图像很少能和最终的屏幕坐标形成对应,大小不同,所以需要设置过滤项目.允许我们进行插值或者匀和,指定放大缩小的函数.glTexParameter*(),使用过滤模式GL_NEAREST那么纹理单位最邻近的将被使用,GL_LINEAR那么就用2*2的包含纹理数据的数组加权组作为纹理;纹理对象命名纹理对象一般采用：

glGenTexures(GLSizen,Gluint*textureNames);分析：n为产生n个未使用的对象值,textureNames为纹理名字数组,你可能有几个纹理需要使用,这个数组来区分.假如要载入图片得时候纹理定义为：voidglTexImage2D(GLenumtarget,GLintlevel,GLintcomponents,GLsizeiwidth,GLsizeiheight,GLintborder,GLenumformat,GLenumtype,constGLvoid*pixels);分析：定义一个二维纹理映射。target是常数GL_TEXTURE_2D,level表示多级分辨率的纹理图象的级数。若只有一种分辨率，level为0。components是从1到4的整数，1：选择R；2：选择RA；3：选择RGB；绑定纹理对象在某个程序中使用纹理得时候，必须通知渲染器启用纹理功能的这个过程称为绑定纹理。绑定方法：glBindTexture(Glenumtarget,Gluint,glTexImage*)；注：将把数据存储到这个纹理对象中,如果需要纹理图像的颜色和物体表面的颜色进行组合,不是直接贴图,那么就需要glTexEvn*()函数.确定纹理坐标获取纹理坐标，通过以下方法获取。glTexCoord2f(1．of，1．Of)；glVertex3f(1．Of，1．Of，0．Of)；简单的纹理示例bool

CGfxOpenGL::init(){

glClearColor(0.0f,0.0f,0.0f,0.0f);

glEnable(GL_TEXTURE_2D);

//

启用

2D

纹理

m_textureOne=

new

CTargaImage;

if

(!m_textureOne->Load(“rock.tga”))

//

加载纹理图像

return

false;

glGenTextures(1,&m_textureObjectOne);

//

创建纹理对象，

glBindTexture(GL_TEXTURE_2D,m_textureObjectOne);

//

绑定纹理对象

//

设定缩放器的过滤参数

glTexParameteri(GL_TEXTURE_2D,GL_TEXTURE_MAG_FILTER,GL_LINEAR);

glTexParameteri(GL_TEXTURE_2D,GL_TEXTURE_MIN_FILTER,GL_LINEAR);

//

为纹理对象指定纹理图像数据

glTExImage2D(GL_TEXTURE_2D,0,GL_RGB,m_textureOne->GetWidth(),

m_textureOne->GetHeight(),0,GL_RGB,GL_UNSIGNED_BYTE,

m_textureOne->GetImage());简单的纹理示例

//

创建第二个纹理对象

glGenTexture(1,&m_textureObjectTown);

glBindTexture(GL_TEXTURE_2D,m_textureObjectTwo);

glTexParameteri(GL_TEXTURE_2D,GL_TEXTURE_MAG_FILTER,GL_NEAREST);

glTexParameteri(GL_TEXTURE_2D,GL_TEXTURE_MIN_FILTER,GL_LINEAR);

glTexImage2D(GL_TEXTURE_2D,0,GL_RGB,m_textureOne->GetWidth(),

m_textureOne->GetHeight(),0,GL_TGB,GL_UNSIGNED_BYTE,

m_textureOne->GetImage());

//

初始化运动变量

m_zPos=-0.5f;

m_zMoveNegative=

true;

return

true;} 简单的纹理示例上述init()函数中，我们先启用

2D

纹理(

glEnable()

),

然后加载图像到

CTargaImage

类中，然后通过glGenTextures()获得一个未被使用的纹理对象，继而绑定，指定缩放器的过滤模式，最后为纹理指定图像数据（通过

glTexImage2D()

).

然后同样的流程创建了第二个纹理对象，

使用了同样的纹理图像数据。只是缩放器的过滤参数做了下更改。纹理图册

什么样的图册称为纹理图册呢？请看下图捕鱼达人游戏界面。上图这一张张小的图片挤在一张大图片上，这中大的png图片称之为纹理图册。Sprite动画

前面我们已经讲了Sprite动画了，也了解Sprite动画了，本章我们直接使用Sprite动画配合纹理图册来使用。步骤：创建一个工程纹理图册和熊一个简单的动画在屏幕上让熊移动创建好一个工程架子——选择File\NewProject…，在iOSApplication中选择SpriteKitGame如下图选择Next，并将工程命名为AnimatedBear，把ClassPrefix中的内容清除掉，并将Devices选择为iPad，然后保存在磁盘中，如下图所示Sprite动画Sprite动画准备熊图片使用Xcode会自动的生成这个纹理图集文件，并指定好每个sprite的边界范围，这样当在代码中需要用到某个sprite的时候，可以方便取出来。这一切都会自动处理，开发者不用亲力为之。为纹理图集创建一个文件夹，并将图片文件放置到该文件夹中，然后在文件夹名称尾部添加.atlas。这样Xcode就能识别出.atlas扩展名，进而自动的将图片合并为一个纹理图集。之前下载的图片资源中有一个名为BearImages.atlas的文件夹，里面包含了各种分辨率的图片(是其它两个文件夹中的图片合集)。将名为BearImages.atlas的文件夹拖拽到程序中，如下图所示：Sprite动画当释放鼠标时，会看到如下图片中的对话框：是关于如何添加到工程中的。确保选中这三项：Copyitemsintodestinationgroup’sfolder,

Creategroupsforanyaddedfolder,和

theAnimatedBear，然后点击Finish：Sprite动画在Xcode中展开这个文件夹BearImages.atlas，会看到如下内容：Sprite动画一个简单的动画这里我们先把熊显示在屏幕中间，并开启永久循环动画。主要代码：#import<AVFoundation/AVFoundation.h>#import"MyScene.h”@implementationMyScene{SKSpriteNode*_bear;NSArray*_bearWalkingFrames;}-(id)initWithSize:(CGSize)size{if(self=[superinitWithSize:size]){

/*Setupyourscenehere*/self.backgroundColor=[SKColorblackColor];

//TODO…}returnself;}-(void)update:(CFTimeInterval)currentTime{

/*Calledbeforeeachframeisrendered*/}@endSprite动画要让熊动起来，有5步需要处理1.构建一个用于保存行走帧(walkingframe)NSMutableArray*walkFrames=[NSMutableArrayarray];2.加载纹理图集SKTextureAtlas*bearAnimatedAtlas=[SKTextureAtlasatlasNamed:@"BearImages"];3.构建帧列表intnumImages=bearAnimatedAtlas.textureNames.count;for(inti=1;i<=numImages/2;i++){NSString*textureName=[NSStringstringWithFormat:@"bear%d",i];SKTexture*temp=[bearAnimatedAtlastextureNamed:textureName];[walkFramesaddObject:temp];}_bearWalkingFrames=walkFrames;Sprite动画4.创建sprite，并将其位置设置为屏幕中间，然后将其添加到场景中SKTexture*temp=_bearWalkingFrames[0];_bear=[SKSpriteNodespriteNodeWithTexture:temp];_bear.position=CGPointMake(CGRectGetMidX(self.frame),CGRectGetMidY(self.frame));[selfaddChild:_bear];[selfwalkingBear];5在initWithSize方法后面添加一个新的方法walkingBear-(void)walkingBear{

//ThisisourgeneralrunActionmethodtomakeourbearwalk.[_bearrunAction:[SKActionrepeatActionForever:[SKActionanimateWithTextures:_bearWalkingFramestimePerFrame:0.1fresize:NOrestore:YES]]withKey:@"walkingInPlaceBear"];return;}Sprite动画运行效果如下：动起来的熊，本案例附有源码。粒子系统什么是粒子系统？粒子系统是指简单的应用模拟简单的流体系统，例如喷水效果和火箭排气火焰的效果称粒子系统。粒子系统的随机数粒子系统的一个重要特征就是每一颗粒子都有自己独特的属性。换句话说，每颗粒子都应该有稍微不同的速度向量和稍微不同的生命周期。正是因为这种多样性，才使得粒子系统带有一定的有机特性。粒子系统的随机数方法：staticinlineCGFloatBBRandomFloat(BBRangerange){//returnarandomfloatintherangeCGFloatrandPercent=((CGFloat)(random()%10001))/10000.0;CGFloatoffset=randPercent*range.length;returnoffset+range.start;}粒子粒子系统由两个主要组件组成:粒子控制器(通常称为发射器(emitter))与粒子本身。发射器不断地产生新粒子，并且把粒子添加到系统中，我们还需要知道何时应该将粒子移出系统。为了实现这一点，需要知道一颗粒子应该在系统中持续的时间，我们将这段时间称为粒子的生命。粒子对象是一个非常简单的对象，它包含一些状态，而且在每一次更新之后它能够根据位置移动自己，然后减少自己的生命。更高级的粒子系统可能包含数十个不同的变化状态。以下是本章中粒子定义代码

粒子@interfaceBBParticle:NSObject{BBPointposition;BBPointvelocity;CGFloatlife;CGFloatdecay;CGFloatsize;CGFloatgrow;}@implementationBBParticle@synthesizeposition,velocity,life,decay,size,grow;-(void)update{position.x+=velocity.x;position.y+=velocity.y;position.z+=velocity.z;life-=decay;size+=grow;if(size<0.0)size