¿Cómo desarrollar o migrar aplicaciones para la resolución de pantalla del iPhone 5?

La nueva pantalla del iPhone 5 tiene una nueva relación de aspecto y una nueva resolución (640 x 1136 píxeles).

¿Qué se requiere para desarrollar aplicaciones nuevas o de transición ya existentes al nuevo tamaño de pantalla?

¿Qué debemos tener en cuenta para hacer que las aplicaciones sean "universales" tanto para las pantallas antiguas como para la nueva relación de aspecto de pantalla ancha?

1. Descargue e instale la última versión de Xcode .
2. Establezca un archivo de pantalla de inicio para su aplicación (en la pestaña general de la configuración de destino). Así es como puede usar el tamaño completo de cualquier pantalla, incluidos los tamaños de vista dividida de iPad en iOS 9.
3. Pruebe su aplicación y, con suerte, no haga nada más, ya que todo debería funcionar mágicamente si configuró las máscaras de redimensionamiento automático correctamente o si utilizó el diseño automático.
4. Si no lo hizo, ajuste sus diseños de vista, preferiblemente con Diseño automático.
5. Si hay algo que tiene que hacer específicamente para las pantallas más grandes, entonces parece que debe verificar la altura, [[UIScreen mainScreen] bounds]ya que parece que no hay una API específica para eso. A partir de iOS 8, también hay clases de tamaño que resumen los tamaños de pantalla en forma regular o compacta vertical y horizontalmente y son una forma recomendada de adaptar su interfaz de usuario.

Si tiene una aplicación creada para iPhone 4S o anterior, se ejecutará en buzón en iPhone 5.

Para adaptar su aplicación a la nueva pantalla más alta, lo primero que debe hacer es cambiar la imagen de inicio a: [email protected]. Su tamaño debe ser 1136x640 (HxW). Sí, tener la imagen predeterminada en el nuevo tamaño de pantalla es la clave para permitir que su aplicación tome toda la pantalla del nuevo iPhone 5 .

(Tenga en cuenta que la convención de nomenclatura solo funciona para la imagen predeterminada. Nombrar otra imagen "[email protected]" no hará que se cargue en lugar de "[email protected]". Si necesita cargar imágenes diferentes para diferentes tamaños de pantalla, deberá hacerlo mediante programación).

Si tienes mucha suerte, eso podría ser ... pero con toda probabilidad, tendrás que dar algunos pasos más.

• Asegúrese de que sus Xibs / Vistas usen el diseño automático para cambiar su tamaño.
• Use resortes y puntales para cambiar el tamaño de las vistas.
• Si esto no es lo suficientemente bueno para su aplicación, diseñe su xib / storyboard para un tamaño de pantalla específico y vuelva a colocarlo programáticamente para el otro.

En el caso extremo (cuando ninguno de los anteriores es suficiente), diseñe los dos Xib y cargue el apropiado en el controlador de vista.

Para detectar el tamaño de la pantalla:

if(UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPhone)
{
    CGSize result = [[UIScreen mainScreen] bounds].size;
    if(result.height == 480)
    {
        // iPhone Classic
    }
    if(result.height == 568)
    {
        // iPhone 5
    }
}

Lo único que realmente se debe hacer es agregar una imagen de inicio llamada "[email protected]" a los recursos de la aplicación y, en general, si tiene la suerte, la aplicación funcionará correctamente.

En caso de que la aplicación no maneje eventos táctiles, asegúrese de que la ventana de teclas tenga el tamaño adecuado. La solución es establecer el marco adecuado:

[window setFrame:[[UIScreen mainScreen] bounds]]

Existen otros problemas que no están relacionados con el tamaño de la pantalla al migrar a iOS 6. Lea las Notas de la versión de iOS 6.0 para más detalles.

A veces (para las aplicaciones previas al guión gráfico), si el diseño va a ser lo suficientemente diferente, vale la pena especificar un xib diferente según el dispositivo (vea esta pregunta ; deberá modificar el código para manejar el iPhone 5) en el viewController init, ya que ninguna cantidad de twiddling con máscaras de autoresizing funcionará si necesita gráficos diferentes.

-(id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil

    NSString *myNibName;
    if ([MyDeviceInfoUtility isiPhone5]) myNibName = @"MyNibIP5";
    else myNibName = @"MyNib";

    if ((self = [super initWithNibName:myNibName bundle:nibBundleOrNil])) {


...

Esto es útil para aplicaciones que se dirigen a versiones anteriores de iOS.

Aquí puede encontrar un buen tutorial (para MonoTouch, pero también puede usar la información para proyectos que no son MonoTouch):
http://redth.info/get-your-monotouch-apps-ready-for-iphone-5 -ios-6-hoy /

1. Cree una nueva imagen para su pantalla de presentación / predeterminada ( 640 x 1136 píxeles ) con el nombre " [email protected] "

2. En el simulador de iOS , vaya al menú Hardware -> Dispositivo y seleccione " iPhone (Retina de 4 pulgadas) "

3. Crear otras imágenes, por ejemplo, imágenes de fondo.

4. Detecta el iPhone 5 para cargar tus nuevas imágenes:

public static bool IsTall
{
    get {
        return UIDevice.currentDevice.userInterfaceIdiom
                    == UIUserInterfaceIdiomPhone
                && UIScreen.mainScreen.bounds.size.height
                    * UIScreen.mainScreen.scale >= 1136;
    }
}

private static string tallMagic = "-568h@2x";
public static UIImage FromBundle16x9(string path)
{
    //adopt the -568h@2x naming convention
    if(IsTall())
    {
        var imagePath = Path.GetDirectoryName(path.ToString());
        var imageFile = Path.GetFileNameWithoutExtension(path.ToString());
        var imageExt = Path.GetExtension(path.ToString());
        imageFile = imageFile + tallMagic + imageExt;
        return UIImage.FromFile(Path.Combine(imagePath,imageFile));
    }
    else
    {
        return UIImage.FromBundle(path.ToString());
    }
}

Es fácil migrar iPhone5 y iPhone4 a través de XIB .........

UIViewController *viewController3;
if ([[UIScreen mainScreen] bounds].size.height == 568)
{
    UIViewController *viewController3 = [[[mainscreenview alloc] initWithNibName:@"iphone5screen" bundle:nil] autorelease];               
}    
else
{
     UIViewController *viewController3 = [[[mainscreenview alloc] initWithNibName:@"iphone4screen" bundle:nil] autorelease];
}

Resuelvo este problema aquí . Simplemente agregue el sufijo ~ 568h @ 2x a las imágenes y ~ 568h a las xib. No necesita más comprobaciones de tiempo de ejecución o cambios de código.

Agregué la nueva imagen de inicio predeterminada y (al revisar varias otras respuestas SE ...) me aseguré de que mis guiones gráficos tuvieran un tamaño automático y subvistas, pero la retina de 4 pulgadas todavía estaba en buzón.

Luego me di cuenta de que mi plist de información tenía una línea de pedido para " Iniciar imagen " establecida en " Default.png ", que por lo tanto eliminé y mágicamente no apareció el buzón. Con suerte, eso salva a alguien más la misma locura que soporté.

Supongo que no funcionará en todos los casos, pero en mi proyecto en particular me evitó la duplicación de archivos NIB:

En algún lugar common.hpuede hacer estas definiciones en función de la altura de la pantalla:

#define HEIGHT_IPHONE_5 568
#define IS_IPHONE   ([[UIDevice currentDevice] userInterfaceIdiom] == UIUserInterfaceIdiomPhone)
#define IS_IPHONE_5 ([[UIScreen mainScreen] bounds ].size.height == HEIGHT_IPHONE_5)

En su controlador base:

- (void)viewDidLoad
{
    [super viewDidLoad];
    if (IS_IPHONE_5) {
        CGRect r = self.view.frame;
        r.size.height = HEIGHT_IPHONE_5 - 20;
        self.view.frame = r;
    }
    // now the view is stretched properly and not pushed to the bottom
    // it is pushed to the top instead...

    // other code goes here...
}

En un constants.harchivo puede agregar estas declaraciones de definición:

 #define IS_IPAD UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPad 
 #define IS_IPHONE UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPhone
 #define IS_WIDESCREEN (fabs((double)[[UIScreen mainScreen] bounds].size.height - (double)568) < DBL_EPSILON) 
 #define IS_IPHONE_5 (!IS_IPAD && IS_WIDESCREEN)

Para determinar si su aplicación puede admitir iPhone 5 Retina, use esto: (Esto podría ser más robusto para devolver el tipo de pantalla, 4S Retina, etc., pero como está escrito a continuación, solo regresa si el iPhone admite iOS5 Retina como Si o no)

En un archivo común ".h" agregue:

BOOL IS_IPHONE5_RETINA(void);

En un archivo común ".m" agregue:

BOOL IS_IPHONE5_RETINA(void) {
    BOOL isiPhone5Retina = NO;
    if(UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPhone) {
        if ([UIScreen mainScreen].scale == 2.0f) {
            CGSize result = [[UIScreen mainScreen] bounds].size;
            CGFloat scale = [UIScreen mainScreen].scale;
            result = CGSizeMake(result.width * scale, result.height * scale);

            if(result.height == 960){
                //NSLog(@"iPhone 4, 4s Retina Resolution");
            }
            if(result.height == 1136){
                //NSLog(@"iPhone 5 Resolution");
                isiPhone5Retina = YES;
            }
        } else {
            //NSLog(@"iPhone Standard Resolution");
        }
    }
    return isiPhone5Retina;
}

En primer lugar, cree dos xibs y adjunte todos los delegados, clase principal a la xiby luego puede poner en esta condición mencionada a continuación en su appdelegate.marchivo en

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions 

    if ([[UIScreen mainScreen] bounds].size.height == 568)
        {

        self.ViewController = [[ViewController alloc] initWithNibName:@"ViewControlleriphone5" bundle:nil];
        }

        else
        {
             self.ViewController = [[ViewController alloc] initWithNibName:@"ViewControlleriphone4" bundle:nil];

        }

puedes usarlo en cualquier lugar del programa dependiendo de tus requisitos, incluso en tus ViewControllerclases. Lo que más importa es que haya creado dos xibarchivos separados paraiphone 4(320*480) and iphone 5(320*568)

Pruebe el siguiente método en una clase singleton:

-(NSString *)typeOfDevice
    {
        if(UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPhone)
        {
            CGSize result = [[UIScreen mainScreen] bounds].size;
            if(result.height == 480)
            {
                return @"Iphone";
            }
            if(result.height == 568)
            {
                return @"Iphone 5";
            }
        }
        else{
            return @"Ipad";;
        }


        return @"Iphone";
    }

Puede usar la Auto Layoutfunción y crear el diseño usando la resolución de pantalla del iPhone 5 y funcionará para los dispositivos de 4 "y 3.5", pero en este caso debe tener un conocimiento suficiente del administrador de diseño.

La comprobación boundscon 568fallará en modo horizontal. El iPhone 5 se inicia solo en modo vertical, pero si desea admitir rotaciones, entonces la "verificación" del iPhone 5 también deberá manejar este escenario.

Aquí hay una macro que maneja el estado de orientación:

#define IS_IPHONE_5 (CGSizeEqualToSize([[UIScreen mainScreen] preferredMode].size, CGSizeMake(640, 1136)))

El uso de la llamada 'Preferred Mode' es de otra publicación que leí hace unas horas, así que no se me ocurrió esta idea.

Primero muestra esta imagen. En esa imagen, muestra una advertencia para el soporte de Retina 4, así que haga clic en esta advertencia y haga clic en Agregar para que su pantalla de bienvenida Retina 4 agregue automáticamente su proyecto.

y después de usar este código:

if([[UIScreen mainScreen] bounds].size.height == 568)
    {
        // For iphone 5
    }
    else
    {
        // For iphone 4 or less
    }

Nunca me enfrenté a un problema con ningún dispositivo, ya que tenía una base de código para todos, sin ningún valor codificado. Lo que hago es tener la imagen de tamaño máximo como recurso en lugar de una para cada dispositivo. Por ejemplo, tendría uno para la pantalla de retina y lo mostraría como ajuste de aspecto para que sea visualizado como está en cada dispositivo. Llegando a decidir el marco del botón, por ejemplo, en tiempo de ejecución. Para esto utilizo el valor de% de la vista de patente, por ejemplo, si quiero que el ancho sea la mitad de la vista principal, tome el 50% de la vista principal y lo mismo se aplica para la altura y el centro.

Con esto ni siquiera necesito los xibs.

Puede usar esta definición para calcular si está usando el iPhone 5 según el tamaño de la pantalla:

#define IS_IPHONE_5 ( fabs( ( double )[ [ UIScreen mainScreen ] bounds ].size.height - ( double )568 ) < DBL_EPSILON )

luego use una ifdeclaración simple :

    if (IS_IPHONE_5) {

    // What ever changes
    }

Peter, deberías echar un vistazo a Canappi, hace todo eso por ti, todo lo que tienes que hacer es especificar el diseño como tal:

button mySubmitButton 'Sumbit' (100,100,100,30 + 0,88,0,0) { ... }

A partir de ahí, Canappi generará el código objetivo-c correcto que detecta el dispositivo en el que se ejecuta la aplicación y usará:

(100,100,100,30) for iPhone4
(100,**188**,100,30) for iPhone 5

Canappi funciona como Interface Builder y Story Board combinados, excepto que está en forma de texto. Si ya tiene archivos XIB, puede convertirlos para no tener que volver a crear toda la interfaz de usuario desde cero.

Puede verificar manualmente el tamaño de la pantalla para determinar en qué dispositivo está:

#define DEVICE_IS_IPHONE5 ([[UIScreen mainScreen] bounds].size.height == 568)

float height = DEVICE_IS_IPHONE5?568:480;
if (height == 568) {
    // 4"

} else {

    // 3"

}

Puedes agregar este código:

if(UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPhone){
        if ([[UIScreen mainScreen] respondsToSelector: @selector(scale)]) {
            CGSize result = [[UIScreen mainScreen] bounds].size;
            CGFloat scale = [UIScreen mainScreen].scale;
            result = CGSizeMake(result.width * scale, result.height * scale);

            if(result.height == 960) {
                NSLog(@"iPhone 4 Resolution");
            }
            if(result.height == 1136) {
              NSLog(@"iPhone 5 Resolution");
            }
        }
        else{
            NSLog(@"Standard Resolution");
        }
    }

Este es un código universal real, puede crear 3 guiones gráficos diferentes:

Configure el modo Universal de su proyecto, y configure su iPhone de historia principal con el storyboard iPhone5 y el ipad main con el storyboard objetivo de iPad, ahora agregue un nuevo objetivo de storyboard para iphone y modifique la resolución para iphone 4s o menos ahora implemente su AppDelegate.m

iPhone4 / 4s (es lo mismo para 3 / 3Gs) uno para iPhone5 y hace que el proyecto sea universal , con un nuevo objetivo de Storyboard para iPad, ahora en AppDelegate.m con el didFinishLaunchingsiguiente código:

    if(UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPhone){
        UIStoryboard *storyBoard;

        CGSize result = [[UIScreen mainScreen] bounds].size;
        CGFloat scale = [UIScreen mainScreen].scale;
        result = CGSizeMake(result.width *scale, result.height *scale);

//----------------HERE WE SETUP FOR IPHONE4/4s/iPod----------------------

        if(result.height == 960){
            storyBoard = [UIStoryboard storyboardWithName:@"iPhone4_Storyboard" bundle:nil];
            UIViewController *initViewController = [storyBoard instantiateInitialViewController];
            [self.window setRootViewController:initViewController];
        }

//----------------HERE WE SETUP FOR IPHONE3/3s/iPod----------------------

        if(result.height == 480){
            storyBoard = [UIStoryboard storyboardWithName:@"iPhone4_Storyboard" bundle:nil];
            UIViewController *initViewController = [storyBoard instantiateInitialViewController];
            [self.window setRootViewController:initViewController];
        }
    }

        return YES;
 }

Entonces, ha creado una aplicación universal para iPhone 3 / 3Gs / 4 / 4s / 5 All gen de iPod y todo tipo de iPad

Recuerde integrar todos los IMG con myImage.pngy[email protected]

Según yo, la mejor manera de lidiar con tales problemas y evitar un par de condiciones requeridas para verificar la altura del dispositivo, es usar el marco relativo para las vistas o cualquier elemento de UI que esté agregando a su vista, por ejemplo: si está agregando algún elemento de la interfaz de usuario que desee debe estar en la parte inferior de la vista o justo encima de la barra de pestañas, luego debe tomar el origen y con respecto a la altura de su vista o con respecto a la barra de pestañas (si está presente) y también tenemos la propiedad de cambio de tamaño automático. Espero que esto funcione para tí

En lugar de usar un conjunto de condicionales, puede cambiar el tamaño de su vista automáticamente usando el tamaño de la pantalla.

int h = [[UIScreen mainScreen] bounds].size.height;
int w = [[UIScreen mainScreen] bounds].size.width;
self.imageView.frame = CGRectMake(20, 80, (h-200), (w-100));

En mi caso, quiero una vista que llene el espacio entre algunos campos de entrada en la parte superior y algunos botones en la parte inferior, por lo que se fijó la esquina superior izquierda y la variable inferior derecha según el tamaño de la pantalla. Mi aplicación llena la vista de imagen con la foto tomada por la cámara, así que quiero todo el espacio que pueda obtener.

Si necesita convertir una aplicación ya existente a universal, debe seleccionar el archivo xib correspondiente-> mostrar Utilidades-> Mostrar inspector de tamaño.

En el inspector de tamaño puede ver el tamaño automático, al usar esta herramienta puede convertir a la aplicación iOS existente.

Con xCode 5, seleccione "Migrar a Catálogo de activos" en Proyecto> General.

Luego use "Mostrar en el buscador" para encontrar su imagen de inicio, puede editarla ficticiamente para que sea 640x1136, luego arrástrela al catálogo de activos como se muestra en la imagen a continuación.

Asegúrese de que la sección R7 de iOS7 y iOS6 tenga una imagen de 640x1136. La próxima vez que inicie la aplicación, las barras negras desaparecerán y su aplicación usará una pantalla de 4 pulgadas

Vale la pena notarlo: en el nuevo Xcode, debe agregar este archivo de imagen [email protected] a los activos

Utilizar el Auto Layout función para vistas. Se ajustará automáticamente a todas las resoluciones.

Cree dos xib para un controlador que tenga un nombre de controlador con sufijo ya sea ~ iphone o ~ ipad. En el momento de la compilación, Xcode tomará la xib correcta según el dispositivo.

Utilice clases de tamaño, si desea crear un solo xib para iPhone y iPad, si la vista es lo suficientemente simple como para transferir a iPhone y iPad.

Hay un pequeño problema al probar tanto en dispositivos iOS como en iOS Simulator. Parece que el simulador (XCode 6.0.1) proporciona valores conmutados para ancho y alto en[[UIScreen mainScreen] bounds].size según la orientación del dispositivo.

Por lo tanto, esto podría ser un problema al determinar el tamaño de pantalla físico correcto. Este código también ayuda a distinguir todo el 2014. Generaciones de modelos de iPhone:

• iphone 4s
• iPhone5 (y iPhone5s)
• iPhone6 ​​(y iPhone6 ​​+)

También se puede cambiar fácilmente para distinguir, por ejemplo, iPhone6 ​​de iPhone6 ​​+.

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {

    CGSize iOSDeviceScreenSize = [[UIScreen mainScreen] bounds].size;

    if ([UIDevice currentDevice].userInterfaceIdiom == UIUserInterfaceIdiomPhone)
    {
        if (iOSDeviceScreenSize.width > 568 || // for iOS devices
            iOSDeviceScreenSize.height > 568) // for iOS simulator
        {   // iPhone 6 and iPhone 6+

            // Instantiate a new storyboard object using the storyboard file named Storyboard_iPhone6
            storyboard = [UIStoryboard storyboardWithName:@"MainStoryboard_iPhone6" bundle:nil];

            NSLog(@"loaded iPhone6 Storyboard");
        }
        else if (iOSDeviceScreenSize.width == 568 || // for iOS devices
                 iOSDeviceScreenSize.height == 568) // for iOS simulator
        {   // iPhone 5 and iPod Touch 5th generation: 4 inch screen (diagonally measured)

            // Instantiate a new storyboard object using the storyboard file named Storyboard_iPhone5
            storyboard = [UIStoryboard storyboardWithName:@"MainStoryboard_iPhone5" bundle:nil];

            NSLog(@"loaded iPhone5 Storyboard");
        }
        else
        {   // iPhone 3GS, 4, and 4S and iPod Touch 3rd and 4th generation: 3.5 inch screen (diagonally measured)

                // Instantiate a new storyboard object using the storyboard file named Storyboard_iPhone4
            storyboard = [UIStoryboard story    boardWithName:@"MainStoryboard_iPhone" bundle:nil];

                NSLog(@"loaded iPhone4 Storyboard");
        }
    }
    else if ([UIDevice currentDevice].userInterfaceIdiom == UIUserInterfaceIdiomPad)
    {   // The iOS device = iPad

        storyboard = [UIStoryboard storyboardWithName:@"MainStoryboard_iPadnew" bundle:nil];

        NSLog(@"loaded iPad Storyboard");
    }

    // rest my code
}

Sugeriría usar Autoresizing Mask en sus aplicaciones de acuerdo con su interfaz de UI, ahorra muchos problemas y es mejor que hacer diferentes UI para pantallas de iPhone 4 y 5.