Resolución de imagen para el nuevo iPhone 6 y 6+, ¿se agregó soporte @ 3x?


141

He visto algunos artículos y debates como uno aquí y aquí sobre las resoluciones de imagen que los nuevos iPhone utilizarán imágenes @ 3x para mostrar. ¿Es verdad?

Entonces, ¿significa que tendremos que mantener tres imágenes? Digamos, por ejemplo, que tengo una imagen de 50 X 50, ¿tendré que mantener 3 imágenes para optimizar el aspecto de los nuevos iPhone?

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

¿O los nuevos teléfonos usarán imágenes @ 2x solamente y no hay nada como @ 3x?

Lo he probado haciendo un proyecto de muestra y todos los simuladores parecen usar imágenes @ 3x, esto es confuso.

Editar

Aquí hay más información

  • 3GS (163 ppi, así que use Normal)
  • 4, 4s, 5 y 5s (326 ppi, así que usamos @ 2x)
  • 6 (326 ppi, por lo que parece que usará @ 2x)
  • 6 plus (401 ppi aquí yace la confusión)

Editar

Basado en las respuestas dadas por Tsob y nitin, agregué imágenes @ 3x a mi proyecto.

Edición informativa

Veo que pocos usuarios están confundidos acerca de por qué el iPhone 6 usa imágenes @ 2x a pesar de que tiene una resolución más alta, la razón es

El iPhone 6 puede tener una resolución diferente pero tiene la misma densidad de pulgada por píxel (PPI)

  • La resolución se refiere a un número absoluto de píxeles.
  • La densidad (también conocida como píxeles por pulgada - PPI) se refiere a un número relativo de píxeles por pulgada, que es el mismo en el caso del iPhone 6 y los iPhone anteriores, pero diferente en el iPhone 6 plus.

Mira más sobre esto aquí en este hilo

Por lo tanto, el iPhone 6 usa una imagen @ 2x igual que los iPhones 4, 5 y 5S, ya que tiene el mismo PPI y el iPhone 6 plus usa @ 3x.


Entonces, ¿cuál es el uso de Retina 4 2x, si ninguno de los dispositivos lo usa?
Mrunal

1
Estoy de acuerdo en que la densidad es la misma para 4, 5 y 6 iPhones, pero ¿cómo resolver un problema de resolución diferente? Entonces es una gran diferencia 640x960 y 750 × 1334 píxeles. Si necesito usar una imagen de fondo que se superponga a toda la pantalla. ¿Cómo puedo configurar xcassets de imagen en este caso?
Matrosov Alexander

@MatrosovAlexander ¿cómo resolvió eso?
Mário Carvalho

como apaño imagen iPhone 6 que se utiliza para @ 2x imagen también, pero de starnge que Xcode no tiene la imagen apropiado para ella
Matrosov Alexander

Respuestas:


54

Intenté en un proyecto de muestra usar imágenes estándar, @ 2x y @ 3x, y el simulador de iPhone 6+ usa la imagen @ 3x. Por lo tanto, parece que hay que hacer @ 3x imágenes (si el simulador realmente replica el comportamiento del dispositivo). Pero lo extraño es que todos los dispositivos (simuladores) parecen usar esta imagen @ 3x cuando está en la estructura del proyecto, iPhone 4S / iPhone 5 también.
La falta de comunicación de Apple en una estructura potencial @ 3x, mientras piden a los desarrolladores que publiquen sus aplicaciones iOS8 es bastante confusa, especialmente cuando se ven esos resultados en el simulador.

** Editar desde el sitio web de Apple **: También encontré esto en la sección "Novedades en iOS 8" en el espacio para desarrolladores de Apple:

Compatibilidad con una nueva escala de pantalla El iPhone 6 Plus utiliza una nueva pantalla Retina HD con una escala de pantalla de 3.0. Para proporcionar la mejor experiencia posible en estos dispositivos, incluya nuevas ilustraciones diseñadas para esta escala de pantalla. En Xcode 6, los catálogos de activos pueden incluir imágenes en tamaños 1x, 2x y 3x; simplemente agregue los nuevos activos de imagen e iOS elegirá los activos correctos cuando se ejecute en un iPhone 6 Plus. El comportamiento de carga de imágenes en iOS también reconoce un sufijo @ 3x.

Aún no entiendo por qué todos los dispositivos parecen cargar el @ 3x. ¿Quizás es porque estoy usando archivos normales y no xcassets? Lo intentare pronto.

Editar después de más pruebas: Ok, parece que iOS8 tiene una charla en esto. Al probar en un simulador de iOS 7.1 iPhone 5, utiliza correctamente la imagen @ 2x. Pero cuando se inicia lo mismo en iOS 8, utiliza @ 3x en iPhone 5. Sin embargo, no estoy seguro de si es un comportamiento deseado o un error / error en iOS8 GM o simuladores en Xcode 6.


2
Sí, probé con el simulador, todos los dispositivos toman imágenes @ 3x, realmente confuso
Bhumit Mehta

En conclusión, a partir de hoy, la mejor ruta posible sería utilizar "@ 2x" en los nombres de las imágenes, pero de alguna manera verificar el dispositivo para 6 Plus y usar una imagen 3x SIN el "@ 3x" para no envenenar los dispositivos 2x.
darkheartfelt

Parece que la opción 3x en el iPhone 6 solo ocurre si el activo en cuestión es JPG en lugar de PNG.
emreberge

102

ACTUALIZAR:

Nuevo enlace para el tamaño de la imagen de los iconos por apple.

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

ingrese la descripción de la imagen aquí


Sí, es cierto aquí, es Apple proporciona documentación oficial sobre el tamaño de los íconos o imágenes

ingrese la descripción de la imagen aquí

tienes que configurar imágenes para iPhone6 ​​y iPhone6 ​​+

Para iPhone 6:

750 x 1334 (@2x) for portrait

1334 x 750 (@2x) for landscape

Para iPhone 6 Plus:

1242 x 2208 (@3x) for portrait

2208 x 1242 (@3x) for landscape

Para obtener más información sobre las imágenes y su resolución, esta es la mejor publicación útil

Para configurar el tamaño de las imágenes para los controles, puede configurar 1x @ 2x y @ 3x de la siguiente manera:

ingrese la descripción de la imagen aquí


8
si todos los dispositivos son retina 2x o 3x, ¿por qué el catálogo de activos solicita imágenes 1x en proyectos para apuntar a iPhone solo en iOS 7/8? No tiene sentido.
Pato

1
podría ser eso para iphone4 @RubberDuck :) vea ese ipad 2 y iPad Mini que necesitan 1x
Nitin Gohel

lo siento pero no leíste lo que escribí. Estoy hablando de un proyecto solo para iPhone para iOS 7. No hay ningún iPhone con 1x que pueda ejecutar iOS 7, pero el catálogo de activos aún lo solicita.
Pato

@RubberDuck Seleccione su recurso de imagen y luego vea el panel de utilidades en el lado derecho de Xcode. Una de las pestañas tiene un conjunto de casillas de verificación. Quizás sus activos tengan demasiadas casillas de verificación seleccionadas, lo que da como resultado que 1x aparezca como una opción.
rmaddy


10

Lo he probado haciendo un proyecto de muestra y todos los simuladores parecen usar imágenes @ 3x, esto es confuso.

Cree diferentes versiones de una imagen en su catálogo de activos de modo que la imagen misma le diga qué versión es:

ingrese la descripción de la imagen aquí

Ahora ejecute la aplicación en cada simulador a su vez. Verá que la imagen 3x solo se usa en el iPhone 6 Plus.

Lo mismo es cierto si las imágenes se han extraído de la aplicación paquete utilizando sus nombres (por ejemplo one.png , one@2x.png y one@3x.png ) llamando imageNamed:y asignando en una vista de la imagen.

(Sin embargo, hay una diferencia si asigna la imagen a una vista de imagen en Interface Builder: la versión 2x ​​se ignora en los dispositivos de doble resolución. Esto es presumiblemente un error, aparentemente un error pathForResource:ofType:).


1
Ha marcado el activo como "universal", de ahí que vea un comportamiento consistente. ¡Intente seleccionar "dispositivo específico" en el menú desplegable!
Nikolay Spassov

1
@RalphZhouYuan Ahora funciona bien para mí. No verá la versión 2x ​​en la lista , pero solo asigne la versión 1x y la versión 2x ​​o 3x se utilizará correctamente. O simplemente use un catálogo de activos.
mate

1
@RalphZhouYuan Aquí está mi ejemplo descargable: github.com/mattneub/Programming-iOS-Book-Examples/tree/master/… : se muestra utilizando archivos de imagen en el paquete de aplicaciones y archivos de imagen en el catálogo de activos y todos funcionan correctamente.
mate

3
@matt Finalmente encuentro que mi problema está relacionado con la configuración de destino de implementación (que es 6.0) de mi aplicación. Abrí una pregunta: stackoverflow.com/questions/26333278/… y envié un informe de error a Apple.
inexcii

1
@RalphZhouYuan Wow, ¡gran trabajo de detective rastreando eso! Gracias por informarnos.
mate

2

iOS siempre intentará tomar la mejor imagen, pero recurrirá a otras opciones ... así que si solo tiene imágenes normales en la aplicación y necesita imágenes @ 2x, usará las imágenes normales.

si solo coloca @ 2x en el proyecto y abre la aplicación en un dispositivo normal, reducirá las imágenes para mostrarlas.

si apunta a dispositivos ios7 y ios8 y desea la mejor calidad, necesitaría @ 2x y @ 3x para teléfono y normal y @ 2x para activos de ipad, ya que no queda ningún teléfono que no sea retina ni ipad @ 3x.

tal vez sea mejor crear los activos en la aplicación a partir de gráficos vectoriales ... consulte http://mattgemmell.com/using-pdf-images-in-ios-apps/


solo use el increíble PaintCode para vectores en aplicaciones
Fattie
Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.