Xcode 6 Storyboard de la mauvaise taille?

139

Construit un nouveau projet à partir de zéro dans Swift dans Xcode 6 (Bêta 1) et j'ai vu un comportement étrange avec les Storyboards et la sortie que je vis.

J'ai construit une interface simple (comme indiqué ci-dessous) - avec les propriétés de View Controller incluses. Lorsque je l'exécute dans le simulateur, je m'attendrais à ce que `` Hello, World '' soit au centre de l'interface utilisateur - cependant, il semble que ce `` Square '' est simplement en train d'être adapté à l'écran de l'iPhone et que la mauvaise vue est donc affichée (voir ci-dessous ).

Ma question est la suivante: est-ce que quelqu'un d'autre a vu ce comportement et comment l'ont-ils corrigé?

Merci!

Vue depuis l'éditeur de storyboard

Inspecteur d'attributs

Inspecteur de taille

Sortie du simulateur

Barbe à papa
la source
ajouter des contraintes de mise en page automatique, qui devraient le corriger vous concevez actuellement toutes les mises en page, les mises en page automatiques vous aideront donc à afficher le contenu au «bon» endroit.
Raz
8
Conseils: En utilisant l'éditeur d'assistant> automatique> Aperçu, vous pourrez voir un aperçu de l'écran avec toutes les tailles d'écran
Francescu

Réponses:

81

Bien que la réponse d'Asif Bilal soit une solution plus simple qui n'implique pas de classes de taille (qui ont été introduites dans iOS 8.), il est fortement recommandé de vous habituer aux classes de taille car elles sont l'avenir, et vous finirez par sauter de toute façon à certains point."


Vous n'avez probablement pas ajouté les contraintes de mise en page.

Sélectionnez votre étiquette, appuyez sur le bouton des contraintes de mise en page en bas:

entrez la description de l'image ici

Dans ce menu, ajoutez la largeur et la hauteur (elle ne devrait PAS être la même que la mienne) en cochant leur case et cliquez sur ajouter des contraintes. Ensuite, faites glisser votre étiquette vers la vue principale tout en maintenant la touche Contrôle enfoncée, puis lorsque vous dé-cliquez, vous devriez avoir les options pour centrer horizontalement et verticalement dans le conteneur. Ajoutez les deux et vous devriez être configuré.

Can Poyrazoğlu
la source
1
Excellent - cela a très bien fonctionné pour moi - Merci pour votre aide (acceptera votre réponse lorsque la minuterie sera levée)
Candyfloss
1
Je vous en prie. Il s'agit du comportement par défaut avec la mise en page automatique, qui est désormais activée par défaut. N'oubliez pas qu'en raison des différentes tailles / dispositions d'écran possibles, il devrait y avoir un moyen de calculer où une vue sera positionnée par rapport à son parent, et la mise en page automatique résout ce problème. lorsque vous n'ajoutez pas ces contraintes, view les crée automatiquement lors de l'exécution, mais par rapport au coin supérieur gauche. Si vous avez besoin d'autre chose (vous avez presque toujours besoin d'autre chose), vous devez spécifier les contraintes explicitement.
Can Poyrazoğlu
4
Notez que le contrôle-glisser (qui peut être gênant) n'est pas nécessaire. Le bouton à gauche de celui sélectionné dans cette image ouvre un menu qui vous permet d'épingler les centres horizontaux et verticaux.
jrturton
Vous avez raison ... Je suis juste habitué à contrôler-faire glisser c'est pourquoi je l'ai dit de cette façon.
Can Poyrazoğlu
@ CanPoyrazoğlu - Vous mentionnez «Sélectionnez votre étiquette». Quelle étiquette? J'ai le même problème avec un nouveau projet iPhone dans lequel je n'ai pas d'étiquettes ou d'autres éléments d'interface utilisateur. Mon premier projet en Xcode 6, en utilisant Objective C.
rattletrap99
253

Suivez les étapes suivantes pour résoudre le problème

Dans Storyboard, sélectionnez n'importe quelle vue, puis accédez à l'inspecteur de fichiers. Décochez la case "Utiliser les classes de taille", vous demanderez de conserver les données de classe de taille pour: iPhone / iPad. Et puis cliquez sur le bouton "Désactiver les classes de taille". Cela rendra la taille de la vue du storyboard avec l'appareil sélectionné.

Asif Bilal
la source
8
C'est la bonne réponse si vous obtenez un contrôleur de vue 600x600 alors que vous vouliez un contrôleur de vue de taille iPhone standard, par exemple.
Fraggle
5
Cela devrait être la bonne réponse (au moins pour ceux qui ne fonctionnent que sur une plate-forme non universelle)
Raptor
36
Je ne sais pas pourquoi les gens ont indiqué que c'était la bonne réponse ... la première est la façon dont cela devrait être fait ... Si vous n'aimez pas les contraintes de mise en page, vous allez dans la direction inverse ... Apple utilise un bon moyen de développer pour toutes les tailles d'iPhone et d'iPad et vous souhaitez simplement revenir aux anciens? Parce que vous ne pouvez pas vous permettre de vous mettre à jour? Jamais voté à la baisse, mais il semble que cette réponse déroute les gens et fait ensuite utiliser l'ancienne approche (qui sera obsolète) au lieu d'encourager ensuite d'utiliser les nouveaux trucs ...
Raphael Ayres
3
Meilleure réponse pour tous ceux qui sont habitués aux storyboards iPhone / iPad
mamarx
3
Utilisez les contraintes de mise en page ... Apple fait cela de la même manière qu'Android fonctionne. La vue n'a pas de forme ... Parfois, cela peut être pénible, mais si vous forcez la taille, votre application sera mauvaise sur différentes tailles d'appareils. Si vous voulez qu'un bouton apparaisse dans le coin inférieur droit, créez simplement 2 contraintes pour celui-ci, et interdisez ... pas de sélection X ou Y. Tout sera réglé par le moteur. Utilisez des tailles intrinsèques. Utilise ton imagination. Utilisez des contraintes relationnelles. Apprenez cette merde.
Raphael Ayres
18

Si vous utilisez Xcode 6 et que vous concevez pour iOS 8, aucune de ces solutions n'est correcte. Pour que les vues de votre iPhone uniquement soient dimensionnées correctement, ne désactivez pas les classes de taille, ne désactivez pas les métriques déduites et ne définissez pas (encore) de contraintes. À la place, utilisez le contrôle de classe de taille, qui est un bouton de texte facile à manquer en bas d'Interface Builder qui lit initialement "wAny hAny".

Cliquez sur le bouton et choisissez Largeur compacte, Hauteur normale. Cela redimensionne vos vues et couvre toutes les orientations de portrait de l'iPhone. La documentation Apple ici: https://developer.apple.com/library/ios/recipes/xcode_help-IB_adaptive_sizes/chapters/SelectingASizeClass.html ou recherchez sur "Sélection d'une classe de taille dans Interface Builder"

Eli Burke
la source
Je pense qu'il est utile de lire toute l' aide sur la conception des classes de taille dans votre lien, c'est-à-dire de À propos de la conception pour plusieurs classes de taille au déploiement d'une application avec des classes de taille sur les versions iOS antérieures .
Franklin Yu
C'est une excellente solution si vous souhaitez conserver la mise en page automatique mais que les vues du storyboard apparaissent sous forme de paysage ou de portrait au lieu d'un carré.
stephenspann
5

Dans Storyboard, sélectionnez votre ViewController et accédez à Atribute Inspector. Tout en haut, sous Mesures simulées, vous avez des propriétés de taille et d'orientation qui sont définies sur Inféré. Modifiez-les aux valeurs souhaitées.

Pour qu'une application s'affiche correctement sur une autre taille d'écran, vous devez également configurer des contraintes, comme décrit par Can Poyrazoğlu dans le premier article.

David Andrews
la source
5

J'ai eu ce problème dans xcode 6 et il existe un moyen de résoudre les conflits de redimensionnement. Si vous sélectionnez votre vue, vous verrez en bas une icône qui ressemble à | -Δ- |. Si vous cliquez dessus, votre projet sera redimensionné pour différents appareils.

user2961953
la source
Oui et après avoir sélectionné le symbole triangulaire, cliquez sur ajouter les contraintes manquantes et la vue est terminée, la vue sera redimensionnée selon la taille de l'appareil si son application universelle
vishal dharankar
3

Accédez à l'inspecteur d'attributs (coin supérieur droit) dans les métriques simulées, qui ont les propriétés Taille, Orientation, Barre d'état, Barre supérieure, Barre inférieure. Pour SIZE, modifiez Inféré -> Forme libre.

Rachel
la source
+1 @Rachel merci pour ce petit conseil utile sur les métriques simulées -> Taille: "Freeform" (aka, apparemment, "activer une taille personnalisée pour un xib réutilisable soutenu par une vue personnalisée").
tous les
3

Sur votre page de storyboard, accédez à l'inspecteur de fichiers et décochez `` Utiliser les classes de taille ''. Cela devrait réduire votre contrôleur de vue à la taille normale de l'iPhone que vous connaissez. Notez que l'utilisation de «classes de taille» vous permettra de concevoir votre projet sur de nombreux appareils. Une fois que vous décochez cette case, le Xcode vous donnera une boîte de dialogue d'avertissement comme suit. Cela devrait être auto-explicatif.

"La désactivation des classes de taille limitera ce document au stockage des données pour une seule famille d'appareils. Les données de la classe de taille représentant le mieux l'appareil ciblé seront conservées et toutes les autres données seront supprimées. De plus, les segues seront converties en leur non -équivalents adaptatifs. "

Oh mon
la source
3

Pour toute personne utilisant XCode 7, il est très facile de concevoir pour une taille de périphérique spécifique (au lieu du canevas carré par défaut).

Dans Interface Builder, sélectionnez votre ViewController ou Scene dans le menu de gauche. Ensuite, sous Show the Attributes Inspector, accédez au Simulated Metrics, et choisissez le désiré Sizedans le menu déroulant.

Prêtre
la source
Cela vous permettra uniquement de concevoir votre storyboard pour cet appareil. Lorsque vous exécutez votre application, sa conception peut varier considérablement pour différentes tailles d'écran.
Joey Tawadrous
@JoeyTawadrous Exactement. Mais il répond à la question posée :)
Prêtre
2

Vous utiliserez probablement "Résoudre les problèmes de mise en page automatique" (icône du triangle en bas à droite dans la vue du storyboard) pour ajouter / réinitialiser les contraintes suggérées (Xcode 6.0.1).

swnn
la source