技術メモ

技術的なメモを載せていきます。

xcode8.3.x アプリアイコンの登録を簡略化

f:id:unkillonline:20170724144616j:plain

アプリを新規に追加するときなどに都度都度、手作業で 入れ込んでいたIconファイルですが、年々増えていくだけでなく そのわかりにくさも半端じゃないので、簡略化してしまうことに しました。

macOSに標準でついている sips コマンドを使ってベースのアイコンをリサイズして、xcodeのAssetsにjson形式で記述してやることで、簡略化します。

d.hatena.ne.jp

■ 手順

1. ベースのアイコンファイルを準備
2. sipsでリサイズ
3. AssetsのContens.json書き換え

■ 詳細

1. ベースのアイコンファイルを準備

昔は透過のPNGとかが流行りでしたが近年は塗りが基本なので 1024px x 1024px 以上の正方形で背景が透明ではないベースアイコンを用意します。

2. sipsでリサイズ

用意したベースアイコン(名前はIcon.png)を特定のフォルダに入れて以下のコマンドを投入します。

sips -Z 40 Icon.png --out Icon-20@2x.png
sips -Z 40 Icon.png --out Icon-20@2x-1.png
sips -Z 40 Icon.png --out Icon-40@.png
sips -Z 60 Icon.png --out Icon-60@.png
sips -Z 58 Icon.png --out Icon-29@2x.png
sips -Z 58 Icon.png --out Icon-29@2x-1.png
sips -Z 87 Icon.png --out Icon-29@3x.png
sips -Z 80 Icon.png --out Icon-40@2x.png
sips -Z 80 Icon.png --out Icon-40@2x-1.png
sips -Z 120 Icon.png --out Icon-40@3x.png
sips -Z 120 Icon.png --out Icon-60@2x.png
sips -Z 180 Icon.png --out Icon-60@3x.png
sips -Z 20 Icon.png --out Icon-20@.png
sips -Z 29 Icon.png --out Icon-29@.png
sips -Z 76 Icon.png --out Icon-76@.png
sips -Z 152 Icon.png --out Icon-76@2x.png
sips -Z 167 Icon.png --out Icon-83_5@2x.png

ここで、同じサイズ(たとえば 40px x 40px は 20px の x2があるからいいか。。と思っていたのですが、どうやら同じファイル名では登録できないようなので、面倒でも別々のファイル名にしておきます。

3. AssetsのContens.json書き換え

f:id:unkillonline:20170724144256p:plain

対象のプロジェクトの Assets.xcassetsnの下に 生成したアイコンファイル(Icon.png以外)を移動し、ディレクトリ内にあるContens.jsonを以下のように書き換えます。 保存すると瞬時に反映されると思います。

{
  "images" : [
    {
      "size" : "20x20",
      "idiom" : "iphone",
      "filename" : "Icon-20@2x.png",
      "scale" : "2x"
    },
    {
      "size" : "20x20",
      "idiom" : "iphone",
      "filename" : "Icon-60@.png",
      "scale" : "3x"
    },
    {
      "size" : "29x29",
      "idiom" : "iphone",
      "filename" : "Icon-29@2x.png",
      "scale" : "2x"
    },
    {
      "size" : "29x29",
      "idiom" : "iphone",
      "filename" : "Icon-29@3x.png",
      "scale" : "3x"
    },
    {
      "size" : "40x40",
      "idiom" : "iphone",
      "filename" : "Icon-40@2x.png",
      "scale" : "2x"
    },
    {
      "size" : "40x40",
      "idiom" : "iphone",
      "filename" : "Icon-40@3x.png",
      "scale" : "3x"
    },
    {
      "size" : "60x60",
      "idiom" : "iphone",
      "filename" : "Icon-60@2x.png",
      "scale" : "2x"
    },
    {
      "size" : "60x60",
      "idiom" : "iphone",
      "filename" : "Icon-60@3x.png",
      "scale" : "3x"
    },
    {
      "size" : "20x20",
      "idiom" : "ipad",
      "filename" : "Icon-20@.png",
      "scale" : "1x"
    },
    {
      "size" : "20x20",
      "idiom" : "ipad",
      "filename" : "Icon-20@2x-1.png",
      "scale" : "2x"
    },
    {
      "size" : "29x29",
      "idiom" : "ipad",
      "filename" : "Icon-29@.png",
      "scale" : "1x"
    },
    {
      "size" : "29x29",
      "idiom" : "ipad",
      "filename" : "Icon-29@2x-1.png",
      "scale" : "2x"
    },
    {
      "size" : "40x40",
      "idiom" : "ipad",
      "filename" : "Icon-40@.png",
      "scale" : "1x"
    },
    {
      "size" : "40x40",
      "idiom" : "ipad",
      "filename" : "Icon-40@2x-1.png",
      "scale" : "2x"
    },
    {
      "size" : "76x76",
      "idiom" : "ipad",
      "filename" : "Icon-76@.png",
      "scale" : "1x"
    },
    {
      "size" : "76x76",
      "idiom" : "ipad",
      "filename" : "Icon-76@2x.png",
      "scale" : "2x"
    },
    {
      "size" : "83.5x83.5",
      "idiom" : "ipad",
      "filename" : "Icon-83_5@2x.png",
      "scale" : "2x"
    }
  ],
  "info" : {
    "version" : 1,
    "author" : "xcode"
  }
}

以上です。

iPhone8が出たらまた増えるんだろうか。。