今天Himi單用一篇博文來給童鞋們介紹精靈相關的兩個常用的細節知識點；
首先來介紹第一個知識點：精靈可視區域；
不管在哪個移動平台上進行開發遊戲都會接觸使用到可視區域，比如Kjava（J2me）平台的setClip方法，Android的clipRect方法等等，那麼在iOS上也一樣存在，這裡我們介紹cocos2d引擎中的可視區域得函數是setTextureRect；
可能沒有接觸過遊戲得童鞋不明白其概念，那麼Himi就簡單概述下：
所謂可視區域就是在一個完整的表面上對其設定一定大小的區域，讓其隻顯示設定的區域的面，其他部分隐藏不顯示出來；最常用的是将一張圖檔設定一個可視區域，隻讓這張圖展示設定的區域；
那麼這裡在啰嗦幾句，在cocos2d中精靈CCSprite的可視區域一般可以通過兩種方式來設定：
1.在建立精靈的時候進行設定；2.在建立後進行設定；舉例如下：
建立一個cocos2d項目，然後在HelloWorldLayer.m中init方法中建立一個精靈，代碼如下：
//---正常建立的icon圖
CCSprite * spriteOld =[CCSprite spriteWithFile:@"icon.png"];
spriteOld.position=ccp(80,100);
[self addChild:spriteOld];
//---建立時設定30寬30高的可視區域
CCSprite * spriteNew =[CCSprite spriteWithFile:@"icon.png" rect:CGRectMake(0, 0, 30,30)];
spriteNew.position=ccp(150,100);
[self addChild:spriteNew];
//---建立後對其設定30寬30高的可視區域
CCSprite * spriteT =[CCSprite spriteWithFile:@"icon.png"];
[spriteT setTextureRect:CGRectMake(10, 10, 30, 30)];
spriteT.position=ccp(230,100);
[self addChild:spriteT];
上面我建立了3個精靈，第一個沒有設定可是區域的icon精靈，第二個和第三個是設定了可視區域寬30高30的精靈，但是第二個和第三個精靈的可是區域寬高相同，但是起始點不同；而且第二個是從建立精靈的時候設定可視區域，第三個精靈則是建立精靈後進行設定的，設定的地方不一樣，功能是一樣的；
需要詳細講解的是不管用以上兩種設定可視區域的哪種方法都需要傳入一個CGRect對象，這個CGrect參數有四個，坐标x，y，以及寬高w，y；
那麼CGRect在可是區域的函數中的作用如下：
CGRect的x，y表示從這個精靈貼圖的（x，y）坐标開始設定可視區域，（w，h）可視區域的大小；
下面是運作效果圖，童鞋們通過三個精靈（從左往右）之間的對比就很容易明白的：
<a target="_blank" href="http://blog.51cto.com/attachment/201110/001537605.png"></a>
下面介紹第二個知識點：精靈錨點（anchorPoint）；
渲染錨點的作用就是在渲染圖檔的時候确定其渲染的方式，一般常用的錨點有以下幾種：
圖檔左上角、圖檔右上角、圖檔中心點、圖檔左下角、圖檔右下角等等
首先童鞋們需要知道一點，在cocos2d引擎中在layer中添加渲染精靈貼圖的時候預設的錨點是其中心點；
那麼由于cocos2d中layer的原點（0，0）點是螢幕的左下角，是以如果預設建立一個精靈添加到layer中的話，是精靈的中心點放置在layer的原點上，即精靈圖檔顯示在螢幕中隻是精靈的寬一半高一半，如下圖：
<a target="_blank" href="http://blog.51cto.com/attachment/201110/001555987.png"></a>
對應代碼如下：
//---使用預設錨點
CCSprite * spriteOld =[CCSprite spriteWithFile:@"icon.png"];
那麼如果我們設定其精靈的錨點為左下角則正好将精靈icon完整顯示出來，因為精靈的左下角正好與layer的原點重合，如下圖：
<a target="_blank" href="http://blog.51cto.com/attachment/201110/001624610.png"></a>
view plain
//---設定精靈錨點為左下角
CCSprite * spriteNew =[CCSprite spriteWithFile:@"icon.png"];
spriteNew.anchorPoint=ccp(0,0);
設定的方法是精靈的anchorPoint屬性，指派的是個CGPoint對象，其CGPoint中的x與y最大取1，表示最右與最下；
---------以上介紹的過于簡單，那麼下面Himi利用可視區域與錨點的特性制作一種從左往右樣式簡單進度條；
首先我們仍然使用cocos2d的icon圖作為一個進度條，然後讓其從左往右不斷顯示出來；步驟如下：
第一步:建立一個精靈，設定精靈的錨點為x=0（最左側），y=0.5（精靈的y軸中點），代碼如下：
CCSprite * spriteP =[CCSprite spriteWithFile:@"icon.png"];
spriteP.position=ccp(size.width*0.5,size.height*0.5);//設定坐标
spriteP.anchorPoint=ccp(0,0.5);//設定錨點
[self addChild:spriteP z:0 tag:88]; //将精靈添加到layer中顯示
細心的童鞋可能會發現以上代碼運作後發現精靈并不顯示在螢幕中點，嗯，因為我們設定了精靈的錨點，現在精靈的左下角與螢幕中點重合着；
第二步：添加一個變量用于記錄目前進度：
@interface HelloWorldLayer : CCLayer
{
float currentShowRect;//目前可視區域的大小
}
然後開啟一個重新整理函數：
-(id) init
[self scheduleUpdate];
-(void)update:(ccTime)himi{//每一幀都會執行的函數
最後一步：在重新整理函數中書寫從左往右慢慢顯示icon進度條邏輯代碼，代碼如下：
//實作進度條邏輯
CCSprite *sprite =(CCSprite*)[self getChildByTag:88];
currentShowRect++;
if(currentShowRect>=100){
currentShowRect=0;
}
[sprite setTextureRect:CGRectMake(0, 0, currentShowRect,sprite.position.y)];
運作截圖如下：(icon顯示區域越來越大，不斷循環)
<a target="_blank" href="http://blog.51cto.com/attachment/201110/001655540.png"></a>
OK，本篇介紹完畢，可能童鞋們會認為本篇知識點過于簡單，如果你是個經常關注Himi部落格的童鞋，那麼你會發現Himi基本上所有的博文都是介紹了很多細節方面的問題，原因一，千篇一律的文章太多，别人都寫那麼多了，我也沒必要贅述。原因二，Himi常說的，細節決定一切，雖然說得絕對了些，但是事實開發項目中基本都是細節問題困擾着大家；
好了，不多說了，繼續忙了；
本文轉自 xiaominghimi 51CTO部落格，原文連結：http://blog.51cto.com/xiaominghimi/699414，如需轉載請自行聯系原作者
![iOS APP送出上架最新流程[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)