ios - pantalla - itunes

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

Question

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 panorámica?

Answer 1

1. Descarga e instala la última versión de Xcode .
2. Configure 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 de forma mágica si ha configurado correctamente las máscaras de cambio de tamaño o ha utilizado 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 tienes que hacer específicamente para las pantallas más grandes, entonces parece que tienes que verificar la altura de los [[UIScreen mainScreen] bounds] ya que no parece haber 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 se recomienda la forma de adaptar su interfaz de usuario.

Answer 2

A veces (para aplicaciones de pre-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 (consulte esta pregunta : deberá modificar el código para tratar con el iPhone 5) en viewController Inicial, ya que ninguna cantidad de twiddling con autorizing masks 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 están dirigidas a versiones anteriores de iOS.

Answer 3

Agregué la nueva imagen de lanzamiento predeterminada y (al revisar otras respuestas de SE ...) me aseguré de que mis guiones gráficos se auto-dimensionaran y subvistas, pero la retina de 4 pulgadas aún estaba en formato de buzón.

Luego me di cuenta de que mi lista de información tenía una línea de pedido para "Lanzar imagen" configurada en "Predeterminado.png", que por lo tanto eliminé y mágicamente ya no aparecía el buzón. Esperemos que eso le salve a otra persona la misma locura que soporté.

Answer 4

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

1. Cree una nueva imagen para su pantalla de inicio / 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 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());
    }
}

Answer 5

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ó en la esquina superior izquierda y la variable inferior derecha en función del 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.

Answer 6

En primer lugar, cree dos xibs y adjunte todos los delegados, la clase principal al xib y luego u puede poner en esta condición mencionada a continuación en su archivo appdelegate.m 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];

        }

Puede usarlo en cualquier lugar del programa, dependiendo de sus requisitos, incluso en sus clases de ViewController . Lo más importante es que ha creado dos archivos xib separados para el iphone 4(320*480) and iphone 5(320*568)

Answer 7

En un archivo constants.h puede agregar estas instrucciones 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)

Answer 8

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];
}

Answer 9

Este es un código universal real, puede crear 3 historias diferentes:

Configure su proyecto Modo universal y establezca su historia principal iPhone con el storyboard iPhone5 y el ipad main con iPad storyboard, agregue ahora 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 el mismo para 3 / 3Gs) uno para iPhone5 y universaliza el proyecto, con un nuevo objetivo de Storyboard para iPad, ahora en AppDelegate.m bajo didFinishLaunching agrega este 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;
 }

Así que 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.png y [email protected]

Answer 10

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

Entonces, esto podría ser un problema al determinar el tamaño de pantalla física correcto. Este código ayuda también a diferenciar todas las generaciones de modelos de iPhone 2014:

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

También se puede cambiar fácilmente para hacer la distinción entre, 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
}

Answer 11

La verificación de bounds con 568 fallará en modo horizontal. El iPhone 5 se inicia solo en modo vertical, pero si desea admitir las rotaciones, la "comprobación" del iPhone 5 también tendrá que 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 ''preferredMode'' es de otra publicación que leí hace unas horas, por lo que no se me ocurrió esta idea.

Answer 12

Lo único realmente necesario es agregar una imagen de lanzamiento llamada "[email protected]" a los recursos de la aplicación, y en el caso 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]]

Hay 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 obtener más información.

Answer 13

Nunca enfrenté un problema de este tipo con ningún dispositivo, ya que he tenido una base de código para todos, sin valores codificados. 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 visualización de la retina y lo mostraría como apropiado para que se vea como se ve en cada dispositivo. Llegando a decidir el marco del botón, por ejemplo, en tiempo de ejecución. Para esto uso el valor% de la vista de patente, por ejemplo, si quiero que el ancho sea la mitad de la vista principal, tome el 50% de la principal y lo mismo se aplica para la altura y el centro.

Con esto ni siquiera necesito los xibs.

Answer 14

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

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

BOOL IS_IPHONE5_RETINA(void);

En un archivo ".m" común 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;
}

Answer 15

Peter, deberías echarle 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) { ... }

Desde allí, Canappi generará el código objetivo-c correcto que detecta el dispositivo en el que se ejecuta la aplicación y utilizará:

(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 que no tenga que volver a crear la IU completa desde cero.

Answer 16

Primero muestra esta imagen. En esa imagen, se muestra una advertencia para el soporte de Retina 4, así que haga clic en esta advertencia y haga clic en Agregar para que la pantalla de bienvenida de Retina 4 se agregue automáticamente a 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
    }

Answer 17

Pruebe el siguiente método en una clase de 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";
    }

Answer 18

Puede usar esta definición para calcular si está utilizando 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 simple sentencia if :

    if (IS_IPHONE_5) {

    // What ever changes
    }

Answer 19

Puede usar la función Auto Layout y crear el diseño con 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.

Answer 20

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

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

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

} else {

    // 3"

}

Answer 21

Punto de aviso: en el nuevo Xcode debe agregar este archivo de imagen Predeterminado [email protected] a los activos

Answer 22

Según yo, la mejor manera de lidiar con estos problemas y evitar el par de condiciones requeridas para verificar la altura del dispositivo, es usar el marco relativo para las vistas o cualquier elemento de la interfaz de usuario 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, entonces 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 propiedades de cambio de tamaño automático. Espero que esto funcione para tí

Answer 23

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 la aplicación iOS existente.

Answer 24

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

En algún lugar en common.h puede hacer estas definiciones basadas en 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...
}

Answer 25

Usando xCode 5, seleccione "Migrar al Catálogo de Activos" en Proyecto> General.

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

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

Answer 26

Usted podría 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");
        }
    }

Answer 27

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

Cree dos xibs para un controlador que tenga un nombre de controlador con el 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 tanto para iPhone como para iPad, si la vista es lo suficientemente simple como para portarla a iPhone y iPad.

Answer 28

Yo sugeriría usar Autoresizing Mask en sus aplicaciones de acuerdo con su interfaz de interfaz de usuario, ya que ahorra muchos problemas y es mejor que crear una interfaz de usuario diferente para las pantallas de iPhone 4 y 5.

Answer 29

here resuelvo este problema. Solo agregue ~ 568h @ sufijo 2x a las imágenes y ~ 568h a xib''s. No necesita más verificaciones en tiempo de ejecución o cambios de código.

Answer 30

Si tiene una aplicación desarrollada para iPhone 4S o anterior, se ejecutará en formato buzón en el 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 de 1136x640 (HxW). Sí, tener la imagen predeterminada en el nuevo tamaño de pantalla es la clave para que tu aplicación tome toda la pantalla del nuevo iPhone 5 .

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

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

• Asegúrese de que sus Xibs / Vistas utilicen el diseño automático para redimensionarse ellos mismos.
• Utilice 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 reposicione programáticamente para el otro.

En el caso extremo (cuando ninguno de los anteriores es suficiente), diseñe los dos Xibs 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
    }
}