声明

Question

我想要在启动时显示全屏PNG。那里只有一个错误，我不知道每个可绘制文件夹（ldpi，mdpi，hdpi和xhdpi）的大小。我的应用程序应该在所有手机和平板电脑上运行良好和美观。我应该创建什么尺寸（以像素为单位），以便在所有屏幕上显示漂亮的画面？

Answer 1

声明

这个答案是从2013年开始的，已经过时了。从Android 3.2开始，现在有6组屏幕密度。这个答案会尽快更新，但没有ETA。有关所有密度的信息，请参阅official documentation（尽管有关特定像素大小的信息始终难以找到）。

这里是tl / dr版本

创建4个图像，每个屏幕密度对应一个：
- xlarge（xhdpi）：640x960
- 大（hdpi）：480x800
- medium（mdpi）：320x480
- small（ldpi）：240x320
在Android开发者指南中阅读9-patch image introduction
设计具有可以安全拉伸而不影响最终结果的区域的图像

有了这个，Android将为设备的图像密度选择合适的文件，然后它将根据9补丁标准拉伸图像。

tl的结尾;博士。提前全文

关于问题的设计相关方面，我正在回答。我不是开发人员，因此我无法提供实现所提供的许多解决方案的代码。唉，我的目的是帮助那些在我帮助开发我的第一个Android应用程序时迷失的设计师。

适合所有尺寸

借助Android，公司可以开发几乎任何尺寸的手机和桌子，几乎可以达到他们想要的任何分辨率。因此，没有＆＃34;正确的图像尺寸＆＃34;对于启动画面，因为没有固定的屏幕分辨率。这对想要实现启动画面的人来说是一个问题。

您的用户是否真的想看到启动画面？

（另一方面，在可用性人员中，有些人不鼓励使用闪屏。有人认为用户已经知道他使用了什么应用程序，并且没有必要用闪屏来标记你的图像，因为它只会中断用户体验＆＃34;广告＆＃34;。然而，应该在初始化（5s +）（包括游戏等）时需要大量加载的应用程序中使用它，这样用户就不会想知道应用程序是否崩溃或不）

屏幕密度; 4个班级

因此，鉴于市场上的手机有如此多的不同屏幕分辨率，Google实施了一些替代方案和可以提供帮助的漂亮解决方案。您必须要知道的第一件事是Android将所有屏幕分成4个不同的屏幕密度：

低密度（ldpi~120dpi）
中密度（mdpi~160dpi）
高密度（hdpi~240dpi）
超高密度（xhdpi~320dpi）（这些dpi值是近似值，因为自定义构建的设备将具有不同的dpi值）

你（如果你是设计师）需要知道的是，Android基本上从4个图像中选择显示，具体取决于设备。因此，您基本上必须设计4个不同的图像（尽管可以针对不同的格式开发更多图像，例如宽屏，纵向/横向模式等）。

考虑到这一点，请注意：除非您为Android中使用的每个分辨率设计屏幕，否则您的图像将拉伸以适合屏幕尺寸。除非你的图像基本上是渐变或模糊，否则你会在拉伸时产生一些不希望的失真。所以你基本上有两个选择：为每个屏幕尺寸/密度组合创建一个图像，或者创建四个9补丁图像。

最难的解决方案是为每个分辨率设计不同的闪屏。您可以从this page末尾的表格中的分辨率开始（还有更多。示例：此处未列出960 x 720）。假设您在图像中有一些小细节，例如小文本，则必须为每个分辨率设计多个屏幕。例如，在中等屏幕上显示的480x800图像可能看起来不错，但在较小的屏幕上（具有较高的密度/ dpi），徽标可能会变得太小，或者某些文本可能变得不可读。

9-patch image

另一个解决方案是create a 9-patch image。它基本上是图像周围的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-patch图片必须以* .9.png

因此，您可以在徽标的两侧放置1个点（在顶部边框中），在其上方和下方（在左边框上）放置1个点，这些标记的行和列将是唯一要拉伸的像素。

实施例

这是一个9补丁图像，102x102px（最终尺寸为100x100，用于应用目的）：

9-patch image, 102x102px

这是同一张图片的200％缩放：

the same image, magnified 2x for clarity

注意顶部和左侧的1px标记表示哪些行/列将展开。

这里的图片在应用内100x100中的样子：

rendered into 100x100

如果扩展到460x140，它会是什么样子：

rendered into 460x140

最后要考虑的事情。这些图像在您的显示器屏幕和大多数手机上可能看起来很好，但如果设备的图像密度非常高（dpi），则图像看起来太小。可能仍然清晰可辨，但在具有1920x1200分辨率的平板电脑上，图像在中间看起来像一个非常小的正方形。那么解决方案是什么？设计4个不同的9贴片发射器图像，每个图像用于不同的密度集。为确保不会发生收缩，您应该为每个密度类别设计最低的通用分辨率。收缩是不可取的，因为9补丁仅考虑拉伸，因此在缩小的过程中，小文本和其他元素可能会失去易读性。

这里列出了每种密度类别的最小，最常见的分辨率：

xlarge（xhdpi）：640x960
大（hdpi）：480x800
medium（mdpi）：320x480
small（ldpi）：240x320

因此，在上述分辨率中设计四个闪屏，展开图像，在画布周围放置1px透明边框，并标记哪些行/列可伸缩。请记住，这些图像将用于密度类别中的 ANY 设备，因此您的ldpi图像（240 x 320）可能会在具有较小图像密度（~120 dpi的超大平板电脑）上拉伸至1024x600 ）。因此，9-patch是拉伸的最佳解决方案，只要您不想在启动画面中使用照片或复杂的图形（在创建设计时请记住这些限制）。

同样，不进行拉伸的唯一方法是每个分辨率设计一个屏幕（或者每个分辨率 - 密度组合设置一个，如果你想避免图像在高/低密度设备上变得太小/太大），或者告诉图像不要伸展，并且在任何可能发生拉伸的地方都会出现背景颜色（还要记住，由于颜色配置文件，Android引擎呈现的特定颜色可能看起来与photoshop呈现的相同特定颜色不同）。 / p>

我希望这是有道理的。祝你好运！

Answer 2

PORTRAIT MODE

MDPI为320x480 dp = 320x480px（1x）

LDPI为0.75 x MDPI = 240x360px

HDPI为1.5 x MDPI = 480x720px

XHDPI是2 x MDPI = 640x960px

XXHDPI是3 x MDPI = 960x1440px

XXXHDPI是4 x MDPI = 1280x1920px

风景模式

MDPI为480x320 dp = 480x320px（1x）

LDPI为0.75 x MDPI = 360x240px

HDPI是1.5 x MDPI = 720x480px

XHDPI是2 x MDPI = 960x640px

XXHDPI是3 x MDPI = 1440x960px

XXXHDPI是4 x MDPI = 1920x1280px

编辑：

如果您在2019年阅读此内容，我建议您使用Lottie进行启动画面

Answer 3

<强>纵向

LDPI：200x320px

MDPI：320x480px

HDPI：480x800px

XHDPI：720px1280px

<强>风景

LDPI：320x200px

MDPI：480x320px

HDPI：800x480px

XHDPI：1280x720px

Answer 4

我搜索了制作9-patch图像的最佳和最简单的答案。现在制作9补丁图像是最简单的任务。

从https://romannurik.github.io/AndroidAssetStudio/index.html开始，您只需点击一下即可为所有分辨率制作9补丁图像 - XHDPI，HDPI，MDPI，LDPI。

Answer 5

使用PNG并不是一个好主意。实际上，就性能而言，它的成本很高。您可以使用可绘制的XML文件，例如Facebook's background。

这将有助于您平滑和加快您的表现，以及徽标使用.9补丁图片。

Answer 6

Density buckets

LDPI    120dpi    .75x
MDPI    160dpi    1x
HDPI    240dpi    1.5x
XHDPI   320dpi    2x
XXHDPI  480dpi    3x
XXXHDPI 640dpi    4x

px / dp = dpi / 160 dpi

Answer 7

经过编辑的解决方案，可使您的SplashScreen在包括API21到API23在内的所有API上都看起来不错

如果您仅针对APIs24 +，则可以直接在其XML文件中直接缩小矢量可绘制对象，如下所示：

<vector xmlns:android="http://schemas.android.com/apk/res/android" xmlns:aapt="http://schemas.android.com/aapt"
android:viewportWidth="640"
android:viewportHeight="640"
android:width="240dp"
android:height="240dp">
<path
    android:pathData="M320.96 55.9L477.14 345L161.67 345L320.96 55.9Z"
    android:strokeColor="#292929"
    android:strokeWidth="24" />
</vector>

在上面的代码中，我将在640x640画布上绘制的可绘制对象重新缩放为240x240。然后像这样将其放在我的启动屏幕可绘制对象中，效果很好：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" android:opacity="opaque"
android:paddingBottom="20dp" android:paddingRight="20dp" android:paddingLeft="20dp" android:paddingTop="20dp">

<!-- The background color, preferably the same as your normal theme -->
<item>
    <shape>
        <size android:height="120dp" android:width="120dp"/>
        <solid android:color="@android:color/white"/>
    </shape>
</item>

<!-- Your product logo - 144dp color version of your app icon -->
<item
    android:drawable="@drawable/logo_vect"
    android:gravity="center">

</item>
</layer-list>

我的代码实际上仅在底部的图片中绘制三角形，但是在这里您可以看到可以实现的目标。与使用位图时获得的像素化边缘相反，分辨率最终是很大的。因此，请务必使用可绘制的矢量（有一个名为vectr的网站，我曾用它来创建我的网站，而无需下载专门软件。）

编辑以使其也可以在API21-22-23上使用

虽然以上解决方案适用于运行API24 +的设备，但在将应用程序安装为运行API22的设备后，我感到非常失望。我注意到启动画面再次试图填充整个视图，看起来像狗屎一样。经过半天的折磨，我终于通过纯粹的意志力强行提出了解决方案。

您需要创建第二个文件，其名称与splashscreen xml完全一样（假设为splash_screen.xml），并将其放入2个名为drawable-v22和drawable-v21的文件夹中，这些文件将在res /文件夹中创建（为了看到他们，您必须将项目视图从Android更改为Project）。每当相关设备运行与可绘制文件夹see this link中的-vXX后缀相对应的API时，这便可以告诉您的手机重定向到这些文件夹中放置的文件。将以下代码放在在这些文件夹中创建的splash_screen.xml文件的“层”列表中：

<item>
<shape>
    <size android:height="120dp" android:width="120dp"/>
    <solid android:color="@android:color/white"/>
</shape>
</item>

<!-- Your product logo - 144dp color version of your app icon -->
<item android:gravity="center">
    <bitmap android:gravity="center"
        android:src="logo_vect"/>

</item>

由于这些API的某些原因，您必须将可绘制对象包装在位图中，以使其起作用并进行喷射，最终结果看起来相同。问题是您必须使用带有常规可绘制文件夹的方法，因为第二个版本的splash_screen.xml文件将导致您的启动屏幕在运行高于23的API的设备上根本不显示。您可能还必须放置android将splash_screen.xml的第一个版本默认为可找到资源的最近的drawable-vXX文件夹作为android。希望这会有所帮助

Answer 8

就我而言，我在style.xml中使用了list drawable。使用图层列表可绘制，您只需要一个png用于所有屏幕尺寸。

<resources xmlns:tools="http://schemas.android.com/tools">
<!-- Base application theme. -->
<style name="AppTheme" parent="android:Theme.Holo.Light.DarkActionBar">
    <item name="android:windowNoTitle">true</item>
    <item name="android:windowBackground">@drawable/flash_screen</item>
    <item name="android:windowTranslucentStatus" tools:ignore="NewApi">true</item>
</style>

和flash_screen.xml在drawable文件夹中。

<?xml version="1.0" encoding="utf-8"?>
 <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@android:color/white"></item>
<item>
    <bitmap android:src="@drawable/background_noizi" android:gravity="center"></bitmap>
</item>

＆＃34; background_noizi＆＃34;在可绘制文件夹中是png。我希望它有所帮助

Answer 9

前段时间我创建了一个支持维度的excel文件
希望这对某人有帮助

老实说我失去了主意，但它将另一个屏幕功能称为大小（不仅仅是密度）
https://developer.android.com/guide/practices/screens_support.html
如果有一些错误请通知我

Link1: dimensions.xlsx

Link2: dimensions.xlsx

Answer 10

**如果您正在寻找各种主要设备的屏幕详情**

go to material.io

Answer 11

基于this answer from Lucas Cerro，我使用the Android docs中的比率并使用答案中的基准来计算尺寸。希望这对其他人有帮助！

xxxlarge（xxxhdpi）：1280x1920（4.0x）
xxlarge（xxhdpi）：960x1440（3.0x）
xlarge（xhdpi）：640x960（2.0x）
大（hdpi）：480x800（1.5x）
中（mdpi）：320x480（基线的1.0x）
小（ldpi）：240x320（0.75x）

Android启动屏幕图像大小适合所有设备

11 个答案:

声明