Image de démarrage dans webapp pour l'affichage Retina?

Ce que quelqu'un sait comment obtenir de l'iOS pour afficher hausse de la résolution de l'image de démarrage lors de l'utilisation ? Actuellement, je suis coincé avec 460x380 image qui, de toute évidence semble horrible lors de l'affichage sur iPhone 4 de haute résolution d'affichage. J'ai essayé le @2x truc, mais ne semble pas fonctionner.

Des idées ou des solutions de contournement?

source d'informationauteur Crispy

  1. 21

    Jamais je n'avais pense que je voudrais obtenir ce travail, mais pour une raison quelconque, partout en ligne stipule que le salut-res images dimensions sont 640x960, ils sont en fait 640x920. Lorsque vous effectuez ce changement, le salut-res de l'écran de démarrage s'affichera correctement sur les écrans de la rétine. Ci-dessous est exactement le code que j'utilise dans notre application. Nous avons des écrans de démarrage de travail sur iPad1/iPad2 Portrait et Paysage, iPhone3/iPhone4

    Espère que cela aide quelqu'un.

      <!-- 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)"/>
  2. 1

    Avez-vous essayé d'utiliser les media queries liées à la ratio de pixel sur la link tag?

    media="only screen and (-webkit-min-device-pixel-ratio: 2)" pour l'écran retina.

  3. 0

    iPad: 

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

    J'ai vu des cas où XCode bousille dans cette situation. En plus d'une double vérification de la taille de l'image, (320x460) il ne fait pas de mal:

    1. Assurez-vous que les images sont dans la construction. (Droit/Option-cliquez sur les fichiers d'en-tête et sélectionnez "cible d'adhésion", puis vérifiez que la case est cochée.)
    2. Faire une construction propre.
    3. Supprimer tous les fichiers dans votre répertoire de construction. (En clair, n'obtient pas TOUS d'entre eux.)
    4. Supprimer l'application de la cible de téléphone/sim.

    Je sais que cela peut sembler évident, ou inutile, mais je me suis cogné la tête contre le même problème et la nettoyer/supprimer/supprimer une séquence fixe.

  5. -3

    Le "@2x" astuce fonctionne. Doit avoir été quelque chose de mal avec vos images.

    Vous avez besoin de deux fichiers. Par défaut.png et [email protected]. Le premier devrait être 320x460. Le second devrait être 640x920. Je vous promets qu'il fonctionne.