My Footprint -3ページ目

My Footprint

どんな靴を履いてても、歩けば僕の足跡。
目標に向かって歩き続ける日々を書いていくブログです。

今日iOSでのタブについて調べてたんですが、タブの切り替え時のイベントはどう実装するのか
気になって調べたら意外とちゃんとした情報が無かったのでやってみました。


まず、切り替えのイベントはUITabBarControllerDelegateを実装し、

- (void) tabBarController:(UITabBarController *)tabBarController didSelectViewController:(UIViewController *)viewController

で受け取ります。


で、色々ネット見てると、このなかでviewControllerのインスタンスを調べたりして条件分岐とか
させてるのが多かったんだけど、個人的には各controllerで処理が出来た方が汎用的じゃないかなぁと思ったので実装してみました。


やることとしては

  • UITabBarControllerのサブクラスを作成、上のデリゲートメソッドを実装しイベントを受け取る

  • プロトコルをUITabBarControllerに作成し、各UIViewControllerに実装させる。

  • イベントを受け取ったら各UIViewControllerに処理をさせる



です。
説明するのが下手なので分かりにくいですね^^;

ポイントとしてはUITabBarControllerのデリゲートに自分自身を設定するところです。
UITabBarControllerのデリゲートに各タブのUIViewControllerを設定してしまうと
タブが選択されたときに全てのイベントが固定のUIViewControllerにしか行かないからです。
UITabBarControllerのオブジェクトは一つしかなく、デリゲートも一つしか持てないですからね。

なのでUITabBarControllerの継承クラスを作り、各タブにイベントを振ってやろうという魂胆です。


まずxcodeでプロジェクトを作成します。
Tabのテンプレートを選択します。

$My Footprint


次にUITabBarControllerを継承したクラスを作成します。


$My Footprint

ここでは適当にMyTabBarContollerと名付けます。


クラスを作成したらstoryboardのほうからUITabBarControllerのviewにMyTabBarControllerを指定します。


$My Footprint


これでMyTabBarControllerに処理が入ってきます。

次にMyTabBarControllerにUITabBarControllerDelegateを実装します。
まずヘッダーファイルを以下のようにします。

@interface MyTabBarController : UITabBarController<UITabBarControllerDelegate>

@end

さらに各タブとなるUIViewController用にプロトコルを宣言します。

@protocol MyTabBarControllerDelegate

- (void) didSelect:(MyTabBarController*) tabBarController;

@end

次に.mファイルを開き

- (void) tabBarController:(UITabBarController *)tabBarController didSelectViewController:(UIViewController *)viewController

を実装して行きます。


- (void) tabBarController:(UITabBarController *)tabBarController didSelectViewController:(UIViewController *)viewController {

// プロトコルを実装しているかのチェック
if ([viewController conformsToProtocol:@protocol(MyTabBarControllerDelegate)]) {
// 各UIViewControllerのデリゲートメソッドを呼ぶ
[(UIViewController<MyTabBarControllerDelegate>*)viewController didSelect:self];
}

}


ここでは最初にプロトコルを実装しているかチェックをしています。
全てのタブで実装するとは限らないので。

で、実装してあればメソッドを読んで処理を渡してあげます。

また、viewDidLoadなどで自分自身をデリゲートに設定してあげます。


- (void)viewDidLoad
{
[super viewDidLoad];
// 自分自身をデリゲートに設定
self.delegate = self;

}



これで各UIViewController内で自分が選択されたイベントが取れるようになりました。


次に受け取り側を実装していきます。

テンプレートで作ると最初から2つUIViewControllerが出来ているので
それぞれにMyTabBarControllerDelegateを実装していきます。

まずヘッダーでMyTabBarController.hをimportします。

#import "MyTabBarController.h"
@interface FirstViewController : UIViewController<MyTabBarControllerDelegate>

@end

さらに.mファイルを開き次のメソッドを実装します。
今回はとりあえずログをはくだけ。


- (void) didSelect:(MyTabBarController *)tabBarController {
NSLog(@"tab 1");
}


同じようにしてもう片方にも実装します。

これで実行すると以下のようにタブを選択した時に
選択されたUIViewController内で処理を実行することができます。
$My Footprint

Facebook SDK for iOSのインストール、開発準備をやったので手順をメモ。
公式サイトのチュートリアルをまとめただけです。
公式チュートリアル

環境
OS: Mac OS X Lion
xcode: 4.4.1


Facebook SDK for iOSのインストール



ます公式からパッケージをダウンロード。

$My Footprint

ダウンロードしたらパッケージをダブルクリックしてインストール。
ひたすらYESでOK!

これでインストール終了。

プロジェクトの設定



次にxcodeで新規プロジェクトを作成します。


$My Footprint
$My Footprint


プロジェクトを作成したらFrameworksにFacebook.frameworkとFacebookSDKResouces.bundle
を追加します。

FacebookSDKをインストールしたフォルダからドラッグして追加するだけ。

$My Footprint

$My Footprint

$My Footprint

$My Footprint

二つとも追加するときは最後の画像のようにチェックをつけてください。
copy ~ のところはチェックを外すように。

次にSQLiteのライブラリを追加します。
BuildSettingsの Other Linker Flagsに "-lsqlite3.0" を追加します。


$My Footprint


次はplistにAppIDとURL typesを設定していきます。
アプリは事前にFacebookのサイトから登録しておいてください。

$My Footprint

FacebookAppIDにはアプリ登録の時に出来たIDを、URL typesのURL Schemesのitem0には
AppIDに"fb"をつけた物を登録しておきます。


以上でSDKの導入おわりです。
開発環境が整った(と思う)ので実際にHello World書いて行きましょう!

終わってない人は Node.jsでHello Worldやってみた(1) を参照でb


var http = require("http"); // httpモジュールの読み込み

// サーバーを作成
http.createServer(function(req, res) {
// レスポンスにヘッダの設定
res.writeHead(200, {'Content-Type': 'text/html'});

// 表示するデータの作成
var htmlData =
"<html>" +
"<body>" +
"<h1>Hello World</h1>" +
"</body>" +
"</html>";

   // 本文を出力
res.end(htmlData);
}).listen(8080); // 8080ポートでサーバー起動。


手順としては

  1. httpモジュールを読み込む
  2. httpのcreateServerでサーバーを作成
    引数としてリクエストとレスポンスへ処理をする関数を渡す。
  3. レスポンスにヘッダーを設定したり、出力する内容などを作成する処理を行う。

  4. createServer()で帰ってくるオブジェクトからポート、IPなどを指定してlisten()を呼び出し、
    待ち受け状態にする。



という感じです。
今回は他のところでもよく紹介されているサンプルをちょっといじっただけなので
特に面白みはないですw

ポートはtomcatのなごりでとりあえず8080を指定しておきました。
あとはターミナルから上でつくったjsファイルを指定してnode.jsを起動します。

$ node sample.js

実行後ブラウザからlocalhost:8080にアクセスするとHello Worldが表示されます。


$My Footprint

まだこれ以上は勉強してないのでここまで!(笑)


今後node.jsを使ってwebアプリやらシステムをどう組んで行くのか
その辺を勉強して行きたいと思います。

node.jsのフレームワークのexpressなどもあるらしいので詳しく調べてみよう。


わかったらまたまとめよっかなw