web-dev-qa-db-fra.com

Comment créer une vue basée sur des contraintes qui se redimensionne entre l'iPhone 5 et l'iPhone 4 comparable au fonctionnement Anchor?

Le type de ressorts et de jambes classiques, alias "Anchor and Align" ou "Masques de redimensionnement automatique" est le seul type de gestion de redimensionnement que je comprends. Cependant, dans XCode 4.6, la "mise en page automatique" utilisant les contraintes introduites dans iOS 6, est la valeur par défaut, et elle rend certaines choses simples plus difficiles, tout en rendant possible tout un monde de nouveaux arrangements, une fois que vous avez appris. (Pour être clair, certains utilisateurs peuvent se soucier uniquement d'obtenir une vue simple sans combattre les batailles de mise en page automatique, donc une solution de contournement a été suggérée très tôt par Matt, de désactiver la mise en page automatique, qui est reproduite ci-dessous)

iOS 6 Layout Constraints, le système Interface Builder de contraintes d'édition, je ne comprends pas.

enter image description here

Lorsque XCode Interface Builder crée automatiquement des contraintes (comme sur les bords de la vue), il semble se comporter d'une manière que je comprends.

Ce que je ne comprends pas, c'est pourquoi dans le .xib montré ici, et également disponible ici , pourquoi je ne peux pas obtenir les régions vertes et magenta pour maintenir une bordure constante (la zone blanche entre elles) cela ne devient ni plus épais ni plus mince, peu importe ce qui arrive à la taille de la vue.

Cela signifie que j'ai besoin que la zone verte ne soit pas redimensionnée verticalement et ne soit redimensionnée que horizontalement, mais elle insiste pour s'ancrer au bas du formulaire, et bien que recommencer à partir d'une nouvelle pointe vierge, restaurera le constructeur d'interface afin qu'elle remarque la contiguïté du les vues vertes et magenta à nouveau, une fois que le constructeur d'interface est devenu "stupide", il insiste pour définir uniquement le bord inférieur de la vue verte en termes de distance par rapport au bord inférieur de sa vue parent, et ne le fera pas (pour n'importe quelle quantité de violon) en utilisant autrement de simples opérations de glisser-déposer. J'ai également expérimenté les commandes de broche et je n'ai pas trouvé de commande de broche qui fonctionne.

Aucune quantité de combats avec les menus du générateur d'interface ou de glisser-déposer ne semble être suffisante pour lui permettre de lâcher l'une des contraintes. Je ne peux pas comprendre ce que je suis censé faire. Supprimer une contrainte? Comment? Pour autant que je sache, les contraintes ne peuvent pas être supprimées du tout, à partir du volet Objets IB ou de l'inspecteur Utilitaires -> Taille. Il y a une option de suppression mais elle est grisée dans le menu déroulant qui apparaît lorsque vous cliquez sur le bouton icône "engrenage" dans la zone de contraintes.

Idéalement, j'adorerais que la zone verte soit redimensionnée lorsque la vue s'élargit, mais pas lorsqu'elle devient plus grande ou plus courte. Je pensais que c'était évident dans tous les autres outils, mais dans XCode + Autolayout, ce n'est pas du tout redimensionné, ou redimensionner dans les quatre directions. Je ne peux pas supprimer ou supprimer les contraintes qui font des choses que je ne veux pas faire. Devez-vous avoir quatre contraintes sur chaque vue qui se trouve dans une autre vue?

(Mise à jour 1: vous ne pouvez supprimer aucune contrainte qui entraînerait une mise en page ambiguë ou non spécifiée.)

(Mise à jour 2: Parfois, si un volet uiview ne s'accroche pas à un frère, le supprimer et le réessayer lui permettra de s'aligner naturellement sur un frère, et la contrainte sera appliquée par rapport à un objet de vue frère au lieu d'un parent.)

(Mise à jour 3: Matt a supprimé sa solution de contournement, je l'ai reproduit ci-dessous.)

Solution de contournement pour les personnes qui ne voulaient pas Autolayout en premier lieu, et qui voulaient juste récupérer les anciens ressorts et jambes de force:

Étape 1: désactiver la mise en page automatique:

enter image description here

Étape 2: Sélectionnez les masques de redimensionnement correct:

enter image description here

22
Warren P

La clé pour modifier les contraintes dans le générateur d'interface est de ne jamais faire glisser et déposer quoi que ce soit une fois que vous l'avez ajouté à la vue. Déplacez et organisez les choses en modifiant les contraintes à la place. Utilisez le menu d'épinglage pour créer de nouvelles contraintes. Vous pouvez supprimer les contraintes indésirables une fois que vous en avez ajouté suffisamment de nouvelles pour remplacer sans ambiguïté les contraintes système ajoutées automatiquement.

Dans votre cas, j'ai créé les contraintes suivantes:

enter image description here

J'ai renommé vos vues "Vert" et "Magenta" pour rendre les choses plus claires dans le navigateur de documents. Ce que j'ai fait c'est:

  • Épinglez l'espacement vertical entre les vues
  • Épinglé chaque vue sur les côtés gauche et droit
  • Épinglé la vue de dessus à une hauteur et à une distance définies du haut de la vue d'ensemble
  • Épinglé le bas de la vue inférieure au bas de la vue d'ensemble.

Cela vous donne la disposition que vous voulez, je pense. J'ai écrit des détails atroces à ce sujet ici , si vous voulez en savoir plus.

12
jrturton

C'est la réponse si vous ne souhaitez pas désactiver le nouveau mode de disposition automatique iOS6.

Si le mode d'affichage pour la vue de niveau supérieur et toutes les vues de sous-niveau est Échelle à remplir, vous utilisez le mode d'ancrage "inférieur ou égal" dans ce cas, car vous ne pouvez pas supprimer cette contrainte. Les deux vues colorées ne sont pas stockées dans la plume comme ayant une taille (largeur, hauteur) ou une position (coin supérieur gauche), elles sont plutôt stockées avec des contraintes représentant leur disposition. La disposition "inférieur ou égal" au lieu de "égal" est accessible en cliquant sur le carré supérieur, puis quatre lignes de contraintes apparaissent, sélectionnez celle du bas qui va du bord inférieur du contrôle que vous avez sélectionné jusqu'au bas de la vue et changez le type de Égal à Inférieur à ou Égal.

enter image description here

Si le mode d'affichage n'est PAS Échelle à remplir, d'autres modifications de contrainte seraient nécessaires. Cette conception à multiples facettes est plus flexible que les anciens "ressorts et jambes de force" mais n'est pas aussi simple à apprendre.

Le mode le plus évident que vous pourriez utiliser est d'obtenir une contrainte entre deux objets. Pourquoi c'est si difficile (parfois je peux le faire et parfois je ne peux pas) Je ne sais toujours pas.

Voici un exemple où j'ai réussi à faire apparaître une contrainte entre deux objets au lieu de cet objet à sa vue parent, mais cette situation, si je pouvais toujours faire coopérer Interface Builder serait une manière beaucoup plus intuitive de créer une situation où le carré supérieur n'est pas ancré à toute la hauteur de la vue:

enter image description here

Si la vue de couleur supérieure a une ancre à la vue en dessous, cela signifie absolument que la contrainte inverse ne peut pas être contre la même vue, sinon une ambiguïté ou une situation de "raisonnement circulaire" existerait. Ainsi, nous pouvons avoir A dépendre de B, mais pas B dépendre simultanément de A. Donc dans ce cas, la contrainte est commutée pour dépendre de la hauteur ou de la largeur absolue de la vue. Dans ce cas particulier que j'ai trouvé, des essais et des erreurs considérables semblent nécessaires pour recréer ce qui aurait pu être fait de manière incroyablement intuitive avant d'être amélioré.

Enfin, je trouve que les instructions ci-dessus semblent ne pas fonctionner lorsque vous vous retrouvez avec des contraintes supplémentaires, qui s'ajoutent comme par magie lorsque vous vous y attendez le moins. Très subtilement, vous devriez voir deux lignes au lieu d'une, comme ceci:

enter image description here

Je peux obtenir Interface Builder pour continuer à ajouter de plus en plus de contraintes en double simplement en changeant une contrainte de Égal à Inférieur à ou Égal. Je pense que c'est un bogue dans le générateur d'interface dans XCode 4.6, et comme les contraintes de disposition sont une partie relativement nouvelle de CococaTouch, je ne suis pas surpris que le support du générateur d'interface pour les contraintes de création automatique lorsque vous faites glisser et déplacez des éléments soit bogué.

2
Warren P