在移动端设计中,Android 的碎片化一直是设计师的痛点。基于主流的 Material Design 体系,我总结了一套从单位换算、色彩体系到切图交付的完整规范,旨在实现设计与开发的高效对齐。
一、 核心度量单位:解耦像素焦虑
Android 适配的核心在于理解密度独立性。
1. DP 与 SP 的底层逻辑
- DP (Density-independent Pixel): Android 专属长度单位。在 160 DPI 屏幕下,$1dp = 1px$。
- SP (Scale-independent Pixel): 字体专属单位。它不仅随屏幕密度缩放,还随系统字体大小设置而变化。
- 计算公式: $px = dp * (dpi / 160)$
2. 设计稿尺寸基准
建议以 720 x 1280 px (xhdpi) 或 1080 x 1920 px (xxhdpi) 作为主设计稿:
- xhdpi (@2x): 1dp = 2px
- xxhdpi (@3x): 1dp = 3px
二、 栅格与布局规范
1. 48dp 黄金触控律
Android 官方建议:所有可触摸 UI 元素的标准尺寸至少为 48dp(约 9mm)。
- 最小点击区域:
48dp x 48dp。 - 默认 List 高度:
48dp。 - 默认 Button 高度:
40dp。
2. 8dp 栅格
所有的元素间距应遵循 8dp 倍数原则(8, 16, 24…)。对于精细化的图标或文本间距,可使用 4dp 作为补充步进。
三、 视觉表现规范
1. 字体体系
- 中文字体: 思源黑体 (Noto Sans Han)。
- 英文字体: Roboto 家族。
- 规范: 字号应使用偶数单位(如 24, 28, 32 sp),最小不建议低于 12sp。
2. 色彩逻辑
Android 倾向于中性、扁平且简洁的风格。
- 语义化用色: 颜色应具备明确的功能目的(如区分操作优先级或强调状态)。
- 动态色彩: 在 Material 3 体系下,优先定义色彩角色(Color Roles)而非死色值,以适配 Material You 自动配色。
四、 图标与切图规范
1. 图标尺寸标准
图标需提供多倍率版本以适配不同密度的屏幕:
| 分类 | 尺寸 (dp) | 对应 xxhdpi (px) |
|---|---|---|
| 应用图标 (Launcher) | 48 x 48 | 144 x 144 |
| 动作条图标 (Action Bar) | 32 x 32 | 96 x 96 |
| 底部导航图标 | 24 x 24 | 72 x 72 |
2. 工程化切图建议
- 单色图标: 尽量交付 SVG 或 Lottie,减少资源体积。
- 背景切图: 对于非固定宽高的背景,采用 .9.png (点九图) 进行切图,确保拉伸不失真。
- 分类存放: 严格按照
drawable-xhdpi,drawable-xxhdpi进行归档,方便开发直接替换。
<Callout type="info">
作为一名设计师,我始终坚持在交付物中标注 dp 值而非像素值。同时,利用 Zeplin 或蓝湖的“代码片段”功能,直接为开发生成对应的 XML 或 Compose 代码,这能极大减少沟通成本并提升 1:1 还原度。
</Callout>
五、 总结
Android 规范的本质是灵活性与包容性。理解了 DP 的换算逻辑和 48dp 的触控原则,我们就能在碎片化的设备海洋中,构建出体验一致的高质量产品。
规范是设计的骨架,而体验才是灵魂。