2012-02-13 7 views
0

j'ai commencé un document Photoshop avec le réglage suivant:Pourquoi mes images trop grand pour iPhone

largeur: 640px
hauteur: 960px
Résolution: 326 pixels/pouce
Les images sont prises directement à partir ce fichier. J'utilise phonegap pour créer une application. Chaque fois que je le tester, il rend mon image beaucoup trop grande pour l'écran de l'iPhone. Je n'utilise pas de fenêtre ou je ne redimensionne rien. S'il vous plaît aider!

Certains d'entre vous demandaient mon code:

<!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> 
+0

Ce n'est pas comme si je connaissais le casse-téléphone, mais afficher une capture d'écran ou un code source aiderait tout le monde ici, je suppose. –

+0

Quelle est la taille finale des images que vous enregistrez? Le 326 Pixels par pouce peut être le problème - Photoshop peut stocker les fichiers avec une taille de pixel beaucoup plus grande à cause de cela –

+0

essayez d'ajouter '@ 2x' à la fin du fichier. Exemple: 'supermegacoolpicture @ 2x.png' – Novarg

Répondre

3

il suffit de créer des images avec la taille 640x960 ne définissez pas 326 ppi ce ne est pas nécessaire. Il suffit d'aller avec le défaut.

+0

Même à 72, les images semblent encore beaucoup plus grandes. – nate8684

0

Vous n'avez pas besoin de définir cette résolution ... Pour créer l'application iPhone interface utilisateur dans Photoshop, utilisez les paramètres suivants:

iPhone 3G/3GS - iPod
Largeur: 320px
Taille: 480px
Resoluzion: 72px/pouce
Couleur Méthode: RVB 8bit
Ratio de pixels: Pixels carrés

iPhone 4
Largeur: 640px
Taille: 960px
Résolution: 72px/pouce
Couleur Méthode: RVB 8bit
Ratio de pixels: Pixels carrés

Lorsque vous enregistrez vos images plus grandes (affichage de la rétine), rappelez-vous de nom

+0

J'ai fait les spécifications exactes que vous avez ici mais cela rend les images trop grandes. J'ai même regardé l'image dans xcode et elle dit que sa taille est de 640x960 et qu'elle est de 72 pixels/pouce. J'ai aussi essayé le truc @ 2x mais ça ne semble pas fonctionner non plus. Toutes les pensées – nate8684

+0

Je ne sais pas phonegap et malheureusement je ne peux pas vous aider à ce sujet ... J'utilise ces paramètres tous les jours et je n'ai jamais eu de problèmes ... – matteodv

0

Même si vous utilisez une image de taille "rétine", vous devez toujours spécifier la taille (résolution) en 320x480 dans votre CSS (et config. xml)

Si vous y pensez, bien qu'il y ait plus de pixels, la taille de l'écran reste la même. En outre, il est plus logique que votre image affiche trop grand lorsque vous le définissez à la plus grande, la taille de la rétine.