|
 |
8. 接続とビルド
コントローラークラスを nib ファイルに追加する
プロジェクトウィンドウで「MainMenu.nib (English)」をダブルクリックすると Interface Builder が起動し nib ファイルが開きます。この MainMenu.nib に前回作成した ITController クラスを追加します。
1. Interface Builder がアクティブになっている状態で「File」メニューから「Read Class File...」を選びます。次に現れるドロワーウィンドウでしっかりと現在制作中のプロジェクトフォルダを指定してください (必ずしも最初から現在作成中のプロジェクトフォルダが選択されている状態になっているとは限りません) そしてその中の ITController.h ファイルを選択して Open ボタンを押します

2. Libraryパネルの「Cocoa」→「Objects & Controllers」→「Controllers」を選択して下のペインに現れる「Object」を MainMenu.nib ウィンドウへドラッグ & ドロップします。
この部分はもしかすると Interface Builder 3.0 と 3.1 では フォルダの分け方が違うかもしれません。下の図は 3.1 のものです。もし違っていたら頑張って Object を探してください

MainManu.nib ウィンドウにドラッグした Object を選択して

3. インスペクタウィンドウを Identity タブ
に切り替えます。そして Class プルダウンメニューの中から ITController を選ぶか、テキストフィールドに直接 ITController と記入します。すべての Action と Outlet が表示されます

この段階で気付きましたが Outlet の additionButton は不必要ですね。でもこのまま進めることにいたします。
MainMenu.nib ウィンドウは以下のようになります。アップルのガイドブックによるとこの新しく追加したクラスのオブジェクトの名前は、通常そのクラス名になるはずですが私の環境では何故か「Contorller」という省略された名前になります。これは 3.0 の時もそうでした。しかし私はこの省略された名前が好きなので、これで良しとします :-)

Outlet を接続する
ITController でインスタンス変数として宣言した IBOutlet とそれに参照して欲しい (初期化して欲しい、あるいは登録して欲しい) ビューオブジェクトを接続していきます。接続は「A が B のことを知っておきたいのであれば」A から B に向って接続します。今回の場合は ITController オブジェクトから各ビューオブジェクトへ接続していきます。
MainMenu.nib ウィンドウの Controller オブジェクトから、右クリックもしくは control + 左クリックで Greeting タブの最初の Label までドラッグしていきます。下の図のように接続線が伸びて行くと思います。図のように Static Text (Label) と表示されて接続先が間違いがないことを確認できればマウスをドロップします (マウスボタンを離します)

接続可能なアウトレットの一覧が表示されますので greetingInfo を選びます。もしかすると Interface Builder 3.0 ではすべてのアウトレットが表示されていたかもしれませんがここで接続するのは greetingInfo です

MainMenu.nib ウィンドウで Controller オブジェクトを右クリック (control + 左クリック) するとアウトレットなどの接続一覧を確認できます。名前の左横の x 印をクリックすると接続を解除することもできます

2番目の nameField に接続線を伸ばした時には接続先として Text Field と表示されます

プッシュボタンに接続線を伸ばした時には Push Button (タイトル名) と表示されます

ドロップすると関連するアウトレットのみ表示されます。ここでは greetingButton を選択します。

このようにしてすべてのタブのすべてのビューオブジェクトに Controller オブジェクトのほうから接続をしていきます。接続するアウトレット名が分からないようであればお手数をおかけしますが
Cocoa GUI App 第7回 コントローラー のインスタンス変数部分の宣言を参照してください
アウトレットの接続がすべて終ると MainMenu.nib ウィンドウの Controller オブジェクトを右クリック (control + 左クリック) した時の一覧表示は次のようになります

Outlets 欄の1番上の additionButton アウトレットは不必要なものでした。「Push Button (Addition)」の左横にある x 印をクリックして接続を解除しておきましょう

あとは ITController.h のインスタンス変数宣言の中の additionButton のところの1行を削除すれば綺麗になります。しかし今回はもうコード部分は触らないでこのままにしておきます。最後にこのアプリケーションを日本語化する時に上記の1行を削除することにします。今のままではメモリ的には4バイト浪費していますがプログラム的には問題ありません。
このコントローラーからプッシュボタンへの参照 (アウトレット) は、ディクショナリーの登録エントリーが 0 の場合に Greeting (挨拶) ボタンと Deletion (削除) ボタンをグレー表示にして使えなくする指令を送るために使います。Addition (追加) ボタンはディクショナリーのエントリー数に関係なく常に有効であるため addtionButton アウトレットは必要ないということになります。
Action を接続する
続けてアクションの接続を行います。アクションとはクラスファイルの中で (IBAction) という戻り値で宣言したメソッドのことです。この (IBAction) 戻り値を持つメソッドは Interface Builder から認識することができます。そしてボタンなどのメソッド呼び出しをするオブジェクトの送信先メソッドとして指定することができます。
今回はメソッドを呼び出す (メッセージを送信する) ボタンのほうからそのメソッドが定義されているオブジェクト (今回の場合は Controller オブジェクト) へ接続を行います。接続を行う前に次のようにボタンオブジェクトをしっかりと選択状態にしてください。間違いなく選択状態になっているかどうかはインスペクタウィンドウのタイトルバーに表示されるタイトルからも分かります。Controller からの接続では何気なく Controller の上から右クリック (もしくは control + 左クリック) すれば問題はありませんでしたが、ビューオブジェクトからの接続はしっかりと選択状態にしておかないとうまくいかないみたいです。

接続先が四角で囲まれれば無事接続先として選ばれています。マウスをドロップしてください。

ここでは greeting: メソッドを選びます

このようにしてそれぞれのタブの Addition ボタンと Deletion ボタンを addtion: メソッドと deletion: メソッドに接続してください。作業が終れば MainMenu.nib ウィンドウで Controller オブジェクトを右クリックした場合の一覧表示は次のようになります

「File」メニューから「Save」を選ぶか Command (⌘) + S でここまでの作業を保存しておきましょう。保存はこまめに行いましょう
デリゲートを接続する
デリゲートについての説明は
Cocoa GUI App 第7回 コントローラー のデリゲートを参照してください
まず Tab View のデリゲートとして Controller オブジェクトを登録します。次の図のように Tab View 全体を選択します。インスペクタウィンドウのタイトルバー名が「Tab View Attributes」などになっていることを必ず確認しましょう

右クリックもしくは control + 左クリックで接続線を Tab View から Controller オブジェクトに引きます。Controller オブジェクトが四角で囲まれたことを確認してからマウスを離してください

delegate を選びます

MainMenu.nib ウィンドウの中で File's Owner プロキシオブジェクトから Controller オブジェクトへ接続線を引きます

delegate を選びます

Controller オブジェクトを右クリックして一覧表示をだすと次のようになります

nib ファイルを保存します
File's Owner
File's Owner はこの nib ファイルの所有者 (管理者) オブジェクトを表すプロキシ (代理) オブジェクトです。プロキシオブジェクトと呼ばれる理由は実際にはこの nib ファイルの中に含まれていないからです。しかしここでも接続に使ったように nib ファイルの中にあるように表示されていれば便利です。そこで代理として MainMenu.nib ウィンドウの中にあります
File's Owner はそのアプリケーションによって異なってきますが、今回のような単純なアプリケーションでは NSApplication が File's Owner つまりこの nib ファイルの所有者になります。今回は NSApplication の applicationWillTerminate: というのデリゲートメソッドを使用しています。そしてそのデリゲートメソッドの実装先、つまり delegate インスタンス変数の接続先を Controller オブジェクトにしています
どのオブジェクトが File's Owner なのかを確認するには MainMenu.nib ウィンドウで File's Owner を選択しインスペクタウィンドウで Identity タブ を選択すると最初の Class のところにクラス名が表示されます

接続を確認する
接続を確認する方法はいくつか紹介しましたが、最後に代表的なものを紹介しておきます。まずいつものとおり MainMenu.nib ウィンドウで Controller オブジェクトを選択します。そしてインスペクタウィンドウで Connections タブ を選ぶと次のような画面になります

それぞれの接続の上にマウスカーソルを持っていくと対応するオブジェクトがメインウィンドウ内などでハイライト表示されます。ただし今回はタブを使用しているので当然のことながら現在選択されているタブで使用されているオブジェクト以外はハイライト表示されることはありません。タブを切り替えて確認してみてください
アプリケーションをビルドして実行する
ここまででアプリケーションを作成する作業は終りました。いよいよビルド (コンンパイル) してアプリケーションを実際に実行する時がきました。まずプロジェクトウィンドウを立ち上げてください。そしてツールバーにある「ビルド」をクリックします。メニューバーの「ビルド」から「ビルド」を選んでもらっても結構です。

ビルド中はプロジェクトウィンドウの下段に状況が表示されます

残念ながら14個のエラーがあったみたいです。に右下の赤い「x 14」をクリックするとエラーの詳細が表示されます

今回のエラーはすべて「ITModel というクラスが定義されていないではないか」という内容みたいです
エラー修正の3大原則は
1. 式の終わりのセミコロン ; を忘れていないか
2. 括弧の ( と )、{ と }、[ と ] の数は合っているか (閉じ忘れはないか)
という単純なエラーと
3. 最初のエラーから修正していく
という3点です。3番は最初のエラーが原因で残りのエラーが出ている可能性が高いからです

ITController.h で ITModel.h を読み込むことを忘れていました。次のように10行目に
#import "ITModel.h"
と書き加えます

再度ビルドしてみます。今度は下段に「ビルドは問題なく完了しました」と表示されます。

メニューバーの「実行」から「実行」を選びます

おめでとうございます
色々な動作を試してみてください。はじめにダウンロードして頂いた Introducer とまったく同じ動作をするようでしたらアプリケーションは無事に作成されています。動作確認が終れば Quit Introducer を選んでアプリケーションを終了させて下さい。
次回はこのアプリケーションに色々な設定していきます。それまではアプリケーションのみをプロジェクトフォルダから取り出したりせずにプロジェクトウィンドウから実行するように今しばらく我慢してください
お疲れさまでした。これで Cocoa GUI App 第8回は終ります。
|
|
|