web-dev-qa-db-fra.com

Applications iOS 6: comment gérer la taille d'écran de l'iPhone 5?

Duplicate possible:
Comment développer ou migrer des applications pour la résolution d'écran de l'iPhone 5?

Je me demandais simplement comment nous devrions traiter l'iPhone 5 avec une plus grande taille d'écran.

Comme il a plus de pixels en hauteur, des choses comme GCRectMake qui utilisent des coordonnées (et doublent simplement les pixels avec le problème rétine/non rétine) ne fonctionneront pas de manière transparente entre les versions, comme ce fut le cas lorsque nous avons obtenu le Retina =.

Et devrons-nous concevoir deux story-boards, comme pour l'iPad?

Personnellement, je ne pense pas que Apple vous oblige à vérifier la taille de l'écran chaque fois que vous dessinez quelque chose, comme le disent de nombreuses réponses. Est-ce que cela arrive avec l'iPad?

iphoneiosiphone-5
264
jturolla

Toutes les applications continueront à fonctionner sur l'écran étiré verticalement, comme je pouvais le dire dans la présentation d'aujourd'hui. Ils seront en boîte aux lettres ou, en gros, les 88 points supplémentaires en hauteur seraient tout simplement noirs.

Si vous envisagez uniquement de prendre en charge iOS 6+, envisagez définitivement d'utiliser la mise en page automatique. Il supprime toute manipulation de mise en page fixe et utilise plutôt des contraintes pour mettre les choses en place. Rien ne sera codé en dur et votre vie deviendra beaucoup plus simple.

Toutefois, si vous devez prendre en charge les anciens iOS, cela dépend vraiment de votre application. Une majorité des applications qui utilisent une barre de navigation standard et/ou une barre d'onglets pourraient simplement développer le contenu au milieu pour utiliser ces points supplémentaires. Définissez le masque de redimensionnement automatique du contenu central pour qu'il se développe dans les deux sens.

view.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;

Cela fonctionne très bien pour les affichages sous forme de tableaux. Toutefois, si votre application utilise une présentation parfaite pour l'affichage du contenu, votre meilleur choix serait alors de ré-imaginer le contenu afin qu'il puisse s'adapter à des hauteurs variables.

Si ce n'est pas une possibilité, la seule option restante consiste à avoir deux interfaces utilisateur (pré-iPhone 5 et iPhone 5).

Si cela vous semble moche, vous pouvez utiliser le modèle par défaut de type boîte aux lettres où les points/pixels supplémentaires apparaissent en noir.

Éditer

Pour que vos applications fonctionnent avec l'iPhone 5, vous devez ajouter une version Retina de l'image du lanceur. Il devrait s'appeler [email protected]. Et il faut que ce soit de la qualité de la rétine - il n’ya pas de compatibilité ascendante ici :)

Vous pouvez également sélectionner cette image dans Xcode. Accédez à la cible et sous la section Résumé, recherchez Images de lancement. L'image doit avoir une taille de 640x1136 pixels. Voici une capture d'écran de l'endroit où le trouver, si cela vous aide.

Xcode screenshot

209
Anurag

Vous devez ajouter une image 640x1136 pixels PNG ([email protected]) en tant qu'image splash par défaut de votre projet de 4 pouces. Des espaces supplémentaires seront alors utilisés (sans efforts pour les applications basées sur des tableaux simples). , les jeux nécessiteront plus d’efforts).

J'ai créé une petite catégorie UIDevice afin de gérer toutes les résolutions d'écran. Vous pouvez l'obtenir ici , mais le code est le suivant:

Fichier UIDevice + Resolutions.h :

enum {
    UIDeviceResolution_Unknown           = 0,
    UIDeviceResolution_iPhoneStandard    = 1,    // iPhone 1,3,3GS Standard Display  (320x480px)
    UIDeviceResolution_iPhoneRetina4    = 2,    // iPhone 4,4S Retina Display 3.5"  (640x960px)
    UIDeviceResolution_iPhoneRetina5     = 3,    // iPhone 5 Retina Display 4"       (640x1136px)
    UIDeviceResolution_iPadStandard      = 4,    // iPad 1,2,mini Standard Display   (1024x768px)
    UIDeviceResolution_iPadRetina        = 5     // iPad 3 Retina Display            (2048x1536px)
}; typedef NSUInteger UIDeviceResolution;

@interface UIDevice (Resolutions)

- (UIDeviceResolution)resolution;

NSString *NSStringFromResolution(UIDeviceResolution resolution);

@end

Fichier UIDevice + Resolutions.m :

#import "UIDevice+Resolutions.h"

@implementation UIDevice (Resolutions)

- (UIDeviceResolution)resolution
{
    UIDeviceResolution resolution = UIDeviceResolution_Unknown;
    UIScreen *mainScreen = [UIScreen mainScreen];
    CGFloat scale = ([mainScreen respondsToSelector:@selector(scale)] ? mainScreen.scale : 1.0f);
    CGFloat pixelHeight = (CGRectGetHeight(mainScreen.bounds) * scale);

    if (UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPhone){
        if (scale == 2.0f) {
            if (pixelHeight == 960.0f)
                resolution = UIDeviceResolution_iPhoneRetina4;
            else if (pixelHeight == 1136.0f)
                resolution = UIDeviceResolution_iPhoneRetina5;

        } else if (scale == 1.0f && pixelHeight == 480.0f)
            resolution = UIDeviceResolution_iPhoneStandard;

    } else {
        if (scale == 2.0f && pixelHeight == 2048.0f) {
            resolution = UIDeviceResolution_iPadRetina;

        } else if (scale == 1.0f && pixelHeight == 1024.0f) {
            resolution = UIDeviceResolution_iPadStandard;
        }
    }

    return resolution;
 }

 @end

Voici comment utiliser ce code.

1) Ajoutez les fichiers UIDevice + Resolutions.h et UIDevice + Resolutions.m ci-dessus à votre projet.

2) Ajoutez la ligne #import "UIDevice + Resolutions.h" à votre ViewController.m

3) Ajoutez ce code pour vérifier les versions de l'appareil avec lesquelles vous traitez

int valueDevice = [[UIDevice currentDevice] resolution];

    NSLog(@"valueDevice: %d ...", valueDevice);

    if (valueDevice == 0)
    {
        //unknow device - you got me!
    }
    else if (valueDevice == 1)
    {
        //standard iphone 3GS and lower
    }
    else if (valueDevice == 2)
    {
        //iphone 4 & 4S
    }
    else if (valueDevice == 3)
    {
        //iphone 5
    }
    else if (valueDevice == 4)
    {
        //ipad 2
    }
    else if (valueDevice == 5)
    {
        //ipad 3 - retina display
    }
84
danielemm

Je viens de terminer la mise à jour et l'envoi d'une version iOS 6.0 de l'une de mes applications au magasin. Cette version est rétro-compatible avec iOS 5.0. J'ai donc conservé la méthode shouldAutorotateToInterfaceOrientation: et ajouté les nouvelles comme indiqué ci-dessous.

Je devais faire ce qui suit:

L'autorotation change dans iOS 6. Sous iOS 6, la méthode shouldAutorotateToInterfaceOrientation: de UIViewController est obsolète. A sa place, vous devriez utiliser les méthodes supportedInterfaceOrientationsForWindow: et shouldAutorotate. Ainsi, j'ai ajouté ces nouvelles méthodes (et conservé l'ancien pour la compatibilité iOS 5):

- (BOOL)shouldAutorotate {
    return YES;
}

- (NSUInteger)supportedInterfaceOrientations {
    return UIInterfaceOrientationMaskAllButUpsideDown;    
}
  • Utilisez la méthode viewWillLayoutSubviews du contrôleur de vue et ajustez la présentation à l’aide du rectangle des limites de la vue.
  • Contrôleurs de vue modale: Le willRotateToInterfaceOrientation:duration:,
    willAnimateRotationToInterfaceOrientation:duration:, et
    didRotateFromInterfaceOrientation: les méthodes ne sont plus appelées sur aucun contrôleur de vue qui fait une présentation en plein écran sur
    lui-même     - par exemple, presentViewController:animated:completion:.
  • Ensuite, j'ai corrigé l'autolayout pour les vues qui en avaient besoin.
  • Images copiées du simulateur pour la vue de démarrage et les vues pour le magasin iTunes dans Photoshop, puis exportées sous forme de fichiers png.
  • Le nom de l'image par défaut est: [email protected] et sa taille est 640 × 1136. Il est également permis de fournir 640 × 1096 pour le même mode portrait (barre d'état supprimée). Des tailles similaires peuvent également être fournies en mode paysage si votre application ne permet que l'orientation paysage sur iPhone.
  • J'ai abandonné la compatibilité ascendante pour iOS 4. La raison principale en est que la prise en charge du code armv6 a été supprimée. Ainsi, tous les appareils que je suis en mesure de prendre en charge maintenant (exécutant armv7]) peuvent être mis à niveau vers iOS 5.
  • Je suis également une génération de code armv7s pour prendre en charge l'iPhone 5 et ne peux donc utiliser aucun framework tiers (comme Admob, etc.) tant qu'ils ne sont pas mis à jour.

C’était tout sauf penser à tester l’autorotation dans iOS 5 et iOS 6 à cause des changements de rotation.

56
Hannes Sverrisson

Non.

if ([[UIScreen mainScreen] bounds].size.height > 960)

sur l'iPhone 5 est faux

if ([[UIScreen mainScreen] bounds].size.height == 568)
26
user1406691
@interface UIDevice (Screen)
typedef enum
{
    iPhone          = 1 << 1,
    iPhoneRetina    = 1 << 2,
    iPhone5         = 1 << 3,
    iPad            = 1 << 4,
    iPadRetina      = 1 << 5

} DeviceType;

+ (DeviceType)deviceType;
@end

.m

#import "UIDevice+Screen.h"
@implementation UIDevice (Screen)

+ (DeviceType)deviceType
{
    DeviceType thisDevice = 0;
    if ([[UIDevice currentDevice] userInterfaceIdiom] == UIUserInterfaceIdiomPhone)
    {
        thisDevice |= iPhone;
        if ([[UIScreen mainScreen] respondsToSelector: @selector(scale)])
        {
            thisDevice |= iPhoneRetina;
            if ([[UIScreen mainScreen] bounds].size.height == 568)
                thisDevice |= iPhone5;
        }
    }
    else
    {
        thisDevice |= iPad;
        if ([[UIScreen mainScreen] respondsToSelector: @selector(scale)])
            thisDevice |= iPadRetina;
    }
    return thisDevice;
}

@end

De cette façon, si vous voulez savoir s'il s'agit simplement d'un iPhone ou d'un iPad (quelle que soit la taille de l'écran), utilisez simplement:

if ([UIDevice deviceType] & iPhone)

ou

if ([UIDevice deviceType] & iPad)

Si vous voulez détecter uniquement l'iPhone 5, vous pouvez utiliser

if ([UIDevice deviceType] & iPhone5)

Contrairement à Malcom, vous devez indiquer où vous devez vérifier si c'est un iPhone,

if ([UIDevice currentResolution] == UIDevice_iPhoneHiRes || 
    [UIDevice currentResolution] == UIDevice_iPhoneStandardRes || 
    [UIDevice currentResolution] == UIDevice_iPhoneTallerHiRes)`

Aucune de ces manières n’a un avantage majeur l’une sur l’autre, c’est juste une préférence personnelle.

17
endy

Le commentaire de @ Pascal sur la question du PO est juste. En ajoutant simplement l'image, cela supprime les bordures noires et l'application utilisera toute la hauteur.

Vous devrez ajuster tous les CGRects en déterminant que le périphérique utilise le plus grand écran. C'est à dire. Si vous avez besoin de quelque chose d’aligné au bas de l’écran.

Je suis sûr qu’il existe une méthode intégrée, mais comme je n’ai rien vu et que beaucoup de choses sont encore sous NDA, la méthode que nous utilisons dans nos applications est tout simplement une fonction globale. Ajoutez ce qui suit dans votre fichier .pch, puis c’est un simple appel if( is4InchRetina() ) { ... } pour apporter des modifications à vos CGRects, etc.

static BOOL is4InchRetina()
{
    if (![UIApplication sharedApplication].statusBarHidden && (int)[[UIScreen mainScreen] applicationFrame].size.height == 548 || [UIApplication sharedApplication].statusBarHidden && (int)[[UIScreen mainScreen] applicationFrame].size.height == 568)
        return YES;

    return NO;
}
5
Byron Rode

Je pense que vous pouvez utiliser [UIScreen mainScreen].bounds.size.height et calculer le pas pour vos objets. Lorsque vous calculez pas à pas, vous pouvez définir les coordonnées de deux résolutions.

Ou vous pouvez obtenir la hauteur comme ci-dessus et if(iphone5) then... else if(iphone4) then... else if(ipad). Quelque chose comme ça.

Si vous utilisez des storyboards, vous devez créer un nouvel iPhone, je pense.

3
Tomasz Szulc

Comme il a plus de pixels en hauteur, des choses comme GCRectMake qui utilisent des coordonnées ne fonctionneront pas de manière transparente entre les versions, comme ce fut le cas lorsque nous avons eu la rétine.

Eh bien, ils fonctionnent de la même manière avec les écrans Retina - c’est juste que 1 unité dans le système de coordonnées CoreGraphics correspond à 2 pixels physiques, mais vous n’avez pas/n’avez pas pour faire quoi que ce soit, la logique est restée la même. (Avez-vous réellement essayé de lancer une de vos applications autres que de la rétine sur un iPhone rétine, )? )

Pour la question proprement dite: c'est pourquoi vous ne devriez pas utiliser CGRectMakes et co explicites ... C'est pourquoi vous avez des choses comme [[UIScreen mainScreen] applicationFrame].

3
user529758