¿Cómo admitir varios tamaños de pantalla de iPhone a partir de 2014?

Ya casi termino de build mi primera aplicación de iPhone y estoy tratando de agregar una image de background, y la encuentro un poco confusa, porque hoy en día hay como 3 o 4 pantallas de diferentes tamaños entre las diferentes versiones de iPhone, con diferentes resoluciones para arrancar.

Entonces, mientras conozco todo el asunto de image@2x.png , todavía no sé lo que realmente necesito. Si quiero que mi aplicación se ejecute en iPhone 4 / 4s, 5s / 5c, 6/6 +, ¿cuántas versiones diferentes de una image de background necesito y en qué tamaños y resoluciones?

He buscado en Google y no he encontrado ninguna respuesta coherente actualizada para 2014.

Además, si el iPhone 6 es 1334×750 @ 3x, ¿eso significa que se supone que debo include un background 4002×2250? ¿Y luego para el iPhone de 1920×1080 6+ @ 3x, una image de 5760 x 3240? Eso es MASIVO! Siento que debo entender esto incorrectamente.

Si desea admitir la resolución nativa del iPhone 6 / Plus, debe agregar imágenes de inicio (antes de iOS 8) o iniciar la pantalla xib (iOS 8).

iPhone 4 / 4S: 640 x 960

iPhone 5 / 5S: 640 x 1136

iPhone 6: 750 x 1334

iPhont 6 Plus: 1242 x 2208

Eso significa que necesita preparar 4 imágenes de inicio con la resolución anterior si desea admitir estos dispositivos. Puede usar el simulador de iOS para capturar capturas de pantalla con diferentes resoluciones. Su aplicación se ejecutará en compatibility mode en dispositivos de resolución nuevos si no puede encontrar la image de inicio de la resolución específica. compatibility mode significa que su vista se escalará para adaptarse al nuevo tamaño de pantalla cuando todavía tenga el mismo tamaño lógico.

EDITAR:

Creo que op malinterpreta lo que significan @2x y @3x . La resolución del iPhone 6 es de 750(pixels) x 1334(pixels), 326 pixels per inch . Esta es la resolución REAL . Y 375(points) x 667(points) es el tamaño lógico si se admite la resolución nativa. La resolución del iPhone 6 Plus es 1242(pixels) x 2208(pixels), 401 pixels per inch y el tamaño lógico es 414(points) x 736(points) .

Así es como funcionan las imágenes con diferentes resoluciones en el dispositivo iOS:

Digamos que quieres ejecutar tu aplicación en iPhone 4s, iPhone 5 / 5S, iPhone 6 / plus. Lo primero que debe hacer es proporcionar 4 imágenes de lanzamiento para admitir resoluciones nativas de estos dispositivos. Cuando iOS inicie su aplicación, comprobará si la aplicación proporciona la image de inicio correcta para admitir la resolución nativa del dispositivo actual. Si iOS lo encuentra, entonces use eso en el time de inicio y el tamaño lógico de la pantalla es correcto , su aplicación se ejecutará de manera normal. De lo contrario, su aplicación se ejecutará en compatibility mode en la que se escalarán todas las vistas.

Suponga que hay una image llamada foo.png en su aplicación cuyo tamaño lógico es 100(points) x 100(points) . Desea que esta image se vea igual en todos los dispositivos anteriores. Debe proporcionar 2 versiones de esta image. Uno es 200(pixels) x 200 (pixels) y debe llamarse foo.png@2x y el otro es 300(pixels) x 300(pixels) denominado foo.png@3x . Si carga esta image con [UIImage imageNamed:@"foo"] , en los dispositivos excepto el iPhone 6 plus, la aplicación cargará la image llamada foo.png@2x . De lo contrario, la aplicación cargará foo.png@3x y foo.png@3x hasta 300 * 84% (píxeles) x 300 * 84% (píxeles).

Y si carga una image de una url y necesita procesarla en el time de ejecución. Digamos que el tamaño que obtienes es {width:100, height:100} , la escala es 1.0 . Esto significa que el tamaño REAL de esta image es de 100 * 1.0(pixels) x 100 * 1.0(pixels . Si no quiere que se amplíe, debe calcular el tamaño lógico usted mismo. Hágalo así:

 UIImage *image = ... // you get it from an url CGFloat scale = [UIScreen mainScreen].scale; CGFloat width = image.size.width / scale; CGFloat height = image.size.height / scale; CGRect frame = CGRectMake(50.0f, 50.0f, width, height)]; UIImageView *imageView = [[UIImageView alloc] initWithFrame:frame]; imageView.contentMode = UIViewContentModeCenter; imageView.image = image; [self.view addSubview:imageView]; 

Creo que la forma más fácil de hacerlo es usar una image que se adapta al iPhone 6+ y luego simplemente establecer el contentMode de UIViewContentModeCenter en UIViewContentModeCenter . Creo que al less así es, el resultado debería ser que en iPhone 6+ tienes una image cinput, pero en las otras pantallas simplemente obtienes una parte de la image.

El muestreo del iPhone 6+ significa que un activo de 3x que cubra toda la pantalla debe ser de 2208×1242 (es decir, esta resolución ya es 3x. La resolución "real" es 736×414). Esta es la resolución más grande que se necesita y luego puede utilizar la misma image para los activos @ 2x y @ 1x utilizando el método que describí.

Necesitará tres versiones de la image de background (1x, 2x, 3x). Una buena práctica para tener imágenes del tamaño correcto es hacer una image de un tamaño que sea 3 veces el tamaño de su vista y luego hacer el 2x y 3x. Versiones 1x networkinguciendo la escala.

Apple ha creado un nuevo concepto llamado "Clases de tamaño" para admitir los diferentes tamaños de dispositivo. Para usar las classs de tamaño, necesitará la última versión de Xcode (Xcode 6). En el generador de interfaces puede establecer diferentes sets de restricciones para diferentes classs de tamaño. De esta manera, es más fácil admitir todos los tamaños de pantalla. Para saber más sobre las classs de Tamaño vea el video de WWDC 2014 "Construyendo aplicaciones adaptables con UIKit".

¿Qué motor de juego estás usando? Si está utilizando cocos2d o cocos2dx, puede usar una image de background de 960 * 640. El código de la base escalará las imágenes según el tamaño de la pantalla.

 CCSize frameSize = pEGLView->getFrameSize(); CCSize designSize = CCSizeMake(480, 320); vector<string> searchPaths; CCSize resourceSize; Utility :: isPad = true; searchPaths.push_back("hd"); resourceSize = CCSizeMake(960, 640); CCEGLView::shanetworkingOpenGLView()->setDesignResolutionSize(designSize.width , designSize.height, kResolutionExactFit); pDirector->setContentScaleFactor(resourceSize.width/designSize.width); 

Estas son las diferentes resoluciones que necesitarás para tu image de background.

  1. iPhone 4 / 4S – 640 * 960
  2. iPhone 5 / 5S – 640 * 1136
  3. iPhone 6 – 750 x 1334 para retrato 1334 x 750 para paisaje
  4. iPhone 6 Plus – 1242 x 2208 para retrato 2208 x 1242 para paisaje