libro
www.tuyano.com
初心者のためのiphone/ipadプログラミング入門

Interface Builderを使ってアプリを作成する! (1/5)

作成:2011-03-17 08:00
更新:2011-04-02 14:26

■Interface Builderとは?

前回、Xcodeのプロジェクトの中身についてざっと説明しましたが、今回は開発のもう1つの重要アプリケーション「Interface Builder」についてです。Mac OS XやiOSの開発は、Xcodeでソースコードを記述し、Interface BuilderでGUIのデザインをする、というように、2つのアプリを組み合わせて行います。

プロジェクトを作成すると、Xcode 3.2の場合、プロジェクトウィンドウの左側のリストに「Interface Builderファイル」というフォルダが表示されます。この中に、「◯◯ViewController.xib」「MainWindow.xib」という2つのファイルが作成されているはずです。これらがInterface Builderのファイルです。Xcode 4では、プロジェクト名のフォルダの中に、クラスのソースコードファイルとまとめて保管されています。

Interface Builderというのは、「nibファイル」と呼ばれるGUIデザインのファイルを作成するための専用ツールです。プロジェクトにあった「◯◯.xib」というファイルが、nibファイルです(今はxibという拡張子ですが、以前はnibという拡張子になっていた関係から、今でもnibファイルと呼ばれます)。

Xcode 3.2までは、これは独立したアプリケーションとして用意されていました。が、両者の統合化が進み、Xcode 4では、Xcode本体の中にInterface Builderが組み込まれています。このため、3.2までは、nibファイルをダブルクリックしてInterface Builderを起動し編集をしましたが、Xcode 4ではnibファイルを選択すると、Xcodeの内部にInterface Builderの編集画面が現れ、その場で編集することができます。

このInterface BuilderのnibファイルとXcodeのプログラムソースコードは、お互いにうまくやりとりして動くように設計されています。プロジェクトに用意されているクラスにGUI部品を割り当てるためのプロパティや、イベントに対応するメソッドなどを用意し、Interface Builderで作成したGUI部品とそれらのプロパティ・メソッドを関連付けることで、作成したGUIをObjective-Cのクラス内から利用できるようにします。

では、プロジェクトに作成されている2つのnibファイルはそれぞれどういう役割のものなのでしょうか。整理すると以下のようになります。

MainWindow.xib――メインウインドウとなるGUIです。アプリを起動すると、まずこのウインドウが開かれ表示されます。ただし、これはあくまで「ただのウインドウ」であって、何も表示などはされません。デフォルトでは、このウインドウ内に、次の◯◯VewController.xibで作成されているGUIがぺたっと貼りつけられた形で表示されるようになっています。

◯◯VewController.xib――メインウインドウに組み込まれ表示される、実際の表示内容となるGUIです。今回のプロジェクトでは「ビュー」と呼ばれる一般的な表示用部品が背景のように貼りつけられているだけです。GUIの作成は、ここに必要に応じてさまざまなGUI部品を配置していきます。

MainWindow.xibのほうは、アプリのウインドウのいわば土台部分であって、これ自体を操作したりGUIをどうこうしたりということはほとんどない、と考えてよいでしょう。まずは、「◯◯ViewController.xib」というファイルの方をいろいろと編集していくのが基本といえます。

※プログラムリストが表示されない場合

AddBlockなどの広告ブロックツールがONになっていると、プログラムリスト等が表示されない場合があります。これらのツールをOFFにしてみてください。

※関連コンテンツ

「初心者のためのiphone/ipadプログラミング入門」に戻る