アプリアイコンを設定
アプリの顔となるもの。それは、アプリアイコンです。
今回は設定方法を紹介します。
アイコンを用意する過程で便利サイトなども紹介していきます。
アイコンの準備
まずは、アイコンを用意します。
今回はCanvaで作成したアプリアイコンを用意しました。
1024*1024の大きさのものを用意しました。
大きさはこの後にリサイズしたものを作ってもらうので、適当な大きさのもので大丈夫です。
色々な大きさのアイコンを用意
さてここから色々なサイズの画像を用意します。
アプリアイコンは画面サイズに応じたものを設定できます。
ただ、全てのサイズをいちいち作るのは大変です。
そこで下記のサイトを利用することで自動的にAndroid/iOSの向けのアイコンを作れます
上記のリンクを開いておいてください。
【手順】
- ヘッダータブのApp Iconクリック
- 画像をドラッグしてアップロード
細かい手順があるので①、②として説明します。
① 画像を開いてapp-imageへ画像を配置する
変換する元画像をapp-imageへアップロードしてください。
② 使用OSを選択する(Android/iOS)
OSごとに作るかどうか設定できるので自分が作りたいものをチェックしてください。
今回は、iPhoneだけですがAndroidのものも作ってみます。 - Generateボタンを押す
画像ファイルが作成されて、ダウンロードされます。
Xcodeからアイコンを設定
- app Imageでダウンロードしたファイルを展開する
今までの手順を行うと、AppIcons.zipファイルがダウンロードされているので解凍してください。
ダブルクリックしたりして解凍してください。
解凍されました。
2. XcodeのAssetsを開く
Xcodeでの作業をしていきます。
プロジェクトを作成した際に、Assetsファイルが作成されているので開きましょう。
3. デフォルトで作られたAppIconを削除しておく
Assetsを開くと、デフォルトでAppIconがあります。
新しくアイコンを作成する際に紛らわしいので一度削除します。
4. ファイルをドラッグして設定
解凍しておいた画像ファイル(AppIconsフォルダ)の中を見てみましょう。
Assets.scasetsを開きます。
中にあるAppIcon.appiconsetをXcodeへドラッグドロップしましょう。
5. AppIconが設定される
下画像のように自動で設定してくれます。
削除したAppIconもできていますね。
確認（Simulator）
設定したのでSimulatorでアイコンが設定できているか確認しましょう。
XcodeでSimulatorを指定して実行してください。
ちゃんと設定したアイコンが表示されていますね。
実機をお持ちの方は実機での確認もやってみてください〜
終わりに
アプリの顔と呼べるアイコンですが、毎回手順どうだったかなと思ってメモを見返しています。
一度やってしまえばシンプルですが、最初にやる人にとってはわからないことが多いと思います。
ぜひ、オリジナルのアイコンを作って設定してみてください。