App icon

2019-10-19

generator-rn-toolboxを使ってアプリアイコンを作って見ましょう。

Deprecated

このブログポストはgenerator-rn-toolboxがDeprecatedされたのでもう管理しません。generator-rn-toolboxの新しいライブラリであるreact-native-makeを使うことをおすすめします。

react-native-makeに関しては下記のブログをご参考してください。

概要

mac osx上で generator-rn-toolboxを使ってアプリアイコンを作る方法を説明します。

イメージ準備

アプリアイコンで使う1024x1024pxサイズのイメージを準備します。

ライブラリインストール

下記のコマンドでライブラリをインストールします。

npm install -g yo generator-rn-toolbox
  • generator-rn-toolbox: RNのプロジェクトを助けてくれるツールを提供してるライブラリです。詳しくは公式サイトを参考して下さい。(公式サイト:generator-rn-toolbox
  • yo: generator-rn-toolboxを起動するためのライブラリです。

アプリアイコンを生成するためにはimagemagickのインストールが必要です。

brew install imagemagick

使い方

  • 下記のコマンドでアイコンを作ります。
yo rn-toolbox:assets --icon <path to your icon>

アイコンが生成してプロジェクトへ反映しました。プロジェクトを実行してアイコンが反映されたかを確認しましょう。

// iOS
react-native run-ios

//android
react-native run-android

アイコンがちゃんと表示できない方はシミュレータまたは端末のアプリを削除してもう一度プロジェクトを実行して見てください。

参考

Buy me a coffeeBuy me a coffee
Posts