我已经搜索了最好最简单的答案来制作9-patch image。现在制作9个补丁映像是最简单的任务。

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

根据Lucas Cerro的回答，我使用Android文档中的比率，使用答案中的基线来计算尺寸。我希望这能帮助其他人来到这个帖子!

xxxsize (xxxhdpi): 1280x1920 (4.0x) xxhdpi: 960x1440 (3.0x) Xlarge (xhdpi): 640x960 (2.0x) 大尺寸(hdpi): 480x800 (1.5x) 中(mdpi): 320x480 (1.0x基线) 小(ldpi): 240x320 (0.75x)

免责声明

这个答案来自2013年，已经严重过时了。截至Android 3.2，现在有6组屏幕密度。这个答案会尽快更新，但没有预计时间。参考目前所有密度的官方文档(尽管关于特定像素大小的信息总是很难找到)。

这是tl/dr版本

创建4个图像，每个屏幕密度一个: Xlarge (xhdpi): 640x960 Large (hdpi): 480x800 中(mdpi): 320x480 Small (ldpi): 240x320 请阅读Android开发者指南中的9-patch镜像介绍 设计图像的区域可以安全地拉伸，而不会影响最终结果

这样，Android将为设备的图像密度选择适当的文件，然后它将根据9-patch标准拉伸图像。

tl结束;全帖前

我回答的是有关设计方面的问题。我不是开发人员，所以我不能提供实现所提供的许多解决方案的代码。唉，我的目的是帮助那些像我一样迷茫的设计师，当我帮助开发我的第一个Android应用程序时。

适合所有尺寸

有了安卓系统，公司可以开发几乎任何尺寸、几乎任何分辨率的手机和桌子。正因为如此，启动画面不存在“正确的图像大小”，因为没有固定的屏幕分辨率。这给那些想要执行启动画面的人带来了一个问题。

你的用户真的想看到启动画面吗?

(另一方面，易用性研究人员并不鼓励启动画面。有人认为，用户已经知道他点击了什么应用，用闪屏为你的图像打上烙印是没有必要的，因为它只会用“广告”打断用户体验。但是，它应该用于初始化时需要大量加载的应用程序(5s+)，包括游戏等，这样用户就不会怀疑应用程序是否崩溃了)。

屏幕密度;4类

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

低密度(ldpi ~ 120dpi) 中密度(mdpi ~ 160dpi) 高密度(hdpi ~ 240dpi) 超高密度(xhdpi ~ 320dpi) (这些dpi值是近似值，因为定制设备将有不同的dpi值)

你(如果你是一个设计师)需要知道的是，Android基本上从4张图片中选择显示，这取决于设备。所以你基本上必须设计4个不同的图像(尽管可以为不同的格式开发更多，如宽屏，纵向/横向模式等)。

记住这一点:除非你为Android中使用的每一种分辨率设计屏幕，否则你的图像将被拉伸以适应屏幕大小。除非你的图像基本上是渐变或模糊的，否则拉伸会产生一些不希望看到的失真。所以你基本上有两个选择:为每个屏幕大小/密度组合创建一个图像，或者创建四个9-patch图像。

The hardest solution is to design a different splash screen for every single resolution. You can start by following the resolutions in the table at the end of this page (there are more. Example: 960 x 720 is not listed there). And assuming you have some small detail in the image, such as small text, you have to design more than one screen for each resolution. For example, a 480x800 image being displayed in a medium screen might look ok, but on a smaller screen (with higher density/dpi) the logo might become too small, or some text might become unreadable.

9-patch形象

另一种解决方案是创建一个9个补丁的映像。它基本上是一个1像素的透明边界围绕着你的图像，通过在这个边界的顶部和左侧区域绘制黑色像素，你可以定义你的图像的哪些部分将被允许拉伸。我不会详细介绍9-patch图像的工作原理，但简而言之，与顶部和左侧区域的标记对齐的像素就是将重复用于拉伸图像的像素。

一些基本规则

You can make these images in photoshop (or any image editing software that can accurately create transparent pngs). The 1-pixel border has to be FULL TRANSPARENT. The 1-pixel transparent border has to be all around your image, not just top and left. you can only draw black (#000000) pixels in this area. The top and left borders (which define the image stretching) can only have one dot (1px x 1px), two dots (both 1px x 1px) or ONE continuous line (width x 1px or 1px x height). If you choose to use 2 dots, the image will be expanded proportionally (so each dot will take turns expanding until the final width/height is achieved) The 1px border has to be in addition to the intended base file dimensions. So a 100x100 9-patch image has to actually have 102x102 (100x100 +1px on top, bottom, left and right) 9-patch images have to end with *.9.png

所以你可以在你的logo的两边(在顶部边框)放一个点，在上面和下面(在左边边框)放一个点，这些标记的行和列将是唯一需要拉伸的像素。

例子

下面是一个9个补丁的图像，102x102px (100x100的最终尺寸，用于应用程序):

下面是放大200%的图片:

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

下面是这个图像在应用程序中100x100的样子:

下面是放大到460x140的效果:

One last thing to consider. These images might look fine on your monitor screen and on most mobiles, but if the device has a very high image density (dpi), the image would look too small. Probably still legible, but on a tablet with 1920x1200 resolution, the image would appear as a very small square in the middle. So what's the solution? Design 4 different 9-patch launcher images, each for a different density set. To ensure that no shrinking will occur, you should design in the lowest common resolution for each density category. Shrinking is undesirable here because 9-patch only accounts for stretching, so in a shrinking process small text and other elements might lose legibility.

以下是每个密度类别中最小、最常见的分辨率:

Xlarge (xhdpi): 640x960 Large (hdpi): 480x800 中(mdpi): 320x480 Small (ldpi): 240x320

So design four splash screens in the above resolutions, expand the images, putting a 1px transparent border around the canvas, and mark which rows/columns will be stretchable. Keep in mind these images will be used for ANY device in the density category, so your ldpi image (240 x 320) might be stretched to 1024x600 on an extra large tablet with small image density (~120 dpi). So 9-patch is the best solution for the stretching, as long as you don't want a photo or complicated graphics for a splash screen (keep in mind these limitations as you create the design).

Again, the only way for this stretching not to happen is to design one screen each resolution (or one for each resolution-density combination, if you want to avoid images becoming too small/big on high/low density devices), or to tell the image not to stretch and have a background color appear wherever stretching would occur (also remember that a specific color rendered by the Android engine will probably look different from the same specific color rendered by photoshop, because of color profiles).

我希望这对你们有意义。

编辑的解决方案，将使您的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的设备后，我真的很失望。我注意到溅水幕再次试图填满整个视野，看起来像一坨屎。在撕了半天眉毛之后，我终于靠意志力勉强找到了解决办法。

you need to create a second file named exactly like the splashscreen xml (lets say splash_screen.xml) and place it into 2 folders called drawable-v22 and drawable-v21 that you will create in the res/ folder (in order to see them you have to change your project view from Android to Project). This serves to tell your phone to redirect to files placed in those folders whenever the relevant device runs an API corresponding to the -vXX suffix in the drawable folder, see this link. place the following code in the Layer-list of the splash_screen.xml file that you create in these folders:

<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>

For some reason for these APIs you have to wrap your drawable in a bitmap in order to make it work and jet the final result looks the same. The issue is that you have to use the aproach with the aditional drawable folders as the second version of the splash_screen.xml file will lead to your splash screen not being shown at all on devices running APIs higher than 23. You might also have to place the first version of the splash_screen.xml into drawable-v24 as android defaults to the closest drawable-vXX folder it can find for resources. hope this helps

使用PNG并不是一个好主意。实际上，就性能而言，这是昂贵的。 您可以使用可绘制的XML文件，例如，Facebook的背景。

这将帮助你平滑和加速你的性能，并为标志使用。9补丁图像。

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