今回は、Cocoaの大きな特徴でもあるコネクションについて勉強します。色んな部品をつなげることでアプリケーションが連携して動きだします。前回作成したメモ帳に印刷機能を追加していきます。
推奨環境 この解説は、以下の環境を前提に作成し、動作確認等を行っています。ご確認ください。
改版履歴
前回勉強した要領で印刷ボタンを追加します。ボタンはツールパレットの左から2番目に入っています。最も一般的なプッシュボタンを配置します(ボタンはNSButtonというクラスです)。
ボタンのタイトルを変更するには、ボタンをダブルクリックします。すると、タイトルを入力できる状態になります。インフォパネルの「 Attributes → Title 」に入力しても同じです。ここでは、「 Print... 」とタイトルをつけました。
このボタンをウィンドウを広げたときに、ウィンドウの右下に常に位置するようにしてみましょう。ウィンドウの上辺との距離と左辺との距離が変わってもよいので、下図のようになります。
ここで、コントロールキーを押したまま「 Print... 」ボタンの上でマウスボタンを押し、そのままドラッグします…(1)。すると、ボタンからマウスカーソルの位置まで線が表示されます。それをテキストビューの方へ伸ばしていきます。テキストビューの枠がハイライト表示されたら、そこでマウスボタンを放します。すると、インフォパネルには、テキストビューの持っている機能(アクション)の一覧を表示します。印刷機能を使いたいので「 print: 」を選択して…(2)、「 connect 」ボタンをクリックします…(3)。
今の操作によって、「 Print... 」ボタンをクリックするとテキストビューの持っている「 print: 」アクションが呼び出され、印刷ができるようになりました。このように、Interface Builderでは、ボタンクリックなどのユーザの操作が発生したときに、何を実行するかをこのようなコネクションで決めることができます。
実際に動くかどうか確かめてみましょう。「 ビルドして実行 」をクリックして実行し、Memoが起動したら「 Print... 」ボタンをクリック。印刷ダイアログが表示されますので、さらに「 Print 」ボタンをクリックすると印刷が始まります。ここでは、「 Preview 」ボタンを押した結果を掲載しました。
印刷といっても割と簡易的なものではあります。しかし、一般に印刷というと色々と面倒なことをしないといけないことが多いものです。何もコーディングせず、マウス操作だけで印刷ができるということは、どんなにいい加減に作ったソフトでも、最低限の印刷機能が装備されることになるわけですね。しかも、Mac OS XのグラフィックエンジンはPDFベースですし、「 Save As PDF... 」ボタンでPDFファイルへの出力も可能です。後はグラフィックツールにお任せということもできるわけです。
ここで、もうちょっと複雑な印刷を試してみます。アドレス帳の印刷です。まずは、アドレス帳のためにウィンドウをもう1つ増やしてみましょう。パレットウィンドウの左から4番目にウィンドウ関連の部品が入っていますので、そこを開きます…(1)。「 Window 」と書かれているのがウィンドウですので、それをMainMenu.nibのドキュメントウィンドウへドロップ…(2)。これで、ウィンドウが追加されました。
このウィンドウの属性を1つ変えておきます。「 Attributes → Visible at launch time 」にチェックをつけます。アプリケーション起動時にウィンドウを表示するかを決める属性です。デフォルトではオフになっているので実行しても表示されませんので注意が必要です。
次に、下図のようにビューを配置していきます。メモ帳から増えているのは、「 Name : 」や「 Address : 」という説明のためのテキストを表示するビューと名前を入力するための1行テキスト入力のビューです。パレットウィンドウのテキスト関連のところにあります。これらは、全てNSTextFieldというクラスで、入力可能かどうかだけが違います。
「 Name : 」と「 Address : 」はテキストが右揃いになっていますが、これはインフォパネルから変更できます。「 Attributes → Alignment 」から右向きの矢印が書いているボタンをクリックします。
これらの配置したビューをまとめて印刷するようにしたいので、ビューのグループ化の機能を使ってこれらをグループ化して、そのグループに対して「 print: 」アクションを実行するようにします。「 Print... 」ボタン以外を全て選択した状態で、「 Layout → Make subview of → Box 」メニューを実行します。
すると、以下のようにグループ化された状態になります(図はレイアウト調整後の状態です)。外側の枠は、NSBoxというクラスで、このようにグループ化を行うことができます。グループ化されて、中に含まれてしまったビューにアクセスするためには、グループの親をダブルクリックします。
グループ化ができたら、NSBoxのタイトルをダブルクリックして「 Profile 」に変えて、いよいよ印刷機能の組み込みです。「 Print... 」ボタンからコントロールキーを押したままNSBoxへコネクションラインを伸ばして、前回と同じように「 print: 」アクションに接続します。
実行したら何か入力して、「 Print... 」ボタンをクリックしてみましょう。プレビューすると以下のような結果が得られると思います。
ビューというのは親子関係を持つことができるようになっています。今回のケースでは、グループを囲むボックスが親のビューであり、中に入っているテキストフィールドが子供のビューになります。親のビューに「 print: 」アクションの実行を指示すると、親は自分が描画した後に、全ての子供に「 print: 」アクションを実行させるようになっています。そのために、上図のような結果が得られるわけです。