Image AssetStudioでアプリアイコンを作成する



Create An App Icon With Image Asset Studio



Android Studioには、マテリアルアイコン、カスタム画像、テキスト文字列から独自のアプリアイコンを生成するのに役立つImage AssetStudioと呼ばれるツールが含まれています。アプリでサポートされている一般的な画面密度ごとに適切な解像度のアイコンのセットを生成します。 Image Asset Studioは、新しく生成されたアイコンをプロジェクトのres /ディレクトリの密度固有のフォルダに配置します。実行時に、Androidは、アプリが実行されているデバイスの画面密度に基づいてリソースを使用します。

Image Asset Studioは、次のアイコンタイプの生成に役立ちます。



  • ランチャーアイコン
  • アクションバーとラベルアイコン
  • 通知アイコン

Image AssetStudioについて

Image Asset Studioは、さまざまな種類のアイコンをさまざまな密度で作成し、プロジェクト内のどこに配置されているかを示すのに役立ちます。アイコンを調整したり背景を追加したりするためのツールが含まれており、結果をプレビューペインに表示して、期待どおりに表示することができます。これらのツールを使用すると、アイコンのデザインとインポートのプロセスを大幅に簡素化できます。次のセクションでは、作成できるアイコンの種類と、使用できる画像およびテキスト入力について説明します。

ランチャーアイコン

ランチャーアイコンは、アプリをユーザーに表示するグラフィックです。できる:



  • デバイスとホーム画面にインストールされているアプリのリストに表示されます。
  • アプリへのショートカットを表します(たとえば、連絡先のショートカットアイコンは、連絡先の詳細を開きます)。
  • ランチャーアプリによって使用されます。
  • アプリの第一印象を作成します。
  • ユーザーがGooglePlayでアプリを見つけられるようにします。

Image Asset Studioは、mdpi、hdpi、xhdpi、xxhdpi、xxxhdpiなど、推奨されるユニバーサル画面密度用に個別のアイコンを自動的に作成します。これにより、アイコンがさまざまな画面やデバイスで正しく表示されるようになります。アイコンをres / mipmap-density /ディレクトリの適切な場所に配置します。 Image Asset Studioは、GooglePlayストアでの使用に適した512x512ピクセルの画像を作成することもできます。

アプリが古いAndroidバージョンをサポートしている場合でも、ランチャーアイコンにはマテリアルデザインスタイルを使用することをお勧めします。

詳細については、ランチャーアイコンと製品アイコン-マテリアルデザインを参照してください。



アクションバーとラベルアイコン

アクションバーアイコンは、各アクションアイテムを表すアクションバーに配置されるグラフィック要素です。詳細については、「アクションの追加と処理」、「アプリバー-マテリアルデザイン」および「アクションバーデザイン」を参照してください。
タグアイコンは、マルチタブインターフェイスで個々のタグを表すために使用されるグラフィック要素です。各ラベルアイコンには、チェックされていない状態と選択されている状態の2つの状態があります。詳細については、「スライドビューとラベル付きラベルの作成-マテリアルデザイン」を参照してください。
Image Asset Studioは、mdpi、hdpi、xhdpi、xxhdpiなど、推奨されるユニバーサル画面密度用に個別のアイコンを自動的に作成します。アイコンをres / drawable-density /ディレクトリの適切な場所に配置します。

アプリが古いAndroidバージョンをサポートしている場合でも、アクションバーとラベルアイコンにはマテリアルデザインスタイルを使用することをお勧めします。 appcompatおよびその他のサポートライブラリを使用して、マテリアルデザインUIを古いプラットフォームバージョンに提供します。

Image Asset Studioの代わりに、Vector AssetStudioを使用してアクションバーとラベルアイコンを作成することもできます。ベクター画像はシンプルなアイコンに最適で、APKのサイズを小さくすることができます。

通知アイコン

通知は、アプリの通常のUIの外部でユーザーに表示できるメッセージです。システムに通知を送信するように指示すると、最初に通知領域にアイコンとして表示されます。通知の詳細を表示するには、ユーザーは通知ドロワーを開くことができます。通知領域と通知ドロワーはすべてシステムによって制御される領域であり、ユーザーはいつでも表示できます。

Image Asset Studioは、mdpi、hdpi、xhdpi、xxhdpiなど、推奨されるユニバーサル画面密度用に個別のアイコンを自動的に作成します。アイコンをres / drawable-density /ディレクトリの適切な場所に配置します。

  • Android 2.2(APIレベル8)以下のアイコンは、res / drawable-density /ディレクトリに配置されます。
  • Android 2.3から2.3.7(APIレベル9から10)のアイコンはres / drawable-density-v9 /に配置されます
    ディレクトリ内。
  • Android 3(APIレベル11)以降のアイコンは、res / drawable-density-v11 /ディレクトリに配置されます。アプリがAndroid2.3〜2.3.7(APIレベル9〜10)をサポートしている場合、Image Asset Studio
    アイコンの灰色のバージョンを生成します。更新されたAndroidバージョンは、Image AssetStudioによって生成された白いアイコンを使用します。

詳細については、通知、通知マテリアルデザイン、Android 5.0での通知の変更、Android 4.4以前での通知、Android3.0以前でのステータスバーアイコンを参照してください。

クリップ・アート

Image Asset Studioを使用すると、GoogleマテリアルアイコンをPNG形式で簡単にインポートできます。ダイアログからアイコンを選択するだけです。詳細については、マテリアルアイコンを参照してください。

画像

独自の画像をインポートして、アイコンの種類を調整できます。 Image Asset Studioは、PNG(推奨)、JPG(許容)、およびGIF(不承認)のファイルタイプをサポートしています。

テキスト文字列

Image Asset Studioを使用すると、さまざまなフォントのテキスト文字列を入力してアイコンに配置できます。テキストアイコンをPNGファイルに変換し、さまざまな密度を生成します。コンピュータにインストールされているフォントを使用できます。

Image AssetStudioを実行する

Image Asset Studioを起動するには、次の手順に従います。

  1. Android Studioで、Androidアプリを開きます。
  2. プロジェクトウィンドウで、Androidビューを選択します。
  3. resフォルダーを選択し、 ファイル>新規>画像アセット 。または、resフォルダーを右クリックして、 新規>画像アセット 。他のいくつかのプロジェクトビューとフォルダにもこのメニュー項目があります。表示されます Image Asset Studio
  4. ランチャーアイコンの作成、アクションバーまたはラベルアイコンの作成、または通知アイコンの作成を続行します。

ランチャーアイコンを作成する

Image Asset Studioを開いた後、次の手順に従ってランチャーアイコンを追加できます。

  1. アイコンタイプ フィールドで、ランチャーアイコンを選択します。

  2. 選択 資産タイプ 次に、下のフィールドにアセットを指定します。

    • クリップ・アート フィールドで、ボタンをクリックします。 [アイコンの選択]ダイアログで、[マテリアル]アイコンを選択し、[OK]をクリックします。
    • フィールドに、画像のパスとファイル名を指定します。 [...]をクリックしてダイアログを表示します。
    • テキスト フィールドにテキスト文字列を入力し、フォントを選択します。
      アイコンは、ウィザードの右側の[ソースアセット]領域と下部のプレビュー領域に表示されます。
  3. (オプション)名前と表示設定を変更します。
    1.1。 名前 -デフォルトの名前を使用したくない場合は、新しい名前を入力できます。リソース名がプロジェクトにすでに存在する場合(ウィザードの下部にエラーメッセージが表示されます)、リソース名は上書きされます。名前には、小文字、アンダースコア、および数字のみを含めることができます。
    二。 トリム -アイコングラフィックとソースアセットの境界線の間のマージンを調整するには、[はい]を選択します。これにより、アスペクト比を維持しながら透明なスペースが削除されます。ソースアセットを変更しないようにするには、[いいえ]を選択します。デフォルト値は次のとおりです。
    3.3。 パディング- 4つの側面すべてでソースアセットのパディングを調整する場合は、スライダーを動かします。 -10%から50%の間の値を選択してください。 [トリム]も選択すると、最初にトリミングされます。デフォルトは0%です
    四。 前景 -クリップアートまたはテキストアイコンの前景色を変更するには、フィールドをクリックします。 [色の選択]ダイアログで、色を指定して[選択]をクリックします。新しい値がフィールドに表示されます。デフォルト値は000000です。
    5.5。 バックグラウンド -背景色を変更するには、フィールドをクリックします。 [色の選択]ダイアログで、色を指定して[選択]をクリックします。新しい値がフィールドに表示されます。デフォルト値は次のとおりです。FFFFFF
    6.6。 スケーリング -アイコンのサイズに合わせるには、[切り抜き]または[縮小して合わせる]を選択します。画像の端を切り抜くには、[切り抜き]を選択します。[縮小]を選択すると、画像の端は切り取られません。それでもソースアセットが適切でない場合は、必要に応じてパディングを調整できます。デフォルト値は次のとおりです。縮小してフィット
    7。 形状 -ソースアセットに背景を追加するには、円、正方形、垂直長方形、または水平長方形を含む形状を選択します。透明な背景を使用するには、[なし]を選択します。デフォルト値は次のとおりです。Square
    8.8。 効果 -正方形または長方形の右上隅に面取り効果を追加する場合は、DogEarを選択します。不要な場合は、「なし」を選択してください。デフォルト値は次のとおりです。なし
    Image Asset Studioはアイコンを透明な正方形に配置するため、端にパディングがあります。パディングは、標準のドロップシャドウアイコン効果のための十分なスペースを提供します。

  4. [次へ]をクリックします。

  5. リソースディレクトリを変更することを選択できます。
    Resディレクトリ-イメージアセットを追加するリソースソースセットを選択します:src / main / res、src / debug / res、src / release / res、またはユーザー定義のソースセット。プライマリソースセットは、デバッグおよびリリースソースセットを含むすべてのビルドバリアントに適用されます。デバッグおよびリリースソースセットは、プライマリソースセットを置き換え、ビルドバージョンに適用されます。デバッグソースセットはデバッグ専用です。新しいソースセットを定義するには、[ファイル]> [プロジェクト構造]> [アプリ]> [ビルドタイプ]を選択します。たとえば、テストソースセットを定義し、右下隅に「ベータ版」というテキストを含むアイコンを作成できます。詳細については、ビルドバリアントの設定を参照してください。
    [出力ディレクトリ]領域に表示される画像とフォルダは、[プロジェクト]ウィンドウのプロジェクトファイルビューに表示されます。

  6. [完了]をクリックします。

Image Asset Studioは、さまざまな密度の画像をミップマップフォルダーに追加します。

アクションバーまたはラベルアイコンを作成する

Image Asset Studioを開いたら、次の手順に従ってアクションバーまたはラベルアイコンを追加できます。

  1. [アイコンの種類]フィールドで、[アクションバー]と[タブアイコン]を選択します。
  2. [アセットタイプ]を選択し、下のフィールドにアセットを指定します。
  3. [クリップアート]フィールドで、ボタンをクリックします。選択アイコンで
    ダイアログで、マテリアルアイコンを選択し、[OK]をクリックします。 [パス]フィールドで、画像のパスとファイル名を指定します。 [...]をクリックしてダイアログを表示します。 [テキスト]フィールドにテキスト文字列を入力し、フォントを選択します。
    アイコンは、ウィザードの右側の[ソースアセット]領域と下部のプレビュー領域に表示されます。
  4. (オプション)名前と表示オプションを変更します。名前-
    デフォルトの名前を使用したくない場合は、新しい名前を入力できます。リソース名がプロジェクトにすでに存在する場合(ウィザードの下部にエラーメッセージが表示されます)、リソース名は上書きされます。名前には、小文字、アンダースコア、および数字のみを含めることができます。
    トリム-アイコングラフィックとソースアセットの境界線の間のマージンを調整するには、[はい]を選択します。これにより、アスペクト比を維持しながら透明なスペースが削除されます。ソースアセットを変更しないようにするには、
    いいえ。デフォルト値は次のとおりです。パディングなし-4つの側面すべてでソースアセットのパディングを調整する場合は、スライダーを動かします。 -10%と50%を選択します
    の間の値。 [トリム]も選択すると、最初にトリミングされます。デフォルト値は次のとおりです。0%テーマ-HOLO_LIGHTまたはを選択します
    HOLO_DARK。または、[色の選択]ダイアログで色を指定し、[カスタム]を選択して、[カスタム色]をクリックします
    フィールド。デフォルト値は次のとおりです。なしImageAsset Studio
    透明な正方形の内側にアイコンを作成するため、エッジにいくつかのパディングがあります。パディングは、標準のドロップシャドウアイコン効果のための十分なスペースを提供します。
  5. [次へ]をクリックします。
  6. リソースディレクトリの変更を選択できます。ResDirectory-
    イメージアセットを追加するリソースソースセットを選択します:src / main / res、src / debug / res、src / release / res
    またはユーザー定義のソースセット。プライマリソースセットは、デバッグおよびリリースソースセットを含むすべてのビルドバリアントに適用されます。デバッグおよびリリースソースセットは、プライマリソースセットを置き換え、ビルドバージョンに適用されます。デバッグソースセットはデバッグ専用です。新しいソースセットを定義するには、
    ファイル>プロジェクト構造>アプリ>ビルド
    タイプ。たとえば、テストソースセットを定義し、右下隅に「ベータ版」というテキストを含むアイコンを作成できます。詳細については、ビルドバリアントの設定を参照してください。出力
    ディレクトリ領域に表示されている画像とフォルダは、プロジェクトウィンドウのプロジェクトファイルビューに表示されます。
  7. [完了]をクリックします。

Image Asset Studioは、さまざまな密度の画像をドローアブルフォルダーに追加します。

通知アイコンを作成する

Image Asset Studioを開いたら、次の手順に従って通知アイコンを追加できます。

  1. 「アイコンの種類」フィールドで、「通知アイコン」を選択します。

  2. [アセットタイプ]を選択し、下のフィールドでアセットを指定します。[クリップアート]フィールドで、ボタンをクリックします。選択アイコンで
    ダイアログで、マテリアルアイコンを選択し、[OK]をクリックします。

    [パス]フィールドで、画像のパスとファイル名を指定します。 [...]をクリックしてダイアログを表示します。 [テキスト]フィールドにテキスト文字列を入力し、フォントを選択します。
    アイコンは、ウィザードの右側の[ソースアセット]領域と下部のプレビュー領域に表示されます。

  3. (オプション)名前と表示オプションを変更します。名前-
    デフォルトの名前を使用したくない場合は、新しい名前を入力できます。リソース名がプロジェクトにすでに存在する場合(ウィザードの下部にエラーメッセージが表示されます)、リソース名は上書きされます。名前には、小文字、アンダースコア、および数字のみを含めることができます。
    トリム-アイコングラフィックとソースアセットの境界線の間のマージンを調整するには、[はい]を選択します。これにより、アスペクト比を維持しながら透明なスペースが削除されます。ソースアセットを変更しないようにするには、
    いいえ。デフォルト値は次のとおりです。パディングなし-4つの側面すべてでソースアセットのパディングを調整する場合は、スライダーを動かします。 -10%と50%を選択します
    の間の値。 [トリム]も選択すると、最初にトリミングされます。デフォルト値は次のとおりです:0%Image Asset Studio
    透明な正方形の内側にアイコンを作成するため、エッジにいくつかのパディングがあります。パディングは、標準のドロップシャドウアイコン効果のための十分なスペースを提供します。

  4. [次へ]をクリックします。

  5. リソースディレクトリの変更を選択できます。ResDirectory-
    イメージアセットを追加するリソースソースセットを選択します:src / main / res、src / debug / res、src / release / res
    またはユーザー定義のソースセット。プライマリソースセットは、デバッグおよびリリースソースセットを含むすべてのビルドバリアントに適用されます。デバッグおよびリリースソースセットは、プライマリソースセットを置き換え、ビルドバージョンに適用されます。デバッグソースセットはデバッグ専用です。新しいソースセットを定義するには、
    ファイル>プロジェクト構造>アプリ>ビルド
    タイプ。たとえば、テストソースセットを定義し、右下隅に「ベータ版」というテキストを含むアイコンを作成できます。詳細については、ビルドバリアントの設定を参照してください。出力
    ディレクトリ領域に表示されている画像とフォルダは、プロジェクトウィンドウのプロジェクトファイルビューに表示されます。

  6. [完了]をクリックします。

Image Asset Studioは、さまざまな密度とバージョンの画像をドローアブルフォルダーに追加します。

コードで画像リソースを参照する

一般に、一般的な方法でコード内の画像アセットを参照できます。アプリを実行すると、対応する画像がデバイスに基づいて自動的に表示されます。

  • ほとんどの場合、画像アセットはXMLコードでは@drawableとして、またはJavaコードではDrawableとして参照できます。
    たとえば、次のレイアウトXMLコードは、ImageViewに描画可能なオブジェクトを表示します。

    次のJavaコードは、画像をDrawableとして取得します。

    リソースres = getResources()Drawable drawable =
    res.getDrawable(R.drawable.myimage)

    getResources()メソッドはContextクラスにあり、Activity、フラグメント、レイアウト、ビューなどのUIオブジェクトに適しています。

  • アプリでサポートライブラリを使用している場合は、app:srcCompat宣言を使用して、XMLコード内の画像アセットを参照できます。例えば:

画像リソースには、メインスレッドからのみアクセスできます。

プロジェクトのres /ディレクトリの下に画像アセットを追加した後、そのリソースIDを使用して、JavaコードまたはXMLレイアウトからこの画像リソースを参照できます。次のJavaコードは、drawable /myimage.pngリソースを使用するようにImageViewを設定します。

ImageView imageView = (ImageView) findViewById(R.id.myimageview) imageView.setImageResource(R.drawable.myimage)

詳細については、「リソースへのアクセス」を参照してください。

ランチャーアイコンの場合、AndroidManifest.xmlファイルはmipmap /の場所を参照する必要があります。 Image AssetStudioはこのコードを自動的に追加します。以下のマニフェストファイルコードは、mipmap /ディレクトリのic_launcherアイコンを参照しています。

|_+_|

プロジェクトからアイコンを削除します

プロジェクトからアイコンを削除するには、次の手順を実行します。

  1. プロジェクトウィンドウで、Androidビューを選択します。

  2. res / mipmapフォルダーを展開してランチャーアイコンを検索するか、res / drawableフォルダーを展開して他の種類のアイコンを検索します。

  3. 削除するアイコンの名前が付いたサブフォルダーを見つけます。このフォルダには、さまざまな密度のアイコンが含まれています。

  4. フォルダを選択し、Deleteキーを押します。または、[編集]> [削除]を選択します。または、ファイルを右クリックして[削除]を選択します。

    [安全な削除]ダイアログが表示されます。

  5. (オプション)プロジェクト内でアイコンが使用される場所を見つけるオプションを選択し、[OK]をクリックします。 Android Studio
    プロジェクトとドライブからファイルを削除します。ただし、検索プロジェクトでファイルを使用することを選択し、いくつかのユースケースを見つけた場合は、それらを確認して、削除するかどうかを決定できます。プロジェクトを正常にコンパイルするには、これらの参照を削除または置換する必要があります。

  6. [ビルド]> [プロジェクトのクリーンアップ]を選択します。 Android Studio
    削除された画像アセットに対応する生成された画像ファイルをすべて削除します。プロジェクトとドライブからこれらのファイルを削除します。

  7. 必要に応じて、参照されるリソースのコード部分が原因で発生したエラーを修正します。 Android Studio
    コード内のこれらのエラーが強調表示されます。コードからすべての参照を削除すると、プロジェクトを正常に再構築できるようになります。