应用骨架支持多屏

Posted

技术标签:

【中文标题】应用骨架支持多屏【英文标题】:Application Skeleton to support multiple screens 【发布时间】:2012-08-27 20:26:14 【问题描述】:

据我们所知,android 配备了各种不同的设备 功能、分辨率和屏幕尺寸,因此在开发支持的应用程序时 多(小和大)屏幕存在尺寸和布局的障碍。

这会导致屏幕尺寸、分辨率和 DPI 的不同组合,并在为 Android 设备进行设计和开发时带来相当大的挑战。虽然其他一些制造商(非 Android)具有不同的分辨率和 DPI,但它们共享相同的屏幕尺寸并且分辨率遵循相同的纵横比。因此,可以创建适合非 Android 设备的图像。

我的问题是,是否应该遵循适当的流程或架构来满足要求?

请记住,我们确实有不同尺寸和分辨率的平板电脑。

我知道Android Developer 包含此信息,但我的观点来自实施。

据我所知,对于设计 Android 图形,即使是程序员也必须了解设计理念。

【问题讨论】:

你们确定这个问题没有建设性吗? 我觉得很有建设性。想知道否决票的原因。 @MKJParekh take MicroMax Funbook gsmarena.com/micromax_funbook_p300-4701.php 7", 480X800, Ldpi (133 dpi) 你能告诉我它会落在哪个类别(drawble-large 或 Ldpi 或 Android v3.0 sw-480)吗? @LazyNinja 否决票的原因是疯子和疯子。谁只是认为他们只能提出建设性的问题:p @AZ_ :) 我们在 res 文件夹中使用了这个 res 结构 drawable drawable-hdpi drawable-hdpi-v11 drawable-hdpi-v9 drawable-large drawable-large-hdpi drawable-ldpi drawable-mdpi drawable- mdpi-v11 drawable-small drawable-xhdpi drawable-xhdpi-v11 drawable-xxhdpi drawable-xxhdpi-v11 layout layout-small layout-sw530dp layout-sw720dp layout-xlarge values-sw530dp values-sw720dp values-v14 values-xlarge和使用来自 values 文件夹的 xml 中明确定义的尺寸。 FYKI 我们的应用程序支持超过 5k 种设备。 【参考方案1】:

终于创建了一个处理多屏布局和图标的结构。

Android 根据两个参数将设备显示分为几类:

屏幕尺寸,显示器的物理尺寸(对角线测量) 屏幕密度,显示器的物理像素密度(以每英寸像素或 ppi 为单位)`

要快速确定屏幕尺寸和密度,请安装适用于 Android 的“What's my Size”应用。

屏幕尺寸

Android 定义了四种通用的屏幕尺寸:


 Qualifier           Size

 small               ~3 inches (approx) 
 normal              ~4 inches (approx) 
 large               Exceeds 4 inches    
 xlarge              Exceeds 7 inches  
大多数手机被归类为小型或普通(对角线大约 3 到 4 英寸)。但现在大屏手机很多,比如 Galaxy S4、HTC One、Xperia Z 像三星 Galaxy Tab 这样的小型平板电脑被归类为大型(大于 4 英寸) 超大适用于大型设备,例如大型平板电脑

Android 定义了四种通用的屏幕密度:


 Qualifier         Description         Nominal value

 ldpi              low density          120 ppi
 mdpi              medium density       160 ppi
 hdpi              high density         240 ppi
 xhdpi             extra high density   320 ppi

通常:

屏幕尺寸对应用布局的影响最大 屏幕密度对图像和图形资源的影响最大

列出here设备屏幕的百分比差异

Ldpi- 75% Mdpi- 100%(基于 Android 开发者网站) Hdpi- 150% XHdpi- 200%

但我们现在知道大多数设备都带有 480X800,所以我认为这是基于设备的,所以我们的新计算会像这样

Ldpi- 50% Mdpi- 66.67% Hdpi- 100% XHdpi- 133.33%

这意味着将只为 480X800 创建第一个图标和设计,然后为其余的(即 Ldpi、Mdpi、Xhdpi)创建图标和设计。

有些图像对于所有布局都是通用的,并且颜色和形状必须一致(没有复杂的形状,没有曲线)所以对于这种图像,我们正在创建 9patch 将其放入“drawable(no-suffix )“ 文件夹。要创建 9Patch 图像,您可以使用 DrawNinePatchBetterNinePatch

现在只需根据 Android 标准重命名您的图像并使用 hdpi 完成您的应用程序,然后只需使用 drawable-hdpi 文件夹并打开 Adode Photoshop(推荐) 创建多个大小的Action(只需根据百分比更改大小)一旦为所有大小创建操作,然后只需执行Batch Automate 并给出源(drawable-hdpi)和目标(drawable-ldpi,drawable-mdpi,drawable- xdpi)。

我坚持让你使用 Photoshop 的原因是它会自动调整你的图片大小,还有一个优点是你不需要重命名文件(它会分配与原始文件相同的名称)。

一旦您完成了所有图像的创建,请刷新您的项目并对其进行测试。

有时支持屏幕(xhdpi,hdpi,mdpi)的布局可能会被剪切成小屏幕(ldpi),因此为了处理这个问题,只需为其创建单独的布局文件夹(布局小)并添加@ 987654338@(大部分)。就是这样。

平板电脑 平板电脑分为两种尺寸。

    7"(1024X(600-48(导航栏))) = 1024X552 (drawable-large) 10"(1280X(800-48(导航栏))) = 1280X752 (drawable-xlarge)

在此我们需要为两个屏幕创建图像并相应地放置它们

所以总而言之,我们将在我们的应用程序中拥有这个文件夹以支持多屏。

drawable
drawable-ldpi
drawable-mdpi
drawable-hdpi
drawable-xhdpi
drawable-large
drawable-xlarge

将与Screen size and Screen density进行更多限定符组合

drawable-large-ldpi
drawable-large-mdpi
drawable-large-hdpi
drawable-large-xhdpi

更多限定词Screen density and Version

drawable-ldpi-v11
drawable-mdpi-v11
drawable-hdpi-v11
drawable-xhdpi-v11

还有更多的限定词Screen size and Version

drawable-large-v11
drawable-xlarge-v11

和更多的限定词Smallest width concept(SW)

 drawable-sw???dp

在 Android V3.0 Honeycomb 中,他们引入了SW(smallest width) 的新概念,其中设备按屏幕宽度分类,因此如果我们创建一个名为drawable-sw360dp 的文件夹,则设备具有 720dp(宽度或高度)将使用此文件夹中的资源。

例如查找Samsung Galaxy S3 dp 后缀为drawable-sw?dp 参考DP Calculation,如果您想支持您的布局或可绘制到 S3,那么计算会说

px= 设备宽度 = 720dpi= 设备密度 = 320

给定公式

    px = dp * (dpi / 160)

交换公式,因为我们有 px 的值

    dp = px / (dpi / 160)

现在投入价值,

     dp= 720 / (320/160);
     dp=360. 

所以drawable-sw360dp 会完成这项工作

从GsmArena 获取设备配置 同样,您还可以根据设备的 Android API 版本创建文件夹,即 drawable-hdpi-v11`,因此具有 API11 且为 Hdpi 的设备将使用此资源。

附加提示:

使用相对布局、dp、sp 和 mm

dp 单位 - 与设备无关的像素在 160 ppi 屏幕上标准化为 1 个物理像素,即中等密度。在运行时缩放。用于屏幕元素尺寸

sp 单位 - 缩放的像素,指定为浮点值,基于 dp 单位,但还针对用户的字体大小首选项设置进行了缩放。在运行时缩放。 用于字体大小

您应该始终使用 RelativeLayout 进行布局; AbsoluteLayout 已弃用,不应使用。

使用适当的图像格式 - PNG 与 JPEG

Android "prefers" PNG for bitmap image files, "accepts" JPEG, and "discourages" GIF.

但是,PNG 和 JPEG 不是等价物。它们有不同的质量权衡,PNG 并不总是最好的:

JPEG 可以比 PNG 减少多达 50% 的文件大小,如果您的应用是图像密集型应用,这一点非常重要

对于相同的文件大小,更高质量的“有损”JPEG 可能比高度压缩的“无损”PNG 看起来更好

为您的图像和图形添加标签以进行调试

使用 support-screens 元素

使用真实设备值配置您的模拟器

通常,桌面系统以 72ppi (Mac) 或 96ppi (Windows、Linux) 显示。与移动设备相比,桌面显示器的密度始终较低。

始终将您的 Android 模拟器配置为模拟真实设备值,并始终将它们设置为缩放以模拟设备密度。

在 Eclipse 中,很容易创建多个仿真器(从 Eclipse 菜单栏中,选择 Window > AVD Manager > New),并为真实设备配置值:

为它所模拟的真实设备命名模拟器 指定分辨率,不要使用内置的通用尺寸 设置设备密度以匹配真实设备(在硬件窗格中将 Abstracted LCD 属性设置为真实密度,始终为整数值)

当您启动设备时,请始终选择将显示缩放到实际尺寸,然后输入以英寸为单位的实际屏幕尺寸。

如果不设置设备密度,模拟器默认为低密度,并且总是加载 ldpi 特定的资源。分辨率(像素尺寸)将是正确的,但与密度相关的图像资源将无法按预期显示。

当然,您所做的任何事情都不会在较低密度的桌面显示器上再现较高密度的图像质量。

这是在截至 2012 年 10 月 1 日的 7 天内收集的数据。要查看有关 Android 平台版本的最新统计数据,go to here

基于屏幕尺寸

基于屏幕密度

【讨论】:

对于 samsung galaxy tab 7" 我们必须将图像保存在 drawable-large-hdpi 下,否则图像会被拉伸或缩小。 @rajpara 有很多组合和排列,我们稍后会包括所有这些情况。 见@AlexBonel,是的,我同意你的观点,但我的主要座右铭是了解在多屏支持方面如何做。可以修改/操纵这个流程/概念,因为上面是为了弄清楚最初的问题。此外,我也根据应用程序设计进行修改。你的帖子让我觉得你理解了这个概念。希望你明白我的意思。 不错的答案。在搜索了很多天为什么会发生这种异常之后,我得到了这篇文章作为最佳答案,并提供了很好的示例和解释。例如考虑 Halo Value 7 英寸平板电脑。 PPI=133。分辨率=480*800。尺寸=7' 英寸。如果我们将 mdpi 视为基础,它应该采用 values-sw480 中定义的维度,但它从 values-sw600 中获取维度。我不明白为什么会这样。真的非常感谢你的帖子。节省时间,消除混乱。我认为这应该在Android的官方网站上。感谢您的努力。 我认为这是我见过的最好的答案。我一直在寻找这样的答案。最后我明白了。感谢大家为这个答案做出贡献,使其更容易理解。【参考方案2】:

设计师应该创建基础设计

base size of mdpi devices * density conversion factor of highest supported density bucket size.Base 屏幕尺寸为 320 X 480 px,密度桶如下:

ldpi: 0.75 mdpi: 1.0(基础密度) hdpi: 1.5 xhdpi: 2.0 xxhdpi: 3.0 xxxhdpi: 4.0

为了解决 Android 设备上的额外可用空间问题,应在两个方向(水平和垂直)上使用可拉伸组件。详细信息可在此处获得:

http://vinsol.com/blog/2014/11/20/tips-for-designers-from-a-developer/

【讨论】:

以上是关于应用骨架支持多屏的主要内容,如果未能解决你的问题,请参考以下文章

Windows Phone 8 适应多屏分辨率

华为荣耀V20多屏开启分屏的正确方法是啥?

创建多屏 iPhone 应用?

在android中使用多屏时应用程序崩溃

康佳8200DE能进行MirrorOp多屏同步吗?具体怎么操作,真心求解。。。

FLUTTER:多屏应用的本地化