Android启动画面的大小适配LDPI、MDPI、HDPI、XHDPI屏幕?例如:对于LDPI,大小为1024X768像素。

121

我必须为使用Phonegap的Android应用程序设计启动画面(加载时适合屏幕的图像)。我需要设计4种大小的图片,以适配4种不同类型的屏幕,如ldpi、mdpi、hdpi和xhdpi。有人能告诉我这些屏幕的精确像素尺寸,以便我可以按照该尺寸进行设计吗?

ldpi - 1024X768 px
mdpi  - 111 X 156 px  

 We support ldpi, mdpi, hdpi and xhdpi displays; the following will define splash screens for each specific screen type.

<gap:splash src="splash/android/ldpi.png" gap:platform="android" gap:density="ldpi" />
<gap:splash src="splash/android/mdpi.png" gap:platform="android" gap:density="mdpi" />
<gap:splash src="splash/android/hdpi.png" gap:platform="android" gap:density="hdpi" />
<gap:splash src="splash/android/xhdpi.png" gap:platform="android" gap:density="xhdpi" />

3
这将会帮助你:这个链接 - Mohammed Azharuddin Shaikh
7个回答

163

Android的启动画面尺寸

同时适用于Cordova(又称Phonegap)、React-Native和所有其他开发平台

Format : 9-Patch PNG (recommended)

Dimensions

 - LDPI:
    - Portrait: 200x320px
    - Landscape: 320x200px
 - MDPI:
    - Portrait: 320x480px
    - Landscape: 480x320px
 - HDPI:
    - Portrait: 480x800px
    - Landscape: 800x480px
 - XHDPI:
    - Portrait: 720px1280px
    - Landscape: 1280x720px
 - XXHDPI
    - Portrait: 960x1600px
    - Landscape: 1600x960px
 - XXXHDPI 
    - Portrait: 1280x1920px
    - Landscape: 1920x1280px

注意:准备XXXHDPI可能是不必要的,也许XXHDPI大小也不需要,因为9-patch图像有重复区域。另一方面,如果只使用纵向尺寸,则应用程序大小可能更小。更多的图片意味着需要更多的空间。

请注意

我认为并没有适合所有设备的确切尺寸。我使用的是Xperia Z 5英寸。如果您开发跨平台Webview应用程序,则应考虑很多事情(屏幕是否有软键导航按钮等)。因此,我认为只有一个合适的解决方案。这个解决方案是准备一个9-patch启动画面(请参阅下面的如何设计新的启动画面标题)。

  1. 为上述屏幕尺寸创建9-patch启动画面。将文件命名为.9.png后缀
  2. 将以下行添加到config.xml文件中
  3. 如果需要,请添加启动画面插件。
  4. 运行您的项目。

就是这样!

针对 Cordova 的代码
添加到 config.xml 中的行,用于 9-patch 启动画面

<preference name="SplashScreen" value="screen" />
<preference name="SplashScreenDelay" value="6000" />
<platform name="android">
    <splash src="res/screen/android/ldpi.9.png" density="ldpi"/>
    <splash src="res/screen/android/mdpi.9.png" density="mdpi"/>
    <splash src="res/screen/android/hdpi.9.png" density="hdpi"/>
    <splash src="res/screen/android/xhdpi.9.png" density="xhdpi"/> 
</platform>

在使用9-patch启动画面时,需要将行添加到config.xml中

<platform name="android">
    <splash src="res/screen/android/splash-land-hdpi.png" density="land-hdpi"/>
    <splash src="res/screen/android/splash-land-ldpi.png" density="land-ldpi"/>
    <splash src="res/screen/android/splash-land-mdpi.png" density="land-mdpi"/>
    <splash src="res/screen/android/splash-land-xhdpi.png" density="land-xhdpi"/>

    <splash src="res/screen/android/splash-port-hdpi.png" density="port-hdpi"/>
    <splash src="res/screen/android/splash-port-ldpi.png" density="port-ldpi"/>
    <splash src="res/screen/android/splash-port-mdpi.png" density="port-mdpi"/>
    <splash src="res/screen/android/splash-port-xhdpi.png" density="port-xhdpi"/>
</platform>

如何设计新的启动画面

我将描述一种简单的方法来创建适当的启动画面。假设我们正在设计一个1280dp x 720dp - xhdpi(x-large)屏幕。为了举例,我写了以下内容;

  • 在Photoshop中:文件-> 新建,在新的对话框窗口中设置您的屏幕

    宽度:720像素 高度:1280像素

    我猜上述尺寸意味着分辨率为320像素/英寸。但是为了确保,您可以在对话框窗口中将分辨率值更改为320。在这种情况下像素/英寸=DPI

    恭喜...您有一个720dp x 1280dp的启动画面模板。

如何生成9-patch启动画面

设计好启动画面后,如果你想要设计一个9-Patch启动画面,你需要在每个边缘插入1像素的间隙。因此,你应该将画布大小的宽度和高度增加+2像素(现在你的图像尺寸为722 x 1282)。如下所示,我已经按照指示在每个边缘留下了1像素的空白。
使用Photoshop更改画布大小:
- 在Photoshop中打开一个启动画面png文件
- 点击图层字段中“Background”名称旁边的锁定图标(以留出空白而不是其他颜色,如白色),如果如下图所示:
enter image description here
- 从“Image”菜单更改画布大小(宽度:720像素到722像素,高度:1280像素到1282像素)。现在,应该在启动画面图像的每个边缘看到1像素的间隙。

然后,你可以使用C:\ Program Files(x86)\ Android \ android-studio \ sdk \ tools \ draw9patch.bat来转换9-patch文件。为此,在draw9patch应用程序中打开你的启动画面。你应该定义你的徽标和可扩展区域。请注意以下示例启动画面中的黑线。黑线的厚度只有1像素;)左侧和顶部的黑线定义了你的启动画面必须显示的区域。就像你设计的一样。右侧和底部的线条定义了可添加和可移除的区域(自动重复区域)。

只需要这样做: 在draw9patch应用程序中放大您图像的顶部边缘。单击并拖动鼠标以绘制线条。按住Shift + 单击并拖动鼠标以擦除线条。

Sample 9-patch design

如果您开发跨平台应用程序(如Cordova / PhoneGap),您可以在以下地址中找到几乎所有移动操作系统的启动画面大小。点击以获取Windows Phone, WebOS, BlackBerry, Bada-WACBada启动画面大小。

https://github.com/phonegap/phonegap/wiki/App-Splash-Screen-Sizes

如果您需要 IOS、Android 等应用程序图标尺寸,您可以访问此处

IOS

Format : PNG (recommended)

Dimensions

 - Tablet (iPad)
   - Non-Retina (1x)
     - Portrait: 768x1024px
     - Landscape: 1024x768px
   - Retina (2x)
     - Portrait: 1536x2048px
     - Landscape: 2048x1536px
 - Handheld (iPhone, iPod)
   - Non-Retina (1x)
     - Portrait: 320x480px
     - Landscape: 480x320px
   - Retina (2x)
     - Portrait: 640x960px
     - Landscape: 960x640px
 - iPhone 5 Retina (2x)
   - Portrait: 640x1136px
   - Landscape: 1136x640px
 - iPhone 6 (2x)
   - Portrait: 750x1334px
   - Landscape: 1334x750px
 - iPhone 6 Plus (3x)
   - Portrait: 1242x2208px
   - Landscape: 2208x1242px

109

适用于Android移动设备

LDPI- 图标-36x36,闪屏-426x320(现在具有正确的值)


MDPI- 图标-48x48,闪屏-470x320


HDPI- 图标72x72,闪屏-640x480


XHDPI- 图标96x96,闪屏-960x720


XXHDPI- 图标144x144

所有都是以像素为单位。

适用于Android平板设备

LDPI:
    Portrait: 200x320px
    Landscape: 320x200px
MDPI:
    Portrait: 320x480px
    Landscape: 480x320px
HDPI:
    Portrait: 480x800px
    Landscape: 800x480px
XHDPI:
    Portrait: 720px1280px
    Landscape: 1280x720px

@Geobits:两者都是以像素为单位的。这是针对不同分辨率的。我没有看到任何混淆之处。奇怪!! - Nijil Nair
1
你提供的 ldpi/mdpi/hdpi/xhdpi 尺寸对应于 这里 中的 small/normal/large/xlarge,单位是 dp。如果它们是像素尺寸,它们应该按比例为 0.75/1/1.5/2。你有我没有看到的这些尺寸的来源吗? - Geobits
@NijilNair:为什么平板电脑上的图像分辨率比手机小?!这不应该是相反的吗?例如,我对“移动电话ldpi:426x320”和“平板电脑ldpi:320 x 200”感到惊讶……根本不合逻辑。谢谢回答! - Phalanx
@Phalanx:请查看此链接。http://developer.android.com/guide/practices/screens_support.html#ConfigurationExamples。 - Nijil Nair
1
你确定LDPI图标不是36x36吗? - Vladius
但是XXHDPI启动画面在哪里? - Blaise

102

由于Android没有标准的屏幕尺寸,因此可能会有任意数量的不同屏幕尺寸。作为指南,您可以使用Google提供的最小屏幕尺寸。

根据Google的统计数据,大多数ldpi显示器都是小屏幕,而大多数mdpi、hdpi、xhdpi和xxhdpi显示器则是普通屏幕。

  • xlarge屏幕至少为960dp x 720dp
  • large屏幕至少为640dp x 480dp
  • normal屏幕至少为470dp x 320dp
  • small屏幕至少为426dp x 320dp

您可以在Google的仪表板上查看设备相对大小的统计数据,网址为https://developer.android.com/about/dashboards/index.html#Screens

有关多个屏幕的更多信息,请点击这里

9 Patch图片

最好的解决方案是创建一个九宫格图片,使图片的边框可以拉伸以适应屏幕大小,而不影响图片的静态区域。

http://developer.android.com/guide/topics/graphics/2d-graphics.html#nine-patch


你能否也包含 xxhdpi?(如果存在的话) - Adonis K. Kakoulidis
谷歌将xxhdpi定义为约480 DPI。据我所见,他们没有提供此屏幕的最小尺寸。 - Alex Wiese
8
为什么这个帖子有那么多点赞?xlarge != xhdpi,它们测量的是两个完全不同的东西。那些dp尺寸是列在尺寸桶中的,而不是密度。 - Geobits
@geobits 看一下问题。他正在询问他应该为支持的每个密度设置什么大小的启动画面。由于Android没有固定的标准尺寸,因此可能会有任意数量的不同尺寸,我们可以给出的最接近正确答案是最小屏幕尺寸,这是由Google提供的。如果您跟随答案中的链接,可以了解更多信息。 - Alex Wiese
2
我理解你的意思,但这不是你答案所表达的。如果是的话,我也不会评论了。他要求一个尺寸列表,而你只是给出了一个基于其他内容的列表,没有解释。你应该进行编辑,无论是否链接到文档。 - Geobits

34
  • LDPI:纵向:200 X 320像素。横向:320 X 200像素。
  • MDPI:纵向:320 X 480像素。横向:480 X 320像素。
  • HDPI:纵向:480 X 800像素。横向:800 X 480像素。
  • XHDPI:纵向:720 X 1280像素。横向:1280 X 720像素。
  • XXHDPI:纵向:960 X 1600像素。横向:1600 X 960像素。
  • XXXHDPI:纵向:1280 X 1920像素。横向:1920 X 1280像素。

3
我在各处阅读到xhdpi只是mdpi的两倍,因此根据这个,xhdpi应该是640 x 960,但你写成了720x1280。你能解释一下为什么是720x1280吗?你使用了哪个公式? - Rahul Sharma
1
xxxhdpi 不是 1440x2560 吗?根据这个列表,Google Pixel XL 被列为 xxxhdpi。https://material.io/resources/devices/ - CularBytes

10
  • Xlarge屏幕至少为960dp x 720dp
  • 大屏幕列表项至少为640dp x 480dp
  • 正常屏幕列表项至少为470dp x 320dp
  • 小屏幕列表项至少为426dp x 320dp

使用此设置创建您的图像并将其放置在特定的资源文件夹中。


7

这个网站似乎是为iOS图像而设计的,不是为Android。 - Ryan Williams
2
我在安卓上使用它,结果相当满意。 - Oussama L.
网站现在无法访问。 - Milon

2

大屏幕至少为960dp x 720dp布局,例如10英寸平板电脑(720x1280 mdpi、800x1280 mdpi等) layout-xlarge。

中等屏幕至少为640dp x 480dp,如Streak平板电脑(480x800 mdpi)、7英寸平板电脑(600x1024 mdpi)。

正常屏幕至少为470dp x 320dp布局,典型手机屏幕(480x800 hdpi)。

小屏幕至少为426dp x 320dp布局,典型手机屏幕(240x320 ldpi、320x480 mdpi等)。


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接