对话框图标

对话框图标显示在提示用户互动的弹出式对话框中。它们使用浅色渐变和内部阴影,以便在深色背景下脱颖而出。

提供特定于密度的图标集中所述,您应为低、中和高密度屏幕创建单独的图标集。这样可确保图标在可安装您应用的各种设备上都能正确显示。请参阅表 1,了解针对每种密度建议的已完成图标大小列表。此外,请参阅设计人员提示,了解有关如何使用多组图标的建议。

表 1. 三种广义屏幕密度中每种密度的已完成对话框图标尺寸摘要。

ldpi (120 dpi)
(低密度屏幕)
mdpi (160 dpi)
(中密度屏幕)
hdpi (240 dpi)
(高密度屏幕)
xhdpi (320 dpi)
(超高密度屏幕)
对话框图标大小 24 x 24 像素 32 x 32 像素 48 x 48 像素 64 x 64 像素

必须将最终图片作为透明的 PNG 文件导出。请勿添加背景颜色

图标模板包中提供了用于在 Adobe Photoshop 中创建图标的模板。

所有 Android 版本

以下指南介绍了如何为所有版本的 Android 平台设计对话框图标。

结构

  • 对话框图标有一个 1 像素的安全框。基本形状必须适合安全框,但圆形的抗锯齿功能可能会与安全框重叠。
  • 此页面中指定的所有尺寸均基于 Adobe Photoshop 中的 32x32 像素的画板尺寸。在 Photoshop 模板内的边界框周围留出 1 像素的内边距。
对话框图标结构视图。

图 1. 对话框图标的安全框和填充渐变。 图标尺寸为 32x32。

光线、效果和阴影

对话框图标是扁平的正面图片。为了在深色背景中脱颖而出,它们使用浅色渐变和内部阴影构成。

对话框图标的光线、效果和阴影视图。

图 2. 对话框图标的光线、效果和阴影。

1.前部:渐变叠加 | 角度 90°
底部:r 223 | g 223 | b 223
顶部:r 249 | g 249 | b 249
底部颜色位置:0%
顶部颜色位置:75%
2.内部阴影:黑色 | 25% 不透明度 |
角度 90° 距离 1px | 尺寸 0px

分步说明

  1. 使用 Adobe Illustrator 等工具创建基本形状。
  2. 将形状导入 Adobe Photoshop 等工具,并在透明背景上缩放以适应 32x32 像素的图片。
  3. 针对适当的过滤器添加图 2 所示的效果。
  4. 以 32x32 尺寸将图标作为启用了透明度的 PNG 文件导出。