Cocoaの日々

デバイス毎/解像度毎に画像を用意しておき、実行時のデバイスに合わせて適切な画像を自動選択する仕組みが iOS4 から導入された。

画像ファイルの命名規約

デバイス毎/解像度毎の画像を用意する場合、次の命名規約に従う。

標準解像度: <画像名><device_modifier>.<拡張子>
高解像度　: <画像名>@2x<device_modifier>.<拡張子>

[情報元] iPhone Application Programming Guide: Supporting High-Resolution Screens - Updating Your Image Resource Files

高解像度の場合は画像名の後ろに '@2x' を付ける。
（例）ButtonImage@2x.png

<device_modifier> は ~ipad や ~iphone が指定できる。

UIImageのメソッド、imageNamed:, imageWithContentsOfFile: などはこの命名規約を解釈して、基本となるファイル名を渡すと実行しているデバイスに合わせた画像を読み込んでくれる。例えば次のコードがあった場合。

UIImage* ibuttonImage = [UIImage imageNamed:@"ButtonImage"];

iPhone4で実行している場合、"ButtonImage@2x.png" が存在すればそちらを使う。iPhone3GSでは "ButtonImage.png"が使われる。

検証

iPhoneシミュレータを使い検証してみた。違いがわかるように同じ大きさの内容の異なる画像を２枚用意した。

UIImageViewを用意して、これらの画像を表示する。

UIImage* icon = [UIImage imageNamed:@"BrowserIcon"];
 self.iconView.image = icon;

結果は次の通り。

iPhone3（シミュレータ）

iPhone4（シミュレータ）

どちらも意図通りの結果となった。なお iPhone4ではさらにスケーリング（縮小）が行われているのがわかる。そこで次のコードを追加してそれぞれの場合の scaleを見てみた。

NSLog(@"scale=%f", icon.scale);

iPhone3（シミュレータ）

scale=1.000000

iPhone4（シミュレータ）

scale=2.000000

UIImage.scale がそれぞれのケースで適切に設定されるのがわかる。