用于Retina显示的webapp中的启动图像?

时间:2010-09-14 09:15:11

标签: iphone ios4 mobile-safari

有人知道如何让iOS在使用时显示更高分辨率的启动图像吗?目前我仍然坚持使用460x380图像,这在iPhone 4的高dpi显示屏上显示时显然看起来很糟糕。我尝试了@ 2x技巧,但似乎没有用。

任何想法或解决方法?

5 个答案:

答案 0 :(得分:21)

我从来没有想过会让这个工作,但由于某种原因,网上到处都说高分辨率图像尺寸是640x960,它们实际上是640x920。进行此更改时,高分辨率启动屏幕将在视网膜显示屏上正确显示。以下是我在我们的应用中使用的确切代码。我们在iPad1 / iPad2上使用启动画面,纵向和横向,iPhone3 / iPhone4

希望这有助于某人。

  <!-- iOS Device Startup Images -->
<!-- iPhone/iPod Touch Portrait – 320 x 460 (standard resolution) -->
<link rel="apple-touch-startup-image" href="splash-screen-320x460.png" media="screen and (max-device-width: 320px)" />

<!-- iPhone/iPod Touch Portrait – 640 x 920 pixels (high-resolution) -->
<link rel="apple-touch-startup-image" media="(max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2)" href="splash-screen-640x920.png" />

<!-- For iPad Landscape 1024x748 -->
  <!-- Note: iPad landscape startup image has to be exactly 748x1024 pixels (portrait, with contents rotated).-->
<link rel="apple-touch-startup-image" sizes="1024x748" href="splash-screen-1024x748.png" media="screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape)" />

<!-- For iPad Portrait 768x1004 -->
<link rel="apple-touch-startup-image" sizes="768x1004" href="splash-screen-768x1004.png" media="screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait)"/>

答案 1 :(得分:1)

您是否尝试过在link代码上使用与像素比率相关的媒体查询?

media="only screen and (-webkit-min-device-pixel-ratio: 2)"用于视网膜显示器。

答案 2 :(得分:0)

iPad:

link rel="apple-touch-startup-image" sizes="768x1004" href="" /
iPhone Retina Display: link rel="apple-touch-startup-image" sizes="640x960" href="" /

答案 3 :(得分:-1)

我见过在这种情况下XCode混乱的情况。除了双重检查图像大小,(320x460)它不会伤害:

  1. 确保两张图片都在构建中。 (右键/选项单击文件标题并选择“目标成员资格”,然后确保选中该复选框。)
  2. 做一个干净的构建。
  3. 删除构建目录中的所有构建文件。 (干净不会得到所有这些。)
  4. 从目标手机/ SIM卡中删除应用程序。
  5. 我知道这似乎是显而易见的或不必要的,但我对同样的问题猛烈抨击,清理/删除/删除序列修复了它。

答案 4 :(得分:-3)

“@ 2x”技巧有效。一定是你的图片出了问题。

你想要两个文件。 Default.png和Default@2x.png。第一个应该是320x460。第二个应该是640x920。我保证会有效。