【cocos2d】BeeClusterにTwitterボタンをつけてハイスコアをツイート

BeeClusterにツイートボタンを付けてツイッターでハイスコアをつぶやけるようにしてみました。

追記：この方法でツイッターボタンのレスポンスが遅いと感じた方は「【BeeCluster】一瞬「うっ」となるTwitterボタンのレスポンスを改善」もご覧下さい。

全面的にこのサイトを参考にさせていただきました。情報ありがとうございます。

ツイッター機能を使うためにはまずフレームワークを追加します。

1. 左上のプロジェクトBeeClusterをクリック
2. ターゲットBeeClusterをクリック
3. Build Phasesをクリック
4. Link Binary With Librariesの三角をクリック
5. "+"ボタンをクリック
6. ポップアップウィンドウからTwitter.frameworkを選択
7. Addをクリック
f:id:takujidev:20130804174813j:plain

Twitter.frameworkが追加されるのでFrameworksフォルダーに移動します。

タイトル画面にツイートボタンを追加してツイートできるようにします。
ツイートボタンは勝手に作らずにTwitter社のガイドラインに従いオフィシャル素材を使用します。
「Twitter社について / ロゴとブランド」のページよりロゴデータをダウンロードしました。
ダウンロードした素材のファイル名に"-hd"を追加してRetina用データとして使用します。
また、非Retina用には50%に縮小したファイルを用意し、それぞれプロジェクトに追加します。

処理はこんな感じです。

1. Twitter/Twitter.hをインポートします。

2. ツイッターボタン用のCCSpriteとツイッターウィンドウ用のUIViewコントローラー用のインスタンス変数を用意します。

onEnter
3. 初期化処理（このプログラムの場合はonEnterでやっていますが、通常はinitあたりになると思います)でボタンのオブジェクトを生成します。ボタンをself(このプログラムの場合はタイトル画面のCCLayer)にaddChildし、位置と大きさを適当に調整。
4. ビューコントローラーのオブジェクトを生成
5. canSendTweetクラスメソッドを使いツイッターを使えるどうかチェック。使えない場合はボタンを透明にする。iPhoneでツイッターのアカウントの設定をしていないときはcanSendTweetメソッドはNOを返します。

ccTouchesBegan
6. タップの位置がボタン上の場合、再びツイート可能かどうかチェックします。
7. ツイート可能な場合は、TWTweetComposeViewControllerのオブジェクトを生成します。
8. setInitialTextメソッドで初期メッセージとハイスコアをテキストとして設定
9. addURLメソッドでAppStoreのアドレスを追加
10. completionHandlerプロパティに書き込み終了時の処理を設定。
ユーザーがツイートを送るかキャンセルしたタイミングでこのブロックが呼ばれます。TWTweetComposeViewControllerResult型の引数resultに送信したかキャンセルしたかの情報が入りますが、今回は個別の処理はしていません。
このブロックは[_viewController dismissViewControllerAnimated:YES completion:nil];でツイッターの画面を閉じるのが主な仕事です。
11. [[[CCDirector sharedDirector] view] addSubview:_viewController.view];
cocos2dのCCDirectorにUIViewを追加します。参考にしたサイトではsharedDirectorのあとがopenGLViewになっていましたがそれは古い書き方で、今はviewとするようです。
12. [_viewController presentViewController:tweetViewController animated:YES completion:nil];
ツイッターの画面をアニメーション表示します。

関連部分のソースを抜き出しました

#import <Twitter/Twitter.h>

@implementation TitleScene
{
    CCSprite* _tweetButton;
    UIViewController* _viewController;
}

- (void)onEnter
{
    [super onEnter];

    CGSize size = [CCDirector sharedDirector].winSize;

    _tweetButton = [CCSprite spriteWithFile:@"twitter-bird-dark-bgs.png"];
    [self addChild:_tweetButton];
    _tweetButton.position = ccp(size.width/2.0 - 110, 130);
    _tweetButton.scale = 0.4;
    _viewController = [[UIViewController alloc] init];
    
    // ツイッターが使えない状態ならボタンを透明にする
    if (![TWTweetComposeViewController canSendTweet]) {
        _tweetButton.opacity = 0;
    }
    
}

#define TOUCH_CIRCLE 40

- (void)ccTouchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
{
    UITouch *myTouch = [touches anyObject];
    CGPoint location = [myTouch locationInView:[myTouch view]];
    location = [[CCDirector sharedDirector] convertToGL:location];
    float distanceTweet = ccpDistance(_tweetButton.position, location);
    
    if (distanceTweet < TOUCH_CIRCLE) {          // ツイートボタンが押されたとき
        if ([TWTweetComposeViewController canSendTweet]) { // ツイート可能かチェック
            TWTweetComposeViewController* tweetViewController = [[TWTweetComposeViewController alloc] init];
            int score = [InfoLayer sharedInfo].highScore;
            [tweetViewController setInitialText:[NSString stringWithFormat:@"BeeCluster: high score - %d ! ", score]];
            [tweetViewController addURL:[NSURL URLWithString:@"https://itunes.apple.com/jp/app/beecluster/id663801586?mt=8&ls=1"]];
            
            // completion handlerの設定、書き込み終了時にこのブロックが呼ばれる。
            // TWTweetComposeViewControllerResult型の引数が渡される。
            // 引数の内容に関わらずツイッター画面を閉じる
            tweetViewController.completionHandler = ^(TWTweetComposeViewControllerResult result) {
                 // 書き込み完了かキャンセルか引数を見ると判別できる
                if (result == TWTweetComposeViewControllerResultDone) {
                    // 今後完了時の処理を分けるときはここへ
                } else if (result == TWTweetComposeViewControllerResultCancelled){
                    // 今後キャンセル時の処理を分けるときはここへ
                }
                [_viewController dismissViewControllerAnimated:YES completion:nil]; //ツイート画面を閉じる
            };
            
            [[[CCDirector sharedDirector] view] addSubview:_viewController.view];
            // ツイッター画面を表示
            [_viewController presentViewController:tweetViewController animated:YES completion:nil];
        } else {
            // ツイートできない時(アカウントの設定がないとき）は何もしない
        }
    }
}

@end