【cocos2d】処理待ち時間にグルグル回るやつを表示する機能を実装

GameCenter機能やIn App Purchase機能など、サーバーとやり取りする機能を付け始めると、サーバーからのレスポンス待ちの間にLoading...とかPlease Wait...などと表示しつつ何か画面内で動かす事でユーザーを安心させる必要が出てきます。

今回はcocos2dの画面にグルグル回るやつとメッセージを表示し、画面全体を暗くする機能を実装しました。

そうです。UIKitのUIActivityIndicatorViewみたいなこういうグルグル回るやつが表示される画面です。

cocos2dでの実装は超簡単です。
CCLayerColorで半透明の黒のレイヤーを作りそこにグルグルのスプライトとラベルを乗せ、スプライトをscheduleで回しているだけです。

ヘッダファイル

#import <Foundation/Foundation.h>
#import "cocos2d.h"

@interface TSActivityIndicator : CCLayerColor {
    
}

- (id)initWithMessage:(NSString *)message;

@end

実装ファイル

#import "TSActivityIndicator.h"

@implementation TSActivityIndicator {
    CCSprite* _indicator;
}

- (id)init{
    return [self initWithMessage:@""];
}

- (id)initWithMessage:(NSString *)message
{
    if ((self = [super initWithColor:ccc4(0, 0, 0, 128)])) {
        CGSize winSize = [CCDirector sharedDirector].winSize;
        CGFloat centerX = winSize.width/2.0;
        CGFloat centerY = winSize.height/2.0;
        _indicator = [CCSprite spriteWithFile:@"indicator.png"];
        CCLabelTTF* messageLabel = [CCLabelTTF labelWithString:message fontName:@"Arial" fontSize:20];
        _indicator.position = ccp(centerX, centerY);
        messageLabel.position = ccp(centerX, centerY - _indicator.contentSize.height);
        [self addChild:_indicator];
        [self addChild:messageLabel];
        [self schedule:@selector(update:) interval:0.1];
        
    }
    return self;
}

- (void)update:(ccTime)delta
{
    _indicator.rotation += 360.0/12.0;
}

使う側では、インスタンス変数を一つ用意しておいて、時間のかかる処理の前にTSActivityIndicatorインスタンスをalloc、メッセージを表示したいときはinitWithMessageで初期化、メッセージがいらないときはinitで初期化し、addChildします。
サーバーからのメッセージが帰ってきたときの処理でremoveChildしてインスタンス変数にnilを入れます。
グルグルインジケーターのpngファイルを下に貼っておきますので、良ければ使ってください。
なお、保存したpngファイルはindicator.pngとリネームしてください。

https://itunes.apple.com/jp/app/travelshooting-jp-toraberushutingu/id917570972?mt=8&uo=4&at=10laCt