Cocos 2d 遊戲進度條

2021-06-19 18:35:53 字數 3228 閱讀 3040

遊戲開發中難免用到進度條,例如做一些遊戲技能的cd時間等都會使用到;那麼cocos2d當然也封裝了進度條,但是不太理想,如果童鞋們用過就應該知道,那麼今天介紹兩個知識點,第一:介紹cocos2d中的進度條ccprogresstimer如何使用;第二點:修改cocos2d封裝的ccprogresstimer原始碼,實現「理想」形式的進度條;

ok,首先來學習下如何在cocos2d中使用ccprogresstimer進度條:

在cocos2d中使用進度條很簡單,建立進度條並新增到當前layer的**如下,童鞋們一看就懂:

1

2

3

ccprogresstimer *ct=[ccprogresstimer progresswithfile:@"icon.png"];

ct.position=ccp( size.width /2 , size.height/2);

[self addchild:ct z:0 tag:90];

很簡單的建立,那麼如果急躁的童鞋們只是到這裡就立刻run你的專案,那麼肯定看不到進度條,不用擔心,看不到就對了;

進度條它在cocos2d封裝的時候,預設有乙個最大進度值 100,最小 0,那麼你建立的時候預設的當前進度是0,所以是看不到的;

下面來看兩個進度條比較重要的兩個屬性:

1

2

ct.percentage = 0;//當前進度

ct.type=kccprogresstimertypehorizontalbarlr;//進度條的顯示樣式

percentage 指的是當前進度條的進度值,那麼想讓乙個進度條正常顯示出來,那麼需要percentage!=0才行,一般都會在乙個不斷重新整理的函式中讓其進度條不斷++,進而實現其進度條功能;

這裡我就簡單寫下**:

1.首先在init函式中,新增  :[self scheduleupdate];

2. 然後新增如下函式即可:(這個函式中就是讓當前進度不斷++,大等於100就還原當前進度值為0,讓其迴圈)

1

2

3

4

5

6

7

-(void)update:(cctime)himi

}

type屬性也是很容易理解的,就是進度條的型別,在cocos2d中封裝了以下6種顯示方式:

1

2

3

4

5

6

kccprogresstimertyperadialccw,         扇形逆時針形式

kccprogresstimertyperadialcw,          扇形順時針形式

kccprogresstimertypehorizontalbarlr,   從左往右增張的形式

kccprogresstimertypehorizontalbarrl,   從右往左增張的形式

kccprogresstimertypeverticalbarbt,     從下往上增張的形式

kccprogresstimertypeverticalbartb,     從上往下增張的形式

為了讓童鞋們更清楚今天要講的第二點知識,所以這裡我將這些形式截圖出來,大家先看下:

kccprogresstimertyperadialccw 與 kccprogresstimertyperadialcw的樣式如下圖:

kccprogresstimertypehorizontalbarlr 與  kccprogresstimertypehorizontalbarrl 的樣式如下圖:

kccprogresstimertypeverticalbarbt 與 kccprogresstimertypeverticalbartb   的樣式如下圖:

ok,簡單的介紹了進度條的使用和樣式後,那麼請各位童鞋用10秒時間仔細觀察3類樣式!!!

童鞋們可能已經看出了一些端倪,這裡假設我們有乙個技能需要做成有cd時間的,那麼如果我們採用進度條,那麼這個進度條需要一張,我們一般會使用陰影作為進度表示cd時間進而顯示,如下圖:(我將一張半透明的灰色圖作為進度條,下面的cocos2d的icon當成技能!這裡進度條的樣式選擇從下往上的形式)

大家仔細觀察,進度條(灰色塊)逆時針增加,等到了最大進度值100的時候正好黑色塊會將技能(icon圖)給遮擋住……悲劇啊,這哪是技能cd啊,反了吧!!!!

一般技能cd時間過後應該正好將技能icon全部露出來,也就是說正確的應該是進度條在0進度的時候正好全部遮擋技能icon,當當前進度為最大100的時候正好這個遮擋的灰色塊應該正好沒有,這樣才對啊,這正好反了。。。。。

最簡單的解決方式就是將進度條的當前進度值初始化設定100,然後不斷減少就好了;

當然啦,himi 索性去cocos2d裡對ccprogresstimer原始碼進行了修改:

首先進入 cocos2d的ccprogresstimer.m 原始碼中,然後搜尋以下**:

1

floatalpha = percentage_ / 100.f;

然後再其下方新增如下**:

1

2

3

4

if(alpha != 0.f && alpha !=1.f)

然後直接執行專案,截圖如下:

這才是對的啊,當進度條的當前進度是0的時候正好覆蓋技能icon,當進度條的當前進度值最大100的時候正好將技能icon全部展漏了出來;這個才是正確的技能cd!

cocos2d實現語音 Cocos2d 聲音API

param url 聲音路徑 cc.audioengine.playmusic url loop 停止背景 param releasedata 是否釋放聲音資料,預設為false cc.audioengine.stopmusic releasedata 暫停背景 cc.audioengine.pau...

cocos2如何使用進度條

1 建立進度條物件 精靈背景 ccsprite progsprite ccsprite spritewithfile achieveplash.png 初始化進度條 ccprogresstimer prog ccprogresstimer progresswithsprite progsprite ...

搭建cocos2d遊戲引擎環境

ios遊戲開發引擎,常用的cocos2d,unity引擎。unity是收費的,cocos2d是免費開源的。cocos2d引擎開發環境的搭建 step3.啟動終端,進入cocos2d for iphone解壓後的目錄,執行.install templates.sh u 命令 開始安裝cocos2d 如...