为啥我的图像对于 iPhone 来说太大了
Posted
技术标签:
【中文标题】为啥我的图像对于 iPhone 来说太大了【英文标题】：Why are my images too big for iPhone为什么我的图像对于 iPhone 来说太大了 【发布时间】：2012-02-13 18:46:05 【问题描述】：我使用以下设置创建了一个 Photoshop 文档：
宽度：640 像素 高度：960px 分辨率：326 像素/英寸 图片直接取自该文件。
我正在使用 phonegap 构建应用程序。每当我测试它时，它都会使我的图像对于 iPhone 屏幕来说太大了。我没有使用视口或调整任何东西的大小。请帮忙！
你们中的一些人要我的代码：
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<link rel="stylesheet" href="iphone.css" type="text/css" />
<!-- iPad/iPhone specific css below, add after your main css >
<link rel="stylesheet" media="only screen and (max-device-width: 480px)" href="iphone.css" type="text/css" />
<link rel="stylesheet" media="only screen and (max-device-width: 1024px)" href="ipad.css" type="text/css" />
-->
<!-- If your application is targeting ios BEFORE 4.0 you MUST put json2.js from http://www.JSON.org/json2.js into your www directory and include it here -->
<script type="text/javascript" charset="utf-8" src="phonegap-1.3.0.js"></script>
</script>
</head>
<body onload="onBodyLoad()">
<div class="wrapper">
<img src="img/iPhone/Welcome.png" class="header" />
</div>
</body>
</html>
【问题讨论】：
我不知道phonegap，但是发个截图或者一些源代码对这里的每个人都有帮助，我猜。 您保存的图像的最终尺寸是多少？每英寸 326 像素可能是问题所在 - Photoshop 可能会因此存储具有更大像素大小的文件 尝试在文件末尾添加@2x。示例：supermegacoolpicture@2x.png
我曾经在使用 300ppi 图像时遇到过同样的问题。尝试将分辨率降低到 90ppi。高分辨率只适合打印
【参考方案1】：
只需创建 640x960 尺寸的图像，不要设置 326 ppi，它不需要。使用默认即可。
【讨论】：
即使是 72，图像仍然显得更大。【参考方案2】：您不需要设置该分辨率...要在 Photoshop 中创建 iPhone 应用程序 UI，请使用以下设置：
iPhone 3G/3GS - iPod 宽度：320px 高度：480 像素 分辨率：72px/英寸 颜色方法：RGB 8bit 像素比：方形像素
iPhone 4 宽度：640 像素 高度：960 像素 分辨率：72px/英寸 颜色方法：RGB 8bit 像素比：方形像素
当您保存较大的图像（视网膜显示屏）时，请记住将它们命名为与较小的相同的名称，并在 .png 前添加 @2x
【讨论】：
我已经完成了您在这里的确切规格，但它仍然使图像过大。我什至在 xcode 中查找了图像，它说它的大小为 640x960，为 72 像素/英寸。我也尝试了@2x 的东西，但这似乎也不起作用。任何想法 我不知道phonegap，很遗憾我无法为您提供帮助...我每天都使用这些设置，我从来没有遇到过问题...【参考方案3】：即使您使用的是“视网膜”大小的图像，您仍然需要在 CSS（和 config.xml）中将大小（分辨率）指定为 320x480
如果你想一想，虽然里面装了更多的像素，但屏幕尺寸还是一样的。此外，当您将图像设置为更大的视网膜尺寸时，它会更有意义，因为您的图像显示太大。
【讨论】：
以上是关于为啥我的图像对于 iPhone 来说太大了的主要内容，如果未能解决你的问题，请参考以下文章
Qt 对于我的带宽上限来说太大了。我的替代方案是啥？ [关闭]