リスト表示アイコン

リスト表示アイコンはダイアログ アイコンとよく似ていますが、光源がオブジェクトの上にある内側のシャドウ効果を使用します。また、ListView でのみ使用するように設計されています。たとえば、設定アプリなどです。

密度別のアイコンセットを提供するで説明されているように、低密度、中密度、高密度の画面用に別々のアイコンセットを作成する必要があります。これにより、アプリをインストールできるさまざまなデバイスでアイコンが適切に表示されます。表 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 ピクセルのセーフフレームがありますが、円形のアンチ エイリアスの端にセーフフレーム領域を使用できます。
  • 指定されるサイズはすべて、Photoshop の 32x32 ピクセルのアートボード サイズを基準としています。テンプレート内の境界ボックスの周囲に 1 ピクセルのパディングを確保します。
リスト表示アイコンの構造

図 1.リスト表示アイコンのセーフフレームと塗りつぶしグラデーション(アイコンのサイズは 32 x 32)

ライト、効果、シャドウ

リスト表示アイコンは、シャドウ(内側)付きのフラットな正面向きの画像です。明るいグラデーションと内側の影で作られており、暗い背景でも目立ちます。

リスト表示アイコンのライト、エフェクト、シャドウ。

図 2.リスト表示アイコンのライト、効果、シャドウ

1.シャドウ(内側):黒 | 57% の不透明度 | 角度 120° | ブレンドモード 通常 | 距離 1 ピクセル | サイズ 1 ピクセル
2.背景:黒 | 標準のシステムカラー
これらのアイコンはリスト表示専用です。
注: リスト表示アイコンは Photoshop の 32 x 32 ピクセルのアートボード上に表示されます。セーフフレームは不要です。

詳細な手順

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