Xcode 5 のアセットカタログでアイコンや画像を管理する : Objective-C プログラミング

Asset Catalog

Xcode 5 では Asset Catalog を使うことで、アイコンや画像などを一元管理できます。

アプリのアイコンや起動イメージについては、これまでもターゲットの General 設定のところからデバイスの種類ごとに登録できるようになっていて管理しやすかったですけど、そこで登録したアイコンなどは、これまではひとつひとつのファイルとしてプロジェクトに追加されていました。

通常の画像イメージも、ひとつの画像に対してもうひとつ Retina 用の 2 倍の解像度を持ったファイルを用意する必要があって、画像が多くなったときにファイルの数が膨れ上がります。

そんな増えがちな複数ファイルの画像リソースを、このアセットカタログを使うことで、ひとつの .xcassets ファイルとして扱えるようになります。

Asset Catalog を使用する

Asset Catalog は、通常のファイルと同様に作成できます。

プロジェクトに Resource から Asset Catalog を選択して追加すると、プロジェクト内に .xcassets という拡張子のファイルが出来上がります。

ファイル名はとりあえず何でもよいので、どんな画像リソースを入れる入れ物なのかが判るようにしておくと良いでしょう。

 

名前で肝心になってくるのは、この Asset Catalog 内に設定する名前です。

それがいわば今までのファイル名的な役目になって、それらの名前を使って Asset Catalog 内のどの画像を使うかを指定することになります。

Asset Catalog でアプリアイコンを管理する

アイコンリソースを作成する

Asset Catalog でアプリアイコンを扱うには、Asset Catalog ファイル内でアプリアイコン専用のリソースを作成する必要があります。

Asset Catalog エディタの左下にある [+] ボタンのメニューから "New App Icon" を選択すると、Asset Catalog 内に AppIcon というリソースが作成されます。

ちなみにこの "AppIcon" という名前は、別の名前に変更できます。

ここにはちゃんと何ピクセルの画像が必要かが書かれているので、それに合った画像ファイルをその升にドラッグアンドドロップで投げ込んであげると、Asset Catalog 内に画像リソースが追加されます。ちなみに "2x" と書かれているところは、表示されているサイズの 2 倍の解像度の画像が求められているのに注意です。

アプリアイコンとして登録する

ともあれこのアイコンリソースを作成したら、アプリの TARGET 設定の General タブで、この Asset Catalog 内に作ったアイコンリソースの名前を選択できるようになっています。

App Icons として Asset Catalog 内のアイコンリソースを指定すれば、あとはアプリを実行する環境に合わせて、適切なアイコンがアプリに設定されます。

内包するアイコンサイズを追加・削除する

アプリによっては iPhone 専用だったり、iPad 専用だったり、両対応のユニバーサルアプリだったりするので、Asset Catalog に入れる必要のあるアイコン画像は様々です。

そのような調整は、Asset Catalog ファイル内でアイコンリソースを選択した状態で Attributes Inspector を表示すると、そこで必要なアイコンの種類を選択できます。

ここで必要なアイコンサイズにチェックを入れると、Asset Catalog のアイコンリソースにそれを入れる枠と、必要なピクセルサイズが表示されるので、他のアイコンと同じように画像を設定します。

ちなみにここの "iOS icon is pre-rendered" という項目にチェックを入れると、iOS 6.1 以前でアイコンに自動で光沢が設定されないようにできます。

Asset Catalog で起動イメージを管理する

アプリには、起動直後に数秒ほど表示される起動イメージ画像を設定できます。

Asset Catalog を使った起動イメージの設定も、アプリアイコンの時と手順はほとんど同じです。

Asset Catalog 内に起動イメージ用のリソースを作成したら、アイコンのときと同じように、画像をドラッグアンドドロップしたり、Attributes Inspector から必要な画像サイズを選択します。

起動イメージ用のリソースを作成できたら、こちらも TARGET 設定の General タブでリソース名を選択すれば、そのリソースが起動イメージとして採用されます。

Asset Catalog で普通の画像を扱う

Asset Catalog では、アイコンや起動イメージだけでなく、通常の画像イメージも扱えます。

今までは普通の画像を用意する時、Retina 対応も考えると、ある画像 image.png と、その画像サイズの 2 倍の解像度の image@2x.png の二つのファイルを用意してプロジェクトに登録する必要がありましたが、Asset Catalog を使うことで、ひとつのリソース名に普通サイズと x2 サイズの 2 つの画像を登録するという持ち方になります。

通常の画像リソースを作成する

このような通常の画像リソースを作成するには、Asset Catalog 内の左下の [+] ボタンから "New Image" を選択します。

そうして出来上がったリソース内には、好きなサイズの画像と、Retina 用の 2 倍の解像度の画像をドラッグアンドドロップで登録できます。

このとき、ここで指定したリソース名は Interface Builder やプログラム内から画像リソースを指定するときに使うので、画像にあった名前を設定するようにします。

登録できる画像リソースの種類

この画像リソースには、通常サイズと Retina サイズという 2 種類以外にも画像リソースを登録できます。

ここで面白そうだったのが "iPhone" と "Retina 4-inch" だったんですけど、試してみたところ "Retina 4-inch" に登録した画像リソースは、4 インチサイズの iPhone 環境でも使われることはなさそうでした。

たぶんきっと 3.5 インチと 4.0 インチとで別々の画像を表示できるのかと思ったのですけど、バグなのか、それとも自分の思い違いか、思ったように切り替わってはくれませんでした。

Objective-C から Asset Catalog を読み込む

Xcode 5.0 では、通常の画像リソースに限って、Objective-C プログラムを使って Asset Catalog 内の画像リソースを取得することができるました。

画像リソースの読み込み方法は、これまでの画像ファイルのときと同じで、UIImage の imageNamed: メソッドを使って読み込めます。

注意点は今回は画像ファイル名ではなく Asset Catalog 内で付けた名前を指定するところです。敢えて拡張子っぽい名前を付けていなければ、上記の例のように、名前だけを imageNamed: の引数に渡して、その画像のデータを取得できます。

[ もどる ]