cocos2dアプリにTweet機能を実装する

Morve 1.1.0ではステージクリア時にTweetする機能を追加しました。
この機能はiOS5のTwitter Frameworkを利用して実装しています。

最近、AppBankさんのTwitterアプリの作り方を紹介する記事が人気なので、
今回は便乗して、cocos2dアプリにTweet機能を実装する方法を紹介します。


Twitter Frameworkとは

iOS5から追加されたTwitter Frameworkを使うと、
アプリからTwitterを非常に簡単に利用することができます。

Twitter Framework公式ページによると、主な特徴は3つ。

  • シングルサインオン
    ユーザがアプリによるTwitterへのアクセスを一度許可したら、
    あとは面倒なログイン手続きは必要ありません。
  • シンプルなTweetシート
    TWTweetComposeViewControllerを利用すると、
    Twitter投稿画面が簡単に作成できます。
  • パーソナライゼーション
    GPSやタイムラインの情報から、
    即座のパーソナライゼーションを可能にします。

オフィシャルのサンプルコードはこちら


基本機能を実装する

  1. XcodeプロジェクトにTwitter Frameworkを追加する
    Project>Target>Build Phases>Link Binary With Libraries
    の「+」ボタンから「Twitter.framework」を追加します。
  2. ヘッダファイルをインポートする
    #import <Twitter/Twitter.h>
    
  3. Tweet機能を実装する
    まず、Twitterが利用可能な状態※であることを確認します。
    ※Twitterにアクセス可能、かつ、1つ以上のアカウントが設定済である状態

        if ([TWTweetComposeViewController canSendTweet]){
            // Tweet機能をここに実装する
        }else{
            // Twitterが利用できない場合
        }
    

    次に、【Tweet機能をここに実装する】部分に、
    Tweet用ビューコントローラを宣言します。

            TWTweetComposeViewController *tweetViewController = [[TWTweetComposeViewController alloc] init];
    

    デフォルトのTweet文言を設定します。

            [tweetViewController setInitialText:@"Hello. This is a tweet."];
    

    “Send”した場合と”Cancel”した場合のハンドリングが必要な場合は実装します。

            tweetViewController.completionHandler = ^(TWTweetComposeViewControllerResult result) {
                if(result == TWTweetComposeViewControllerResultDone) {
                    // "送信"した場合
                } else if(result == TWTweetComposeViewControllerResultCancelled) {
                    // "キャンセルした場合"
                }
                [viewController dismissViewControllerAnimated:YES completion:nil];
            };
    

    Tweetシート(Tweet投稿画面のこと)を表示します。
    今回はcocos2dを利用したアプリなので、
    CCDirectorのopenGLViewにTweetシートを乗せるのがキモです。
    ちなみに”viewController”はあらかじめインスタンス変数として定義しておきます。

            [[[CCDirector sharedDirector] openGLView] addSubview:viewController.view];
            [viewController presentViewController:tweetViewController animated:YES completion:nil];
    

    完成したソースコードは下記。

        if ([TWTweetComposeViewController canSendTweet]){
            TWTweetComposeViewController *tweetViewController = [[TWTweetComposeViewController alloc] init];
    
            [tweetViewController setInitialText:@"Hello. This is a tweet."];
    
            tweetViewController.completionHandler = ^(TWTweetComposeViewControllerResult result) {
                if(result == TWTweetComposeViewControllerResultDone) {
                    // "送信"した場合
                } else if(result == TWTweetComposeViewControllerResultCancelled) {
                    // "キャンセル"した場合
                }
                [viewController dismissViewControllerAnimated:YES completion:nil];
            };
    
            [[[CCDirector sharedDirector] openGLView] addSubview:viewController.view];
            [viewController presentViewController:tweetViewController animated:YES completion:nil];
    
        }else{
            // Twitterが利用できない場合
        }
    

とても短いコードで簡単に実装できます。
生で書くときのxAuthの申請やら何やらの煩雑な手順が一切ないのは感動的です。


オプション機能を実装する

TweetにURLを追加します。

        [tweetViewController addURL:url];

Tweetに画像を追加します。

        [tweetViewController addImage:image];

Tweetから全てのURLを削除します。

        [tweetViewController removeAllURLs];

Tweetから全ての画像を削除します。

        [tweetViewController removeAllImages];

全部単純な関数なので、使い方に悩むことは少ないでしょう。


スクリーンショット

Morve 1.1.0ではこんな感じになっています。

“TWEET”ボタンをタップすると、今回実装した部分が動作し、下記の画面が表示されます。

“送信”をタップするとTweetが投稿されます。


参考

  1. トラックバックはまだありません。

コメントを残す

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト / 変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト / 変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト / 変更 )

Google+ フォト

Google+ アカウントを使ってコメントしています。 ログアウト / 変更 )

%s と連携中

%d人のブロガーが「いいね」をつけました。