第八章：圖冊、Sprite和粒子系統(tǒng)

第八章：圖冊、Sprite和粒子系統(tǒng)中銳教育研究院學(xué)習(xí)目標(biāo)紋理和紋理圖冊Sprite動畫粒子系統(tǒng)給游戲帶來了生機(jī)什么是紋理？紋理是指將拍攝一副圖像把它應(yīng)用于一個(gè)多邊形的時(shí)候，我們通常將這幅圖像稱為紋理。為什么要使用紋理？在OpenGL應(yīng)用程序中，使用OpenGl可以特別高效地將紋理繪制在多邊形上，這樣可以提高速度，同時(shí)也能夠節(jié)約內(nèi)存的消耗。什么是紋理映射？在建模時(shí)為每個(gè)頂點(diǎn)都定義紋理坐標(biāo)(s,t)，

s和t取值都在[0,1]。這樣可得到每個(gè)頂點(diǎn)對應(yīng)的紋理像素顏色。OpenGL紋理在程序中要使用OpenGL紋理，大概分以下步驟：創(chuàng)建紋理對象，并為它指定一個(gè)紋理。確定紋理如何應(yīng)用到每個(gè)像素上。啟用紋理貼圖。繪制場景，提供紋理和幾何坐標(biāo)由于我們提供的紋理圖像很少能和最終的屏幕坐標(biāo)形成對應(yīng),大小不同,所以需要設(shè)置過濾項(xiàng)目.允許我們進(jìn)行插值或者勻和,指定放大縮小的函數(shù).glTexParameter*(),使用過濾模式GL_NEAREST那么紋理單位最鄰近的將被使用,GL_LINEAR那么就用2*2的包含紋理數(shù)據(jù)的數(shù)組加權(quán)組作為紋理;紋理對象命名紋理對象一般采用：

glGenTexures(GLSizen,Gluint*textureNames);分析：n為產(chǎn)生n個(gè)未使用的對象值,textureNames為紋理名字?jǐn)?shù)組,你可能有幾個(gè)紋理需要使用,這個(gè)數(shù)組來區(qū)分.假如要載入圖片得時(shí)候紋理定義為：voidglTexImage2D(GLenumtarget,GLintlevel,GLintcomponents,GLsizeiwidth,GLsizeiheight,GLintborder,GLenumformat,GLenumtype,constGLvoid*pixels);分析：定義一個(gè)二維紋理映射。target是常數(shù)GL_TEXTURE_2D,level表示多級分辨率的紋理圖象的級數(shù)。若只有一種分辨率，level為0。components是從1到4的整數(shù)，1：選擇R；2：選擇RA；3：選擇RGB；綁定紋理對象在某個(gè)程序中使用紋理得時(shí)候，必須通知渲染器啟用紋理功能的這個(gè)過程稱為綁定紋理。綁定方法：glBindTexture(Glenumtarget,Gluint,glTexImage*)；注：將把數(shù)據(jù)存儲到這個(gè)紋理對象中,如果需要紋理圖像的顏色和物體表面的顏色進(jìn)行組合,不是直接貼圖,那么就需要glTexEvn*()函數(shù).確定紋理坐標(biāo)獲取紋理坐標(biāo)，通過以下方法獲取。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);

//

創(chuàng)建紋理對象，

glBindTexture(GL_TEXTURE_2D,m_textureObjectOne);

//

綁定紋理對象

//

設(shè)定縮放器的過濾參數(shù)

glTexParameteri(GL_TEXTURE_2D,GL_TEXTURE_MAG_FILTER,GL_LINEAR);

glTexParameteri(GL_TEXTURE_2D,GL_TEXTURE_MIN_FILTER,GL_LINEAR);

//

為紋理對象指定紋理圖像數(shù)據(jù)

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

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

m_textureOne->GetImage());簡單的紋理示例

//

創(chuàng)建第二個(gè)紋理對象

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());

//

初始化運(yùn)動變量

m_zPos=-0.5f;

m_zMoveNegative=

true;

return

true;} 簡單的紋理示例上述init()函數(shù)中，我們先啟用

2D

紋理(

glEnable()

),

然后加載圖像到

CTargaImage

類中，然后通過glGenTextures()獲得一個(gè)未被使用的紋理對象，繼而綁定，指定縮放器的過濾模式，最后為紋理指定圖像數(shù)據(jù)（通過

glTexImage2D()

).

然后同樣的流程創(chuàng)建了第二個(gè)紋理對象，

使用了同樣的紋理圖像數(shù)據(jù)。只是縮放器的過濾參數(shù)做了下更改。紋理圖冊

什么樣的圖冊稱為紋理圖冊呢？請看下圖捕魚達(dá)人游戲界面。上圖這一張張小的圖片擠在一張大圖片上，這中大的png圖片稱之為紋理圖冊。Sprite動畫

前面我們已經(jīng)講了Sprite動畫了，也了解Sprite動畫了，本章我們直接使用Sprite動畫配合紋理圖冊來使用。步驟：創(chuàng)建一個(gè)工程紋理圖冊和熊一個(gè)簡單的動畫在屏幕上讓熊移動創(chuàng)建好一個(gè)工程架子——選擇File\NewProject…，在iOSApplication中選擇SpriteKitGame如下圖選擇Next，并將工程命名為AnimatedBear，把ClassPrefix中的內(nèi)容清除掉，并將Devices選擇為iPad，然后保存在磁盤中，如下圖所示Sprite動畫Sprite動畫準(zhǔn)備熊圖片使用Xcode會自動的生成這個(gè)紋理圖集文件，并指定好每個(gè)sprite的邊界范圍，這樣當(dāng)在代碼中需要用到某個(gè)sprite的時(shí)候，可以方便取出來。這一切都會自動處理，開發(fā)者不用親力為之。為紋理圖集創(chuàng)建一個(gè)文件夾，并將圖片文件放置到該文件夾中，然后在文件夾名稱尾部添加.atlas。這樣Xcode就能識別出.atlas擴(kuò)展名，進(jìn)而自動的將圖片合并為一個(gè)紋理圖集。之前下載的圖片資源中有一個(gè)名為BearImages.atlas的文件夾，里面包含了各種分辨率的圖片(是其它兩個(gè)文件夾中的圖片合集)。將名為BearImages.atlas的文件夾拖拽到程序中，如下圖所示：Sprite動畫當(dāng)釋放鼠標(biāo)時(shí)，會看到如下圖片中的對話框：是關(guān)于如何添加到工程中的。確保選中這三項(xiàng)：Copyitemsintodestinationgroup’sfolder,

Creategroupsforanyaddedfolder,和

theAnimatedBear，然后點(diǎn)擊Finish：Sprite動畫在Xcode中展開這個(gè)文件夾BearImages.atlas，會看到如下內(nèi)容：Sprite動畫一個(gè)簡單的動畫這里我們先把熊顯示在屏幕中間，并開啟永久循環(huán)動畫。主要代碼：#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.構(gòu)建一個(gè)用于保存行走幀(walkingframe)NSMutableArray*walkFrames=[NSMutableArrayarray];2.加載紋理圖集SKTextureAtlas*bearAnimatedAtlas=[SKTextureAtlasatlasNamed:@"BearImages"];3.構(gòu)建幀列表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.創(chuàng)建sprite，并將其位置設(shè)置為屏幕中間，然后將其添加到場景中SKTexture*temp=_bearWalkingFrames[0];_bear=[SKSpriteNodespriteNodeWithTexture:temp];_bear.position=CGPointMake(CGRectGetMidX(self.frame),CGRectGetMidY(self.frame));[selfaddChild:_bear];[selfwalkingBear];5在initWithSize方法后面添加一個(gè)新的方法walkingBear-(void)walkingBear{

//ThisisourgeneralrunActionmethodtomakeourbearwalk.[_bearrunAction:[SKActionrepeatActionForever:[SKActionanimateWithTextures:_bearWalkingFramestimePerFrame:0.1fresize:NOrestore:YES]]withKey:@"walkingInPlaceBear"];return;}Sprite動畫運(yùn)行效果如下：動起來的熊，本案例附有源碼。粒子系統(tǒng)什么是粒子系統(tǒng)？粒子系統(tǒng)是指簡單的應(yīng)用模擬簡單的流體系統(tǒng)，例如噴水效果和火箭排氣火焰的效果稱粒子系統(tǒng)。粒子系統(tǒng)的隨機(jī)數(shù)粒子系統(tǒng)的一個(gè)重要特征就是每一顆粒子都有自己獨(dú)特的屬性。換句話說，每顆粒子都應(yīng)該有稍微不同的速度向量和稍微不同的生命周期。正是因?yàn)檫@種多樣性，才使得粒子系統(tǒng)帶有一定的有機(jī)特性。粒子系統(tǒng)的隨機(jī)數(shù)方法：staticinlineCGFloatBBRandomFloat(BBRangerange){//returnarandomfloatintherangeCGFloatrandPercent=((CGFloat)(random()%10001))/10000.0;CGFloatoffset=randPercent*range.length;returnoffset+range.start;}粒子粒子系統(tǒng)由兩個(gè)主要組件組成:粒子控制器(通常稱為發(fā)射器(emitter))與粒子本身。發(fā)射器不斷地產(chǎn)生新粒子，并且把粒子添加到系統(tǒng)中，我們還需要知道何時(shí)應(yīng)該將粒子移出系統(tǒng)。為了實(shí)現(xiàn)這一點(diǎn)，需要知道一顆粒子應(yīng)該在系統(tǒng)中持續(xù)的時(shí)間，我們將這段時(shí)間稱為粒子的生命。粒子對象是一個(gè)非常簡單的對象，它包含一些狀態(tài)，而且在每一次更新之后它能夠根據(jù)位置移動自己，然后減少自己的生命。更高級的粒子系統(tǒng)可能包含數(shù)十個(gè)不同的變化狀態(tài)。以下是本章中粒子定義代碼

粒子@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