※当ブログではアフィリエイト広告を利用しています。
アイコンはiPhone/iPadアプリに必須なものですが、iOS5～7でRetinaディスプレイも対応となると意外に多くのサイズのアイコン画像が必要になります。
そこでiPhone/iPadアプリに必要なアイコンのサイズ一覧をまとめ、複数のサイズのアイコンを一括で生成するバッチを作ってみたのでメモします。
iPhone/iPadアプリに必要なアイコンのサイズ一覧
iOS5～7までのiPhone/iPadアプリに必要なアイコン画像のサイズ一覧です。アプリそのものだけでなく「設定」アプリ用のものやSpotlight用のものも用意する必要があるため、とても数が多いです。
| デバイス | 適用箇所 | サイズ | サイズ(Retina) |
|---|---|---|---|
| iPhone |
設定アプリ用(iOS 5-7) Spotlight用(iOS 5,6) |
29×29 | 58×58 |
| Spotlight用(iOS 7) | – | 80×80 | |
| アプリ用(iOS 5,6) | 57×57 | 114×114 | |
| アプリ用(iOS 7) | – | 120×120 | |
| iPad | 設定アプリ用(iOS 5-7) | 29×29 | 58×58 |
| Spotlight用(iOS 5,6) | 50×50 | 100×100 | |
| Spotlight用(iOS 7) | 40×40 | 80×80 | |
| アプリ用(iOS 5,6) | 72×72 | 144×144 | |
| アプリ用(iOS 7) | 76×76 | 152×152 | |
| その他 | AppStore用 | – | 1024×1024 |
上記のサイズはAsset Catalogでも確認することができます。
iPhoneかiPadどちらか一つであれば多少数が減りますが、ユニバーサルアプリ（iPhone/iPad両対応のアプリ）では全てのサイズが必要となります。
iPhone/iPadアプリに必要なサイズのアイコンを一括生成するバッチ
アイコンを作成する際は、AppStore申請時に必要なサイズ(1024 * 1024)で作成することが多いと思います。そこで縦横1024pxのPNG画像を用意するだけでアプリに必要なサイズのアイコンを全て生成するバッチを作りました。内容と使い方をご紹介します。
バッチの内容
画像のリサイズにはMacの画像処理用の標準コマンドsipsを使っています。以下はバッチの中身（シェルスクリプト）です。
#!/bin/bash
# カレントディレクトリをファイルの場所に変更
cd `dirname $0`
#ファイル名の入力を待つ
echo -n "縮小元となる 1024x1024 アイコンのファイル名(拡張子なし):"
read filename
#アイコンサイズ一覧(px)
array=(29 40 50 57 58 72 76 80 100 114 120 144 152)
for i in "${array[@]}"
do
sips -Z $i ${filename}.png --out ${filename}_${i}x${i}.png
done
縮小元となる画像を読み込み、sipsコマンドを使ってあらかじめ定義してあるサイズに一括で変換をかけるだけの簡単な仕組みです。ソフトのインストール等は必要ありません。適宜改変すれば縮小サイズや出力ファイル名を変えることも可能です。
sipsコマンドについては以下のサイトが参考になりました。
参考サイト：画像の一括リサイズをコマンドラインで！ Macなら標準sipsコマンドで可能だった。
バッチの使い方
バッチはこちらのリンクからダウンロード可能です。ZIPファイル形式(491B)です。
解凍するとMacでダブルクリックで実行可能な.command形式になっています。
バッチファイルの配置
バッチファイルIconResize.commandを、縮小元とする画像と同じフォルダに置きます。縮小元の画像の大きさは1024pxが適当ですが、それ以下のサイズでも152px以上の正方形であればOKです。
バッチファイルに実行権限を付与
Macでは実行権限を付与しないと*.commandファイルが実行できないため、ターミナルでバッチファイルのフォルダまでcdで移動したあと、chmodコマンドで実行権限を付与します。
chmod u+x IconResize.command
バッチの実行
バッチファイルIconResize.commandをダブルクリックで実行します。実行するとターミナルが起動しますが、もし起動しない場合は「右クリック」→「このアプリケーションで開く」→「ターミナル.app」を選択して実行します。
実行すると縮小元ファイルの名前を聞いてくるため、拡張子無しのファイル名を入力します。Icon.pngが縮小元ファイルの場合、Iconを入力するといった具合です。
ファイル名を入力し終わるとアイコンの一括生成が始まります。
アイコンの一括生成が完了すると、バッチファイルと同じ場所に各種サイズのアイコン画像が出力されています。
Finderで「大きさ」を確認すると、ファイル名に記載のものと同じ大きさになっているはずです。
生成されたアイコンはAsset Catalogにセットする等して使用します。
おわりに
Mac標準のコマンドだけで画像の縮小ができるのには驚きました。他にも良いやり方がありそうな気もしますが、これで複数サイズアイコン作成の大変さからは解放されそうです。
