ダイアログ アイコン

ダイアログ アイコンは、ユーザーに操作を求めるポップアップ ダイアログ ボックスに表示されます。暗い背景に対して目立たせるために、明るいグラデーションと内側のシャドウを使用しています。

密度別のアイコンセットを提供するで説明されているように、低密度、中密度、高密度の画面用に別々のアイコンセットを作成する必要があります。これにより、アプリをインストールできるさまざまなデバイスでアイコンが適切に表示されます。表 1 に、各密度における最終的なアイコンの推奨サイズを示します。また、複数のアイコンセットを使用する際のおすすめの方法については、デザイナー向けのヒントをご覧ください。

表 1. 3 つの一般化された画面密度それぞれの終了済みダイアログ アイコンの寸法の概要。

ldpi(120 dpi)
(低密度画面)
mdpi(160 dpi)
(中密度画面)
hdpi(240 dpi)
(高密度画面)
xhdpi(320 dpi)
(超高密度画面)
ダイアログ アイコンのサイズ 24 x 24 px 32 x 32 px 48 x 48 px 64 x 64 px

最終的なアートは透過 PNG ファイルとしてエクスポートする必要があります。背景色を含めないでください。

Adobe Photoshop でアイコンを作成するためのテンプレートは、アイコン テンプレート パックで入手できます。

すべての Android バージョン

以下のガイドラインでは、Android プラットフォームのすべてのバージョンに対応するダイアログ アイコンを設計する方法について説明します。

構造

  • ダイアログ アイコンには 1 ピクセルのセーフフレームを含めます。ベース形状はセーフフレーム内に収まる必要がありますが、円形のアンチエイリアスはセーフフレームと重なってかまいません。
  • このページで指定されているサイズはすべて、Adobe Photoshop の 32x32 ピクセルのアートボードのサイズに基づいています。Photoshop テンプレート内の境界ボックスの周囲に 1 ピクセルのパディングを確保します。
ダイアログ アイコンの構造図

図 1.ダイアログ アイコンのセーフフレームと塗りつぶしのグラデーション。 (アイコンのサイズは 32 x 32)

ライト、効果、シャドウ

ダイアログ アイコンはフラットな正面向きの画像です。暗い背景に対して目立たせるために、明るいグラデーションと内側のシャドウを使って作成されています。

ダイアログ アイコンのライト、効果、シャドウの図

図 2.ダイアログ アイコンのライト、効果、シャドウ

1.前面:グラデーション オーバーレイ | 角度 90°
底部: r 223 | g 223 | b 223
上部: r 249 | g 249 | b 249
底部の色の領域: 0%
上部の色の領域: 75%
2.シャドウ(内側):黒 | 25% の不透明度 |
角度 -90° | 距離 1 ピクセル | サイズ 0 ピクセル

詳細な手順

  1. Adobe Illustrator などのツールを使って基本形状を作成します。
  2. このシェイプを Adobe Photoshop などのツールにインポートし、32x32 ピクセルの画像が透明な背景に収まるように拡大縮小します。
  3. 適切なフィルタに対して図 2 の効果を追加します。
  4. 32 x 32 のアイコンを、透明度を有効にした PNG ファイルとしてエクスポートします。