Upload
hasegawa
View
641
Download
0
Embed Size (px)
Citation preview
iPhone輪講第3回
Lesson6&Lesson7&Lesson8
Lesson6モデル・ビュー・コントローラ アーキテクチャ
MVCアーキテクチャとは
MVC(Model View Controller)アーキテクチャは、アプリケーションを作るときどこから作っていけばよいのかという疑問に答えてくれるもの
アプリケーションを作るときはあらかじめどういったクラスを作るのか、どういった機能をどのクラスに割り振るのかという指針が必要
それがMVCアーキテクチャ
モデル
モデルはアプリケーションのデータを表すためのクラス
モデルクラスの中身はテキスト
仕事としてはファイルへの保存、及び読み込み
ビュー
ビューはアプリケーションの外観にあたる
ウィンドウ、ボタン、スライダー、スクロールバーなど
ビューの仕事
ユーザに見えるようにデータを表示する
テキストフィールドにはテキストを表示する、テーブルにはデータを並べるなど
ユーザからの操作を受け付ける
ユーザはマウスやキーボードを介してビューを操作する
ボタンはクリックする、テキストビューには文字を打ち込むなど
コントローラ
コントローラはモデルとビューをつなぐもの
モデルはアプリケーションのデータ、ビューはそのデータを表示するもの、その間に位置してデータをやり取りするものが必要になる
それがコントローラ。モデルとビューの両方にアクセスする
iTunesをMVCでデザインする
iTunesが扱うデータは曲
これをモデルにする
曲を表すクラスとしてTrackクラスを作る
Trackクラスは曲データを管理する
曲名、アーティスト名、アルバム名、再生時間など
Track
{ 曲名、アーティスト名、アルバム名、再生時間、
アルバムがリリースされた年… }
Trackクラス
iTunesのビュー
iTunesのビューはiTunesのユーザインタフェース
モデルとしてTrackクラスを定義したのでそれに対するビューという観点でみていく
iTunesのビュー
iTunesにはTrackをテーブルで表示するビュー、ブラウザスタイルで表示するビュー、アルバムのカバーを並べるCover Flowで表示するビューがある
これらを実現する為の部品がビューのクラスとなる
iTunesのビュー
テーブルビュー
iTunesのビュー
ブラウザビュー
iTunesのビュー
Over Flowビュー
iTunesのコントローラ
iTunesのコントローラはTrackクラスと様々なスタイルのビューの間に位置する
テーブルスタイルのビューでは、ユーザの絞り込み条件にあった曲をテーブルは位置して並べることになる
これをTableControllerとする
同様にブラウザスタイルの為のコントローラをBrowserControllerCover Flowの為のコントローラをCoverControllerとする
iTunesのMVCデザイン
ビュー
コントローラ
モデル
TableController BrowserController CoverFlowController
Track
MVCに基づくアプリケーションの作り方
ビューはCocoaが提供してくれている
アプリケーションを作るとき、ビューを作る必要はない
Interface Builderでユーザインタフェースをデザインするときパレットにあった部品
それがCocoaが提供するビュー
MVCに基づくアプリケーションの作り方
Cocoaが用意していないタイプのビュー
iTunesでいうとCover Flowを実現するようなビュー
Cocoaのビューの流儀に則って自分で作る
ビューとモデルは互いに独立
「独立」とはビューはビューだけで、モデルはモデルだけで動くようにするということ
ビューとモデルは互いに独立ビューの場合
ビューはCocoaで提供されている
あらゆるアプリケーションで使われる
特定のアプリケーションの為にデザインされているのではなく、汎用的に利用できるようになっている
こういったものを独立して動くという
いろいろなところで利用できるので再利用性が高いともいう
ビューとモデルは互いに独立モデルの場合
モデルはデータの形だけみて設計する
どういうビューで表示させるかなどは考えないようにする
iTunesの場合テーブル、ブラウザ、Cover Flowというどのビューの形を使用しても、モデルは同じにしたい
モデルはビューから独立した形でデザインする
モデルの再利用性も高まる
アプリケーション特有の機能を受け持つのがコントローラ
ビューとモデルはそれぞれ独立していて、再利用性が高い
アプリケーション特有の機能はコントローラに入れる
アプリケーション特有の機能を受け持つのがコントローラ
iTunesを例で考える
モデルであるTrackは曲情報を持っている
ビューであるテーブルビューはデータをテーブルに表示することができる
Trackをどのようにテーブルに並べるかという仕事を受け持つクラスが必要
これを受け持つのがコントローラであるTableController
モデルとコントローラのクラスを作る
アプリケーションを作るときはモデルとコントローラの為のクラスを作る
アプリケーションで扱うデータを定義する
iTunesなら曲情報、テキストエディタならテキストデータなどを管理するモデルクラスをデザインする
モデルが決まったら、Cocoaの提供するビューを使いユーザインタフェースをデザインする
モデルとビューをつなぐ為にコントローラクラスを作る
コントローラクラスの実装がプログラミングの中心となる
Lesson7アウトレットとアクション
ビューとコントローラのやり取り
モデルはアプリケーションのデータ、ビューはデータの表示、コントローラはモデルとビューの間に位置するもの
ビューとコントローラのやり取り
コントローラの仕事は2種類に分けることができる
1. モデルからデータを取得してビューに設定する
2. ユーザがビューを操作したときにビューからの通知を受けて、モデルの値を変更する
ビュー
コントローラ
モデル
値の設定 ユーザからの操作
アウトレットとアクション
アウトレットはコンセントの穴
アウトレット(outlet)は「コンセント」の意味
電気をつなぐとき本体から電源ケーブルをコンセントに差し込む
その感覚でビューとコントローラの間に関連を作る
コントローラはアウトレットを使ってビューにアクセス
アウトレットはコントローラにつける
コントローラの仕事の一つはビューに値を設定すること
その為にアウトレットを経由してビューへアクセスできるようにしている
コントローラがアクセスする必要があるビューの分だけアウトレットを作ることになる
コントローラはアウトレットを使ってビューにアクセス
アウトレットはコントローラにつける
コントローラの仕事の一つはビューに値を設定すること
その為にアウトレットを経由してビューへアクセスできるようにしている
コントローラがアクセスする必要があるビューの分だけアウトレットを作ることになる
新しいビューオブジェクトを追加したらアウトレットも追加する
コントローラはアウトレットを使ってビューにアクセス
アウトレットはコントローラにつける
コントローラの仕事の一つはビューに値を設定すること
その為にアウトレットを経由してビューへアクセスできるようにしている
コントローラがアクセスする必要があるビューの分だけアウトレットを作ることになる
アウトレットはインスタンス変数
アウトレットを追加すると、コントローラクラスにはインスタンス変数として追加される
Hello Worldを作ったときのコントローラクラスのファイルAppController.hを開く
IBoutletで始まる文が、アウトレットの為のインスタンス変数
アクションとは
アウトレットがビューを参照するのに対して、アクションはビューからの通知を受け付けるもの
これでユーザの操作に対応する処理を行うことができる
アクションの登録、発生、呼び出し
まずビューにアクションを登録する
ユーザからの操作があると、登録したアクションが呼び出される
ユーザの操作に対応する処理を行うことができる
アクションの登録、発生、呼び出し
まずビューにアクションを登録する
ユーザからの操作があると、登録したアクションが呼び出される
ユーザの操作に対応する処理を行うことができる
1.ビューにアクションを登録する
アクションの登録、発生、呼び出し
まずビューにアクションを登録する
ユーザからの操作があると、登録したアクションが呼び出される
ユーザの操作に対応する処理を行うことができる
アクションの登録、発生、呼び出し
まずビューにアクションを登録する
ユーザからの操作があると、登録したアクションが呼び出される
ユーザの操作に対応する処理を行うことができる
2.ユーザがボタンをクリックする
アクションの登録、発生、呼び出し
まずビューにアクションを登録する
ユーザからの操作があると、登録したアクションが呼び出される
ユーザの操作に対応する処理を行うことができる
アクションの登録、発生、呼び出し
まずビューにアクションを登録する
ユーザからの操作があると、登録したアクションが呼び出される
ユーザの操作に対応する処理を行うことができる 3.登録している
アクションを呼び出す
アクションはメソッド
アクションの実態はメソッド
Hello Worldを作ったときのコントローラクラスのファイルAppController.hを開く
IBActionで始まる文がアクションの為のメソッド
Sayボタンを押すとメソッドが呼び出される
アウトレットの接続
アウトレットを持っているインスタンスを選択する
コントロールキーを押しながらドラッグすると線が延びてくる
この線を接続先に持っていき、ターゲットとなるユーザインタフェース上でドロップする
アウトレットを表示する黒いウィンドウが開くので、接続するアウトレットを選択する
アウトレットの接続
アウトレットの接続
アウトレットの接続
インスタンスを選択
アウトレットの接続
アウトレットの接続
アウトレットの接続
コントロールを押しながらドラッグ
アウトレットの接続
アウトレットの接続選択先の上でドロップ
アウトレットの接続
アウトレットの接続
アウトレットの接続
黒いウィンドウが開くので、
アウトレットを選択
ウィンドウをアウトレットに接続
接続できる対象はウィンドウ上の部品だけでない
ウィンドウそのものをつなぐこともでき、他のインスタンス化したオブジェクトも接続できる
xibウィンドウ上にあるインスタンスならどれでも接続できる
ウィンドウをアウトレットに接続
アクションの接続
アクションを送るユーザインタフェースを選択
コントロールキーを押しながらドラッグ
アクションを送るインスタンスの上でドロップ
アクションを表示する黒いウィンドウが開くので、そこからアクションを選択する
アクションの接続
アクションの接続
ユーザインタフェースを選択
アクションの接続
アクションの接続
コントロールキーを押しながらドラッグ
アクションの接続
アクションの接続
インスタンスの上でドロップ
アクションの接続
アクションの接続
黒いウィンドウが開くので、アクションを選択
アクションの接続
メニューからのアクションの接続
アクションはメニューからも接続できる
メニューを選択すると、そのアクションが呼び出されることになる
メニューからのアクション接続
接続の確認
アウトレットとアクションの接続の確認をする
対象となるインスタンスをコントロールキーを押しながらクリック
黒いウィンドウに接続可能な項目と、現在の接続状況一覧が表示される
接続の確認
黒いウィンドウの右端の丸が接続状況を表している
白で塗りつぶされた丸は、接続されている
空の丸は未接続
バツボタンをクリックすれば接続が解除される
Lesson8チュートリアル:
文法の実験のためのプロジェクト
Command Line Utility カテゴリ
コマンドラインのアプリケーションを作る為のテンプレート
C言語やのためのテンプレートや、Cocoaのクラスの実験をしたいときの為のテンプレートなどがある
C言語実験の為のプロジェクト作成
C言語のための実験環境を作る
「Standard Tool」というテンプレートを利用する
1. Xcodeを起動する
2. プロジェクトを作成する
[ファイル]→[新規プロジェクト...]メニューを選択
Command Line Utilityカテゴリの下のStandard Toolを選択
C言語実験の為のプロジェクト作成
C言語のための実験環境を作る
「Standard Tool」というテンプレートを利用する
1. Xcodeを起動する
2. プロジェクトを作成する
[ファイル]→[新規プロジェクト...]メニューを選択
Command Line Utilityカテゴリの下のStandard Toolを選択
C言語実験の為のプロジェクト作成
C言語の為の実験環境を作る
3. プロジェクト名は「C Test」としておき、適当な場所に保存
これでプロジェクト作成は完了
プロジェクトに登録されているファイルを確認
main.cがC言語を書く為のファイル
C言語実験の為のプロジェクト作成
main.cを開く
// insert code here...というところにコードを追加していく
C言語実験の為のプロジェクト作成
main.cを編集する
囲まれた部分が追加された行
実行結果
Objective-Cの実験のためのプロジェクト作成
Objective-Cの為の実験環境を作る
1. Xcdeを起動する
2. プロジェクトを作成する
[ファイル]→[新規プロジェクト...]メニューを選択
Command Line Utilityカテゴリの下のFoundation Toolを選択
Objective-Cの実験のためのプロジェクト作成
Objective-Cの為の実験環境を作る
1. Xcdeを起動する
2. プロジェクトを作成する
[ファイル]→[新規プロジェクト...]メニューを選択
Command Line Utilityカテゴリの下のFoundation Toolを選択
Objective-Cの実験のためのプロジェクト作成
Objective-Cの為の実験環境を作る
3. プロジェクト名は「ObjC Test」としておき、適当な場所に保存
完了ボタンを押してプロジェクト作成は完了
プロジェクトに登録されているファイルを確認
C言語では.cという拡張子がコードを書く為のファイル
Objective-Cでは.mがコードを書く為のファイル
Objective-Cの実験のためのプロジェクト作成
クラスファイルの作成
1. ファイル→新規ファイルメニューを選択
2. Cocoaのカテゴリ下にある「Objective-C class」のテンプレートを選択
Objective-Cの実験のためのプロジェクト作成
クラスファイルの作成
1. ファイル→新規ファイルメニューを選択
2. Cocoaのカテゴリ下にある「Objective-C class」のテンプレートを選択
Objective-Cの実験のためのプロジェクト作成
クラスを作成する
3. ファイル名は「MyObject.m」とする
「同時に”MyObject.h”も作成する」のチェックボックスもオンにしておく
Objective-Cの実験のためのプロジェクト作成
クラスを作成する
3. ファイル名は「MyObject.m」とする
「同時に”MyObject.h”も作成する」のチェックボックスもオンにしておく
MyObject.hとMyObject.mの内容
MyObject.h MyObject.m
これがObjective-Cでのクラス宣言と実装になる
クラスの編集
MyObject.hの編集
クラスの編集
MyObject.mの編集
クラスの編集MyObject.mの編集
実行結果
おわり