Comment configurer différentes contraintes de disposition automatique pour différentes tailles d'écran

Question

J'ai une tableView avec des cellules statiques. La cellule contient une ImageView qui la remplit complètement. Et j'ai un autre ImageViews plus petit au sommet. Je positionne cette ImageViews avec des contraintes. J'ai une question sur le redimensionnement des contraintes. Comment puis-je définir différentes constantes de contrainte pour différentes tailles de périphériques sans programmer les boucles if/else. Existe-t-il un moyen de le placer dans le storyboard? J'ai une contrainte majeure pour la disposition parent par exemple avec une valeur constante de 10. C'est correct pour l'écran de l'iPhone 5, mais sur un écran iPhone 6/6 plus, il devrait être supérieur à 10.

Mise en page automatique iPhone5

Mise en page automatique iPhone6

Answer 1

Sans écrire une seule ligne de code!

Une fois que mon développeur junior m'a posé la même question: comment puis-je faire la différence entre iPhoneSE et iPhone6 ​​pour une contrainte à ce moment-là, il n'y avait qu'une seule solution qui écrivait quelque chose comme

if device == iPhoneSE { 
   constant = 44 
} else if device == iPhone6 {
   constant = 52
}

Pour surmonter ce problème, j'ai créé une bibliothèque Layout Helper alors vous pouvez maintenant mettre à jour la contrainte pour chaque périphérique sans écrire une seule ligne de code.

Étape 1

Affectez NSLayoutHelper à votre contrainte

Étape 2

Mettre à jour la contrainte de l'appareil souhaité

Étape 3

Exécutez l'application et voyez la MAGIE

Answer 2

Très facile. Vous pouvez modifier les valeurs des constantes pour les classes de taille de différence dans Storyboard. Je vous donne quelques étapes après lesquelles vous pourrez le saisir.

Nous créons d'abord des constantes comme vous pouvez le voir sur cette vue

Ensuite, nous sélectionnons la constante dont nous voulons changer la valeur dans d'autres classes de taille.

Vient maintenant la partie délicate. Dans l'inspecteur d'attributs après avoir sélectionné la constante, vous pouvez voir la valeur de la constante. Juste à côté, vous pouvez voir le signe PLUS (+) , à gauche de la "constante".

Cliquez dessus et sélectionnez la classe de taille que vous souhaitez. Ici, j'ai sélectionné la hauteur régulière largeur régulière, c'est-à-dire pour les tailles iPad.

Ensuite, nous lui donnons une nouvelle valeur. Ainsi, la constante, qui a normalement une valeur de 61, fonctionnera comme 10 lorsqu'elle est rendue dans une classe de taille de classes de taille iPad.

Voici la sortie - iPhone 4 -

ipad air -

Comme vous pouvez le voir, les mêmes constantes ont une valeur différente lors de l'exécution correspondant à différentes classes de taille.

J'espère que mon explication vous a aidé.

Answer 3

Enfin, j'ai trouvé la solution qui fonctionne dans mon cas.

1. J'ai mis la vue transparente et ajouté Align Center X/Y à Superview (image d'arrière-plan) avec le décalage nécessaire de la manière qui convient à mon cadre pour les affiches (sur l'image d'arrière-plan) - Contraintes pour la vue transparente =
2. Ensuite, j'attache une largeur/hauteur égale à ma vue d'ensemble (image d'arrière-plan) pour cette vue transparente et je change le multiplicateur en largeur égale (j'ai choisi manuellement 0,61)
3. Après cela, j'ai atterri mon 1 affiche. J'ai également centré verticalement et horizontalement avec décalage et utilisé cet ensemble de contraintes - largeur proportionnelle à Superview, rapport d'aspect.
4. Et le dernier, j'ai disposé ma deuxième affiche avec ces contraintes - Espace leader sur Poster1, Aligner CenterY sur Poster1 (avec le décalage dans mon cas) et Largeur/hauteur égale. Contraintes pour l'affiche 1/2

En conséquence, j'ai une mise en page automatique vraiment adaptative qui fonctionne presque très bien sur les iPhones 5-6-6 +