iPhoneアプリ開発勉強会第2回の資料です

1. 第2回 iPhone勉強会
13年3月17日日曜日

2. 今後の予定
・第2回 画面遷移の実装方法
・第3回 TableViewとデータの扱い方
・第4回 ユーザ操作（タップなど）の
検出方法
・第5回 MapKitを使った地図の表示方法
現在地の取得方法
13年3月17日日曜日
シリーズ化に当たり、今後の予定をくんでみました。
地図を表示して、現在いる場所を表示するアプリを作成することをゴールとして進めていこうと考えています。
一応５回としていますが、進み具合によって変更しようと思います。
今回は画面遷移の実装方法を行います。

3. 今日のアジェンダ
・前回の復習
・StoryBoardを使った画面遷移
・MVCモデルの説明
・サンプルアプリ作成
（今日は複数画面のアプリを作ります）
13年3月17日日曜日
今日のスケジュールは以下の通りです。
まず、前回の復習を軽く行った後、StoryBoardを使った画面遷移の実装方法を説明いたします。
MVCモデルについて説明した後に、他の部品について説明をいたします。
その後、今日の課題となるサンプルアプリを作成いたします。
今日も出来るだけ手を動かすようにしたいと思います。よろしくおねがいいたします。

4. 前回の復習
∼以下を実行してみましょう∼
・Xcodeでプロジェクトを作成
・ボタンを押したら、HelloWorldを表示する
何のことだかさっぱりわからないという方いますか？
13年3月17日日曜日
まず、前回の復習をしましょう。
前回受講したという前提で、まずはコードを書いてみます。
iPhone上でボタンを押したらHelloWorldを表示するプログラムを作成してください。
何のことだかさっぱりわからないと言う方、こっそり教えてください・・・。

5. ソースコード
・ViewController.h
@property (weak, nonatomic) IBOutlet UILabel
*label;
→UILabel型のインスタンス変数を定義
- (IBAction)display:(id)sender;
- (IBAction)erase:(id)sender;
→displayというメソッドとeraseというメソッドを定義
13年3月17日日曜日
回答例のソースコードを復習がてら解説します。
Objective-Cの場合、.hファイルにメソッドや定数を定義し、.mファイルでメソッドの実装を行います。
ここではViewController.hというファイルにUILabel型のlabelというインスタンス変数とdisplayというメソッドとeraseとい
うメソッドを定義します。
@property (weak, nonatomic) IBOutlet UILabel *label;と記載するとUILabel型のインスタンス変数を定義することが出来
ます。インスタンス変数は直接アクセスすることが出来ないので、setterとgetterを設定する必要があるのですが、
@propertyをつけるとコンパイラがsetterとgetterを作成してくれます。
IBOutletとつけるとstoryboard（またはxibファイル）で設定したパーツからアクセスするものであるという設定が出来ま
す。これをつけることによって、Storyboardにあるパーツと接続することが出来ます。
IBActionとつけるとStoryBoardにあるパーツを操作した際に呼び出されるメソッドであることを定義できます。
この場合UIButtonをクリックするとdisplayというメソッドが呼び出されます。
senderには操作した部品そのものが渡されます

6. ソースコード
・ViewController.m
- (IBAction)display:(id)sender {
self.label.text = @"Hello World!";
}
- (IBAction)erase:(id)sender {
self.label.text = @"";
}
→ ラベルのテキストに文字列を設定している。
→ self.labelでlabelというインスタンス変数へアクセ
スしている
13年3月17日日曜日
では、ViewController.mファイルの内容について解説します。
ヘッダで設定したdisplayメソッドとeraseメソッドで実際に行われる処理を実装します。
displayメソッドではlabelにhelloWorldという文字列を表示するようにします。
labelはインスタンス変数なので、Objective-Cでは直接アクセスすることは出来ません。
self.labelと記載するとsetterからアクセスすることが出来ます。
selfというのは自分自身（オブジェクト）を表します。
ラベルで表示している文字列を変更するにはラベルオブジェクトのtextというインスタンス変数を変更する必要があります。
self.label.textと記載することで自分自身のインスタンス変数であるlabelのインスタンス変数textに対してアクセスすること
が出来る訳です。

7. 起動時の処理シーケンス
・main.mにあるUIApplicationMainが呼ばれる
→アプリケーションデリゲートが作成される
→info.plistに記載しているStoryBoardが読み込まれる
・AppDelegate.mにあるapplication
didFinishLaunchingWithOptionsというメソッドが呼
ばれる
→アプリが起動してすぐに行う処理を定義する
13年3月17日日曜日
エンジニア的にはどのような処理シーケンスなのか気になる所だと思いますので、
ざっくりと説明します。詳細に説明しだすとこれだけで終わってしまうので大まかな流れだけ頭の片隅においておいてくださ
い。
最初にmain.mにあるmainメソッドが呼ばれます。
ここでUIApplicationMainというメソッドがよばれ、アプリの初期処理を行います。
AppDelegateクラスおよびStoryBoardで設定しているクラス（ViewController）が作成されます。
ここで、info.plistにあるMain storyboard file base nameの設定値を変更してみましょう。アプリは起動するでしょう
か・・・・。

8. Objective-Cの基本文法を
おさらい
Objective-Cは
オブジェクトに対してメッセージを送る言語
メッセージを送った結果を受け取る
例：[obj msg]
受け取った結果がオブジェクトだったら・・・。
そのオブジェクトにもメッセージを送れる。
例：[[obj msg1] msg2];
13年3月17日日曜日
ここでObjective-Cの基本を少しおさらいします。
知っているよという方もここで復習しておきましょう。
Objective-Cはあるオブジェクトに対してメッセージを送るという言語です。
[obj msg];でobjという名前のオブジェクトにmsgという名前のメッセージを送ります。
メッセージを送った結果を受け取ることが出来ます。結果の形式についてはobjというオブジェクトで指定しています。
オブジェクトのこともありますし、void型ということもあります。
メッセージを送った結果オブジェクトを受け取った場合、受け取ったオブジェクトに対してもメッセージを送ることが出来ま
す。

9. Objective-Cの基本文法を
おさらい
実際のコード例
Hoge *hogeObj = [[Hoge alloc]init];
int num = 1;
[hogeObj sendMessage:@”test” number:num];
メソッド 引数 キーワード
13年3月17日日曜日
実際のソースコードではこのように記載します。
Hoge型のhogeObjを作成します。
[Hoge alloc]と記載するとHoge型のオブジェクトが返ってきます。返ってきたオブジェクトにinitというメッセージを送ると
初期化することが出来ます。
作成したHoge型オブジェクトhogeObjに対してsendMessageというメッセージを送ります。
この送るメッセージのことをJavaなどでもおなじみのメソッドと言います。
メソッドには引数を指定できます。ここでは”test”という文字列とnumというint型の変数を引数として指定しています。
２つ以上の引数がある場合は、キーワードを指定します。（無くても動きます）

10. Objective-Cの基本文法を
おさらい
Hoge.h(ヘッダファイル）
→他のオブジェクトからアクセスする変数とメソッドを宣言
@interface Hoge:NSObject
@property(nonatomic,strong) NSString * moge;
-(void)sendMessage:(NSString *)msg number:(int)number;
@end
13年3月17日日曜日
ではHogeクラスを作るために必要な.hファイルと.mファイルの作成方法を説明します。
まず、Hoge.hというファイルを作成しましょう。
.hファイルでは他のオブジェクトからアクセスする変数とメソッドを宣言します。
@interface Hoge:NSObject
→このクラスはHogeという名前で、NSObjectというクラスを継承しているということを示しています。
@property(nonatomic,strong) NSString * moge;
→mogeというNSString型のインスタンス変数を宣言しています。
インスタンス変数は直接アクセスすることが出来ません。@propertyとつけることによって、
Setter/Getterをコンパイラに作ってもらいます。
-(void)sendMessege:(NSString *)msg1 number:(int)number;
sendMessageというメソッドを宣言しています。
NSString型のmsgとint型のnumbetという２つの引数が必要であることを示しています。
sendMessageを送った結果はvoidです。

11. Objective-Cの基本文法を
おさらい
Hoge.m
→ヘッダで宣言したメソッドの中身を実装
@implemention Hoge
- (void)sendMessage:(NSString *)msg number:(int)number{
NSLog(@”message is %@ and Number is %d”,msg,number);
}
@end
13年3月17日日曜日
次にHoge.mファイルの作成方法について解説します。
ここでは先ほど宣言したメソッドの中身を実装します。
@implemention Hogeと記載することで、Hogeクラスの実装であることを宣言できます。
先ほどのヘッダファイルで宣言したメソッドの実装をここで行います。
ちなみにここでは引数として渡されたものをコンソールに出力するだけのものです。

12. StoryBoardを使った画面遷移
・StoryBoardを使うと
画面遷移を簡単に実装することが出来ます。
∼Xcodeでの実装を見てみましょう∼
13年3月17日日曜日
HelloWorldについて思い出すことは出来ましたでしょうか。
今回は１つの画面だけでなく、複数の画面を表示するようにしてみましょう。
前回も使用したStoryBoardを使うと画面遷移を簡単に作成することが出来ます。
Xcodeでの実装方法を紹介しつつ、実際に手を動かしていきましょう。

13. ViewControllerを作成する
ViewControllerを
選択してドラッグ
13年3月17日日曜日
まず、Xcodeを起動して、新しいプロジェクトを作成しましょう。
SingleViewApplicationを選択し、「Use StoryBoard」と「Auto Reference Counting」にはチェックを入れてください。
新しいプロジェクトを作成したら、MainStoryboardというファイルを開いてください。
このStoryBoardというファイルを編集して画面を作成していきます。
今のままでは１つの画面しか表示されないので、もう一つ画面を表示するようにします。
まずStotyBoardにViewControllerを追加します。windowの右側からViewControllerを選択して、真ん中のwindowにドラッ
グしてください。

14. ViewController同士を接続
ボタンを押すことで、画面
遷移できるようにする
ここではmodalを選択してください
13年3月17日日曜日
ボタンを押したら画面を変更するような仕組みにしてみましょう。
作成した２つのビューにボタンを配置してください。
右のwindowから「Round Rect Button」を２つのビューに対してドラッグしてください。
ボタンを配置したら、ボタンを選択したあと、Controlキーを押しながらもう片方の画面まで線を延ばしてください。
ボタンを離すと「Action Segue」と書かれたポップアップが表示されますので、ここでは「modal」を選択してください。
これで、ボタンを押したときの遷移を定義することが出来ます。
もう一方のボタンに対しても同じように行いましょう。
そこまで出来たら、一度ビルドして実行してみましょう。
ボタンを押したら画面が変わるようになったでしょうか。

15. ViewControllerのソースコードを作成
遷移先の
ViewControllerを作成
13年3月17日日曜日
画面が変わるだけだと面白くないので、１つ目の画面でボタンを押したら「View1」の表示／非表示を設定、
もう一つの画面でボタンを押したら「View2」の文字色を変更するようにしてみましょう。
まず、2つめのViewControllerに対応するソースコードを作成します。
Fileメニュ-からNew→Fileを選択してください。
Class名をSecondViewController、SubClassofの箇所は「UIViewController」を選択してください。
Targeted for iPad および With XIB or user interfaceのチェックは外してください。

16. ViewControllerのソースコードを作成
作成したViewController
を選ぶ
13年3月17日日曜日
StoryBoardのViewControllerとソースコードのViewControllerを接続します。
MainStoryBoardを開き、作成したViewControllerを選択し、右windowにあるCustomClassという箇所から
先ほど作成したSecondViewControllerを選択してください。
こうすることで、StoryBoard上で表示されているものがどのクラスに該当するかを設定できます。

17. ソースコードの編集
・ViewController.h
@property (weak, nonatomic) IBOutlet UILabel *label;
- (IBAction)display:(id)sender;
・ViewController.m
- (IBAction)display:(id)sender {
//ラベルに文字が設定されていなかったらHelloWorldを設定
if([self.label.text isEqualToString: @""]){
self.label.text = @"Hello World!";
}
else{
self.label.text = @"";
}
}
13年3月17日日曜日
ここから先はソースコードの編集を行います。
最初はViewController.mとViewController.hを編集し、
ボタンを押したらラベルの文字表示を設定するようにしましょう。
ボタンを押したらdisplayメソッドを呼ぶようにし、ラベルに文字が設定されていない場合は文字を設定し、
設定されている場合は空文字列を設定するようにしましょう。

18. ソースコードの編集
・SecondViewController.h
@property (weak, nonatomic) IBOutlet UILabel *label;
- (IBAction)change:(id)sender;
・SecondViewController.m
- (IBAction)change:(id)sender {
//フォントサイズが16よりも大きい場合は16にする
if(self.label.font.pointSize > 16.0){
self.label.font = [UIFont fontWithName:@"Helvetica"
size:16.0];
}
else{
self.label.font = [UIFont fontWithName:@"Helvetica"
size:20.0];
}
}
13年3月17日日曜日
次にSecondViewController.mとSecondViewController.hを編集し、
ボタンを押したらフォントサイズを変更するようにします。
ボタンを押したらchangeメソッドが呼ばれるように設定してください。
labelのfontプロパティに設定されているfontサイズをみて、１６ポイントよりも大きい場合は１６ポイントに設定し、
それ以外の場合は２０ポイントに設定してみましょう。

19. こんな感じに動いたでしょうか
13年3月17日日曜日
このような感じになったでしょうか。
画面ごとにそれぞれ異なる動きが実装できたかと思います。

20. まとめると・・・
•Xcodeでプロジェクトを作成
•StoryBoardにViewControllerを追加
•ViewController同士を接続
•ViewControllerのソースコードを作成
•ソースコードとStoryBoardの
•ViewControllerを接続する
13年3月17日日曜日
ここでやり方を復習します。
StoryBoardにViewControllerを追加します。
ViewController同士を接続して画面遷移できるようにします。ここではmodalを選んでください。
ViewControllerのソースコードを作成し、処理を実装します。
ソースコードとStoryBoardのViewControllerを接続すれば完成です。

21. もう少しiPhoneらしくしたい
UINavgationを使うとこんな動きを作れます。
13年3月17日日曜日
もう少し、iPhoneらしいアプリを作りたいと感じる方もいらっしゃるかと思います。
UINavigationを使うと、このようにナビゲーションを使ったアプリを作成できます。
少しiPhoneらしい感じはしませんか？？？
これからnavigtationをつかったアプリについて説明します。

22. Xcodeの設定方法
ViewControllerを選択、
Editor→Embed
in→NavigationController
13年3月17日日曜日
もう一度先ほどと同じようにプロジェクトを作成しましょう。
SingleViewControllerを選んでください。
MainStoryBoardを開いて、ViewControllerを選択してください。
メニューのEditorからEmbed inを選択し、NavigationControllerを選択してください。そうすると、このViewControllerは
Navigationを使うということを定義することが出来ます。

23. Xcodeの設定方法
Action Segueからpushを選
択する。
13年3月17日日曜日
先ほどと同じようにボタンをViewControllerに配置し、
配置したボタンを選択します。選択した状態でControlキーを押しながらもう一つのViewControllerにドラッグします。
先ほどはmodalを選択しましたが、今度はPushを選択してください。
この状態でビルドして実行してみましょう。

24. 当たり前ですが・・・。
ある画面で設定した値を他の画面で表示したい
iOSアプリではMVCモデルに基づいて設計を
行う
13年3月17日日曜日
ここから先は少し設計的な話になります。
どのアプリでもそうだと思いますが、ある画面で設定した値を他の画面で表示するなんてことをやるかと思います。
Javaなどでも画面で設定したものをデータオブジェクトに保持するなんてことを行っているかと思います。
Objective-Cでも同じです。iPhoneアプリの開発ではMVCモデルに基づいて開発します。

25. MVCモデルについて確認
・Model：データおよびデータの操作
・View：Modelのデータを画面へ表示
・Controller：ユーザ操作の受付、モデルの操作
13年3月17日日曜日
釈 に説法かも知れないですが、MVCモデルについておさらいします。
Modelでデータの保持およびデータの操作を行います。
ViewでModelのデータを画面に表示します。
Controllerでユーザの操作の受付およびモデルの操作を行います。Viewに対するControllerということでViewControllerを使
っていた訳です。

26. Modelを作成してみよう
・会員（Member)というモデルを作成
∼モデルのデータ∼
・会員番号 memberId int型
・会員名 memberName NSString型
このモデルを実現するオブジェクトを作成するには？
13年3月17日日曜日
ViewとControllerについては既に作成しているので、今度はViewで入力したデータを保持するモデルを作成しましょう。
例えば会員(Member)というモデルを作成する例を考えてみます。
モデルの中身は、int型の会員番号とNSString型の会員名とします。この場合、どのようにオブジェクトを作成するにはどう
したらいいでしょうか。

27. Modelを作成してみよう
必要なもの
・.hファイル（Model.h）
・.mファイル (Model.m)
・.hファイルの中身
@property(nonatomic,strong) NSString *memberName;
@property(nonatomic)int memberId;
13年3月17日日曜日
必要なものは.hファイルと.mファイルです。
メニューのFile→New→Fileを選んで新しいファイルを作成します。
Objective-C Classを選択して次に進んでください。
ClassにはMember、SubClassにはNSObjectを記載して保存してください。
そうすると、Model.hとModel.mが作成されます。Model.hにmemberNameとmemberIdを宣言してください。
@propertyをつけるとgetterとsetterが作成されるので、特にModel.mの記載はいりません。

28. このままでもいいのですが
どこからでもアクセスできるシングルトンにします。
・Model.hに以下の記載を追加
+(Member *)sharedInstance;
・Model.mに以下の記載を追加
static Member *member = nil;
@implementation Member
+(Member *)sharedInstance{
if (member == nil) {
member = [[super alloc]init];
}
return member;
}
13年3月17日日曜日
このままでもいいのですが、どこからでもアクセスできるようにシングルトンにします。
（データを外部ファイルに保存していないので）
Model.hには以下のように記載してください。
+(Member *)sharedInstance;+というのは、クラスメソッドであるということです。
つまり、オブジェクトではなく、クラスに対してメッセージを送るということです。
ここではMemberというクラスに対してsharedInstanceというメッセージを送るとMemberがたのオブジェクトが返ってき
ます。
Model.mファイルにはsharedInstanceメソッドの実装を行います。
まず、staticをつけることにより、ファイル内だけで有効となります。（ほかのオブジェクトからアクセスできないようにな
ります）
そして sharedInstanceが呼ばれたときは、nilであるかどうかチェックをして、nilだった場合のみ初期化します。

29. 今日の課題
入力したURLのWEBサイトを表示する
13年3月17日日曜日

30. ご清聴ありがとうございました
13年3月17日日曜日