android splash screen sizes for ldpi,mdpi, hdpi, xhdpi displays ? - eg : 1024X768 pixels for ldpi

我必须使用 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" />
300831 次浏览
  • Xlarge screens are at least 960dp x 720dp
  • 列出项目大屏幕至少640dp x 480dp
  • 列表项目正常屏幕是至少470dp x 320dp
  • List item small screens are at least 426dp x 320dp

使用此选项创建图像并将其放入特定的资源文件夹中。

由于 Android 没有设置标准尺寸,所以可以有很多不同的屏幕尺寸,作为一个指南,你可以使用 Google 提供的最小屏幕尺寸。

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

  • xlarge screens are at least 960dp x 720dp
  • 大屏幕至少640dp x 480dp
  • 普通屏幕至少470dp x 320dp
  • 小屏幕至少426dp x 320dp

你可以在谷歌的 可在此下载仪表板上查看设备相对大小的统计数据。

在多个屏幕上可以找到更多的信息 给你

9号补丁图像

最好的解决方案是创建一个9个补丁的图像,这样图像的边界可以拉伸到适合屏幕大小,而不会影响图像的静态区域。

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

Xlarge 屏幕至少960dp x 720dp 布局-xlarge 10”平板电脑(720x1280mdpi,800x1280mdpi 等)

大屏幕至少是640dp x 480dp 的平板电脑,比如 Streak (480x800mdpi) ,7“平板电脑(600x1024mdpi)

普通屏幕至少是470dp x 320dp 的布局典型的手机屏幕(480x800hdpi)

小屏幕是至少426dp x 320dp 的典型手机屏幕(240x320ldpi,320x480mdpi 等)

适用于 Android 手机

LDPI- icon-36x36, splash-426x320 (now with correct values)


MDPI- Icon-48x48,splash-470x320


HDPI- 图标72x72,启动-640x480


XHDPI- Icon-96x96,splash-960x720


XXHDPI- Icon-144x144

都是像素。

适用于 Android 平板设备

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

只要使用这个网站: http://ticons.fokkezb.nl:)

It makes it easier for you, and generates the correct sizes directly

Android 的启动画面尺寸

同时,对于 Cordova (又名 Phonegap) ,React-Nativeand 所有其他开发平台

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-补丁图像的重复区域。另一方面,如果只使用肖像大小,应用程序的大小可能会更少。更多的图片意味着需要更多的空间。

注意听

我认为没有一个确切的尺寸为所有的设备。我用的是 Xperia Z5。如果你开发一个跨平台的 webview 应用程序,你应该考虑很多事情(屏幕是否有软键导航按钮,等等)。因此,我认为只有一个合适的解决办法。解决方案是 准备一个 9补丁飞溅屏幕 (找到下面的 How to design a new splash screen标题)。

  1. 为上面的屏幕大小创建启动画面 9号补丁。给你的文件命名为 。9。 png后缀
  2. 将下面的代码行添加到 config.xml 文件中
  3. 如果需要,可以添加启动画面插件。
  4. 运行你的项目。

That's it!

Cordova 特定的代码 < br > 要添加到 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 中: File-> New In New 对话框窗口设置你的屏幕

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

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

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

如何生成一个9补丁的启动画面

After you designed your splash screen, if you want to design 9-Patch splash screen, you should insert 1 pixel gap for every side. For this reason you should increase +2 pixel your canvas size's width and height ( now your image sizes are 722 x 1282 ).

我已经留下了空白1像素的差距,在每一个方向下面。
使用 Photoshop 改变画布大小:
- Open a splash screen png file in Photoshop
- Click onto the lock icon next to the 'Background' name in the Layers field (to leave blank instead of another color like white) if there is like the below:
enter image description here
- Change the canvas size from Image menu ( Width: 720 pixels to 722 pixels and Height: 1280 pixels to 1282 pixels). Now, should see 1 pixel gap at every side of the splash screen image.

然后您可以使用 C: Program Files (x86) Android Android-Studio sdk tools dra9patch.bat 来转换一个9-patch 文件。为此,打开 Draw9patch 应用程序的启动画面。您应该定义您的徽标和可扩展区域。注意下面示例启动画面中的黑线。黑线的厚度只有1像素;)左边和上边的黑线定义了您的启动画面的必须显示区域。完全按照你的设计。右边和底部线定义了可添加和可移动区域(自动重复区域)。

就这么做: Zoom your image's top edge on draw9patch application. Click and drag your mouse to draw line. And press shift + click and drag your mouse to erase line.

Sample 9-patch design

If you develop a cross-platform app (like Cordova/PhoneGap) you can find the following address almost all mabile OS splash screen sizes. Click for 微软手机, 网络操作系统, 黑莓手机, Bada-WAC and 巴达 splash screen sizes.

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
  • LDPI: Portrait: 200 X 320px. Landscape: 320 X 200px.
  • 人像: 320X480px。景观: 480X320px。
  • 人像: 480X800px。景观: 800X480px。
  • XHDPI: 肖像: 720X1280px。景观: 1280X720px。
  • XXHDPI: 肖像: 960X1600px。景观: 1600X960px。
  • XXXHDPI: 肖像: 1280X1920px。景观: 1920X1280px。