Interface Builder上でのシステムパターン色はiPhone用とiPad用とで区別されている
iPhone/iPadのユニバーサルアプリの制作中、Viewの背景色をInterface Builderで設定したにもかかわらず、ビルドと実行をしてみるとそのViewの背景色が設定とは違う色(真っ赤)になっていることがあった。原因を調べてみると、これはInterface Builder上で設定するシステムパターン色がiPhoneとiPadで区別されているためであることがわかった。気をつけていれば陥ることがないような問題ではあるが、今回はうっかりしていて原因に気がつくまで時間がかかってしまった。記念に内容をまとめておくことにする。
動作確認環境は次のとおり。*1
- iOS SDK 4.2
- iPod touch 3G (iOS 4.2.1)
- 初代iPad (iOS 4.2.1)
対象デバイスを「Universal」とする新規プロジェクトをXcodeで作成する。テンプレートから生成されたプロジェクトには、起動直後に表示される画面のUIを設計するためのファイル(iPad用にはMainWindow_iPad.xib、iPhone用にはMainWindow_iPhone.xib)がある。これらのファイルで扱っているWindowの背景色を設定することで、上記の現象を具体的に確認していくことにする。
xibファイルをInterface Builderで開き、Windowを選択する。次に、Attribute InspectorでBackgroundの欄をクリックし、色選択用のウィンドウを表示する。色選択用のウィンドウには複数のタブがあるが、ここでは「Color Palettes」タブを選択する。このタブではシステムカラーやWebセーフカラーを選択することができる。ドロップダウンリストには「iPhone SDK」や「iPad SDK」というパレットがある。
ここで注意が必要だ。iPadの画面用に「iPhone SDK」パレットの色を使ったりiPhoneの画面用に「iPad SDK」パレットの色を使ったりすると、Interface Builder上では正しく色が設定されているように見えても、Xcode上でビルドと実行をしてみると色が正しく設定されていない。逆に、iPadの画面用に「iPad SDK」パレットの色を、iPhone用に「iPhone SDK」パレットの色を設定すると、実行時にもその色が設定されている。
*1:iOS Simulatorでも確認できる。