XIBファイルでUIViewController の見た目を作る


UIViewControllerを使いたかったのだが、載せる部品が多くなりそうだったのでコードで書くのではなくxibファイルで見た目を作成することにした。
問題はXIBを使うのが初めてで、まったくやり方が分からないこと。
よく分からないので、まずXIBファイルを作成してから.m .hファイルを作成するという手順でやっていたのだが、かなりハマって遠回りしてしまった。

今のところ分かったことをメモ。

まずは簡単に動いた方法から。

クラス作成と同時にxibを作る

この方法だと特につまずくことなくxibファイルを使うことができるはず。

XcodeのFileメニューから [File]->[New]->[File…]から[Objective-C class]でsubclassを[UIViewController]として、Sampleクラスを作成。
このとき[With XIB for user interface]をチェックしておく
newFile

あとは、呼び出し元のViewControllerから

UIViewController * VC = [[Sample alloc] initWithNibName:@"Sample" bundle:nil];

などと呼び出せばOK。

実に簡単。

先にXIBファイルを作る方法

先にXIBファイルを作ってしまってから.m .hファイルを追加することもできる。
一度やり方が分かると簡単なんだろうが、私は初めてだったためかすごく苦労した。

一応うまく動いたやり方を書く。

まずXIBファイルを作り、UIViewControllerの見た目を作ろうとやってみる。
XcodeのFileメニューから [File]->[New]->[File…]から[User Interface]の[Empty]でxibファイルを作成(Sample.xibとする)。
newXib
これで空のxibファイルが作成されるので、ここにUIViewを貼付ける。
UIViewControllerではなく、UIViewを作ること。

次に、このXIBと関連付けるクラスを作る。
XcodeのFileメニューから [File]->[New]->[File…]から[Cocoa touch]の[Objective-C class]でsubclassを[UIViewController]として、Sampleクラスを作成。
newClass0
newClass
さて、どうやってこの.m .hファイルと.xibファイルを関連づけるかだが、以下のように File’s ownerを設定してやればよい。
Xibファイルの[File’s Owner]を選択し、そのCustom ClassをSampleクラスにする。
filesownerClass
するとFile’s OwnerのConnections Inspectorにviewという項目が現れるので、これとUIViewを結びつければよい。
viewConnect

ここまでやってようやく クラス作成時にXIBファイルも作ってしまうのと同じ状態になったようで、無事動いた。

私はなぜ苦労したのか

私がハマったのは、UIViewControllerの外観を作るのだから、XIBにもUIViewControllerを貼らないといけないのだろうと思っていたため。
XIBにUIViewではなくUIViewControllerを作ってしまうと、File’s OwnerとUIViewControllerを結びつけることができない。
そしてそのまま呼び出すと

*** Terminating app due to uncaught exception ‘NSInternalInconsistencyException’, reason: ‘-[UIViewController _loadViewFromNibNamed:bundle:] loaded the “Sample” nib but the view outlet was not set.’

というようなエラーになってしまう。

このエラーから情報を検索すると「File’s OwnerとViewをコネクトさせる必要がある」ということは分かるのだが、やり方が分からなくて随分長いこと悩んでしまった。

さらに、File’s OwnerのCustom classをUIViewControllerの派生クラスにしてやらないといけない、というのもハマった点。
イメージ的には、File’s OwnerとなったUIViewControllerに貼付けるUIViewをxibで管理する、ということにしてやらないといけないってことかな。

参照サイト

最終的にこちらのサイトのやり方をよくよくよーく見て、自分の間違いに気づいた次第です。
XIBをViewControllerに割り付けようとするとエラー: みこさんちの開発日記
有用な情報に感謝。

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です