web-dev-qa-db-fra.com

Résolution d'image pour le nouvel iPhone 6 et 6+, prise en charge de @ 3x ajoutée?

J'ai consulté quelques articles et discussions tels que n ici et ici à propos des résolutions d'image que les nouveaux iPhones utiliseront des images @ 3x pour l'affichage. Est-ce vrai?

Cela signifie-t-il que nous devrons conserver trois images? Supposons par exemple que j'ai une image de 50 X 50. Dois-je conserver 3 images pour optimiser l'aspect des nouveaux iPhones?

  • Normal (50 X 50)
  • @ 2x - Rétine (100 X 100)
  • @ 3x - Retina HD (150 X 150)

Ou est-ce que les nouveaux téléphones n'utiliseront que des images @ 2x et qu'il n'y a rien de tel que @ 3x?

J'ai testé en créant un exemple de projet et tous les simulateurs semblent utiliser des images @ 3x, ce qui est source de confusion.

Modifier

Voici quelques informations supplémentaires

  • 3GS (163 ppi donc utilisez Normal)
  • 4, 4s, 5 et 5s (326 ppi donc on utilise @ 2x)
  • 6 (326 ppi so it seems like it will use @2x)
  • 6 plus (401 ppi, c'est la confusion)

Modifier

Sur la base des réponses données par Tsob et Nitin, j'ai ajouté des images @ 3x à mon projet.

Édition informative

Je vois peu d'utilisateurs se demander pourquoi l'iPhone 6 utilise des images @ 2x même si sa résolution est supérieure, la raison en est

l'iPhone 6 peut avoir une résolution différente mais une densité identique par pouce pixel (PPI)

  • La résolution concerne un nombre absolu de pixels.
  • La densité (ou Pixels par pouce - PPI) concerne un nombre relatif de pixels par pouce qui est identique pour l’iPhone 6 et les iPhones précédents, mais différent en iPhone 6 plus.

Vérifiez plus à ce sujet ici dans ce fil

Par conséquent, l'iPhone 6 utilise @ 2x les mêmes images que les iPhones 4, 5 et 5S, car il a le même PPI et l'iPhone 6 plus utilise @ 3x.

140
Bhumit Mehta

Dans un exemple de projet, j'ai essayé d'utiliser des images standard, @ 2x et @ 3x, et le simulateur de l'iPhone 6+ utilise l'image @ 3x. Il semblerait donc qu'il existe des images @ 3x à effectuer (si le simulateur reproduit réellement le comportement de l'appareil). Mais ce qui est étrange, c’est que tous les appareils (simulateurs) semblent utiliser cette image @ 3x quand elle se trouve sur la structure du projet, iPhone 4S/iPhone 5 aussi.
Le manque de communication de Apple sur une structure potentielle @ 3x, alors qu'ils demandent aux développeurs de publier leurs applications iOS8 est assez déroutant, en particulier lorsque ces résultats sont visualisés sur un simulateur.

** Modifier à partir du site Web d'Apple **: vous trouverez également cette information dans la section "Nouveautés de iOS 8" dans l'espace développeur Apple:

Prise en charge d'une nouvelle échelle d'écran L'iPhone 6 Plus utilise un nouvel écran Retina HD doté d'une échelle d'écran de 3,0. Pour offrir la meilleure expérience possible sur ces appareils, incluez une nouvelle illustration conçue pour cette échelle d'écran. Dans Xcode 6, les catalogues de ressources peuvent inclure des images de tailles 1x, 2x et 3x. Ajoutez simplement les nouveaux actifs d'image et iOS choisira les actifs appropriés lors de l'exécution sur un iPhone 6 Plus. Le comportement de chargement d'image dans iOS reconnaît également un suffixe @ 3x.

Vous ne comprenez toujours pas pourquoi tous les périphériques semblent charger le @ 3x. C'est peut-être parce que j'utilise des fichiers normaux et non des xcassets? Je vais essayer bientôt.

Éditez après des tests supplémentaires: Ok il semble que iOS8 parle dans ce domaine. Lors des tests sur un simulateur iOS 7.1 iPhone 5, il utilise correctement l'image @ 2x. Mais lors du lancement identique sur iOS 8, il utilise le @ 3x sur iPhone 5. Vous ne savez pas si c'est un comportement souhaité ou une erreur/un bogue dans iOS8 GM ou des simulateurs dans Xcode 6.

53
TSob

UPDATE:

Nouveau lien pour la taille de l'image des icônes par Apple.

https://developer.Apple.com/ios/human-interface-guidelines/graphics/image-size-and-resolution/

enter image description here


Oui, c’est vrai ici Apple fournit la documentation officielle concernant taille de l’icône ou de l’image

enter image description here

vous devez définir images pour iPhone6 ​​et iPhone6 ​​+

Pour iPhone 6:

750 x 1334 (@2x) for portrait

1334 x 750 (@2x) for landscape

Pour iPhone 6 Plus:

1242 x 2208 (@3x) for portrait

2208 x 1242 (@3x) for landscape

Pour plus d'informations sur les images et sa résolution, il s'agit du meilleur article utile à ce jour

Pour définir la taille des images pour les contrôles, vous pouvez définir 1x @ 2x et @ 3x comme suit:

enter image description here

102
Nitin Gohel

J'ai testé en créant un exemple de projet et tous les simulateurs semblent utiliser des images @ 3x, ce qui est déroutant.

Créez différentes versions d'une image dans votre catalogue de ressources, de sorte que l'image elle-même vous indique de quelle version il s'agit:

enter image description here

Maintenant, exécutez l'application sur chaque simulateur à tour de rôle. Vous verrez que l’image 3x est utilisée uniquement sur l’iPhone 6 Plus.

La même chose est vraie si les images sont tirées du paquet d'applications en utilisant leurs noms (par exemple one.png, [email protected] et one @ 3x.png) en appelant imageNamed: et en l'affectant à une vue d'image.

(Cependant, il y a une différence si vous affectez l'image à une vue d'image dans Interface Builder - la version 2x est ignorée sur les périphériques à double résolution. Il s'agit probablement d'un bogue, apparemment d'un bogue dans pathForResource:ofType:.)

10
matt

ios essaiera toujours de prendre la meilleure image, mais retombera sur d’autres options. Ainsi, si vous n’avez que des images normales dans l’application qui nécessite des images @ 2x, il utilisera les images normales.

si vous ne mettez que @ 2x dans le projet et que vous ouvrez l'application sur un appareil normal, les images seront réduites pour s'afficher.

si vous ciblez des appareils ios7 et ios8 et souhaitez une qualité optimale, vous aurez besoin de @ 2x et @ 3x pour le téléphone et d'actifs normaux et @ 2x pour l'iPad, car il ne reste plus de téléphone sans rétine ni d'iPad @ 3x.

il est peut-être préférable de créer les actifs dans l’application à partir de graphiques vectoriels ... check http://mattgemmell.com/using-pdf-images-in-ios-apps/

2
Bastian