免责声明
这个答案是2013年的,已经严重过时了。从 Android 3.2 开始,现在有 6 组屏幕密度。这个答案将尽快更新,但没有预计到达时间。请参阅官方文档 http://developer.android.com/guide/practices/screens_support.html对于目前所有的密度(尽管关于特定像素大小的信息总是很难找到)。
这是 tl/dr 版本
这样,Android 就会根据设备的图像密度选择合适的文件,然后根据 9-patch 标准拉伸图像。
TL结束;博士。前面有完整的帖子
我正在回答与设计相关的问题。我不是开发人员,因此我无法提供用于实现所提供的许多解决方案的代码。唉,我的目的是帮助那些像我帮助开发第一个 Android 应用程序时一样迷失的设计师。
适合所有尺寸
借助 Android,公司可以开发几乎任何尺寸、任何分辨率的手机和平板电脑。因此,启动画面没有“正确的图像尺寸”,因为没有固定的屏幕分辨率。这给想要实现启动画面的人带来了问题。
您的用户真的想看到启动画面吗?
(顺便说一句,可用性专家在某种程度上不鼓励启动画面。有人认为,用户已经知道他点击了哪个应用程序,并且没有必要用启动画面来标记您的图像,因为它只会中断用户体验“广告”。但是,它应该用在初始化时需要大量加载的应用程序(5s+),包括游戏等,这样用户就不会怀疑应用程序是否崩溃)
屏幕密度; 4节课
因此,鉴于市场上手机的屏幕分辨率如此之多,谷歌实施了一些可以提供帮助的替代方案和巧妙的解决方案。首先你要知道的是Android是分开的ALL屏幕分为 4 种不同的屏幕密度:
- 低密度 (ldpi ~ 120dpi)
- 中等密度 (mdpi ~ 160dpi)
- 高密度(hdpi ~ 240dpi)
- 超高密度(xhdpi ~ 320dpi)
(这些 dpi 值是近似值,因为定制设备将具有不同的 dpi 值)
您(如果您是设计师)需要了解的是,Android 基本上会根据设备从 4 张图像中进行选择来显示。所以你基本上必须设计 4 个不同的图像(尽管可以为不同的格式开发更多图像,例如宽屏、纵向/横向模式等)。
考虑到这一点,请记住:除非您为 Android 中使用的每种分辨率设计屏幕,否则您的图像将拉伸以适合屏幕尺寸。除非您的图像基本上是渐变或模糊的,否则拉伸时您会出现一些不需要的扭曲。因此,您基本上有两个选择:为每个屏幕尺寸/密度组合创建一个图像,或者创建四个 9 块图像。
最难的解决方案是为每种分辨率设计不同的启动屏幕。您可以首先按照末尾表中的解决方案进行操作这一页 http://developer.android.com/guide/practices/screens_support.html#testing(还有更多。示例:960 x 720 未列出)。假设图像中有一些小细节,例如小文本,则必须为每种分辨率设计多个屏幕。例如,在中等屏幕上显示的 480x800 图像可能看起来不错,但在较小的屏幕(密度/dpi 较高)上,徽标可能会变得太小,或者某些文本可能变得难以阅读。
9 块图像
另一个解决方案是创建 9 块图像 http://developer.android.com/tools/help/draw9patch.html。它基本上是图像周围的 1 像素透明边框,通过在此边框的顶部和左侧区域绘制黑色像素,您可以定义允许拉伸图像的哪些部分。我不会详细介绍 9 块图像的工作原理,但简而言之,与顶部和左侧区域中的标记对齐的像素是将重复拉伸图像的像素。
一些基本规则
- 您可以在 Photoshop(或任何可以准确创建透明 png 的图像编辑软件)中制作这些图像。
- 1 像素边框必须是完全透明的。
- 1 像素透明边框必须位于图像周围,而不仅仅是顶部和左侧。
- 您只能在此区域中绘制黑色(#000000)像素。
- 顶部和左侧边框(定义图像拉伸)只能有一个点 (1px x 1px)、两个点(均为 1px x 1px)或一条连续线(宽度 x 1px 或 1px x 高)。
- 如果您选择使用 2 个点,图像将按比例扩展(因此每个点将轮流扩展,直到达到最终的宽度/高度)
- 1px 边框必须不包括在预期的基本文件尺寸之外。因此,100x100 9 块图像实际上必须具有 102x102(顶部、底部、左侧和右侧 100x100 +1px)
- 9 补丁图像必须以 *.9.png 结尾
因此,您可以在徽标的两侧(在顶部边框)放置 1 个点,在其上方和下方(在左侧边框)放置 1 个点,这些标记的行和列将是唯一要拉伸的像素。
Example
这是一个 9 块图像,102x102px(最终尺寸为 100x100,用于应用程序目的):
这是同一张图像的 200% 缩放:
请注意顶部和左侧的 1px 标记表示哪些行/列将扩展。
以下是该图像在应用程序内的 100x100 分辨率下的样子:
如果扩展到 460x140,效果如下:
最后要考虑的一件事。这些图像在显示器屏幕和大多数移动设备上可能看起来不错,但如果设备的图像密度 (dpi) 非常高,则图像看起来会太小。可能仍然清晰,但在分辨率为 1920x1200 的平板电脑上,图像会显示为中间的一个非常小的正方形。那么解决办法是什么呢?设计 4 个不同的 9 补丁启动器图像,每个图像用于不同的密度集。为了确保不会发生收缩,您应该为每个密度类别采用最低的通用分辨率进行设计。此处不希望收缩,因为 9-patch 仅考虑拉伸,因此在收缩过程中,小文本和其他元素可能会失去可读性。
以下是每个密度类别的最小、最常见分辨率的列表:
- 超大(xhdpi):640x960
- 大(hdpi):480x800
- 中(mdpi):320x480
- 小(LDPI):240x320
因此,按照上述分辨率设计四个启动屏幕,展开图像,在画布周围放置 1px 透明边框,并标记哪些行/列将是可拉伸的。请记住这些图像将用于ANY设备属于密度类别,因此您的 ldpi 图像 (240 x 320) 可能会在具有较小图像密度 (~120 dpi) 的超大平板电脑上拉伸至 1024x600。因此,只要您不想在启动画面中使用照片或复杂的图形,9 片就是最佳的拉伸解决方案(在创建设计时请记住这些限制)。
同样,避免这种拉伸发生的唯一方法是为每种分辨率设计一个屏幕(或者为每种分辨率-密度组合设计一个屏幕,如果您想避免图像在高/低密度设备上变得太小/太大),或者告诉无论发生拉伸,图像都不会拉伸并具有背景颜色(另请记住,由于颜色配置文件的原因,Android 引擎渲染的特定颜色可能看起来与 Photoshop 渲染的相同特定颜色不同)。
我希望这是有道理的。