iOS: UILabel multiligne dans la mise en page automatique

J'ai du mal à essayer d'obtenir un comportement de mise en page très basique avec la mise en page automatique. Mon contrôleur de vue ressemble à ceci dans IB:

L'étiquette du haut est l'étiquette du titre, je ne sais pas combien de lignes ce sera. J'ai besoin de l'étiquette de titre pour afficher toutes les lignes de texte. J'ai également besoin que les deux autres étiquettes et la petite image soient disposées juste en dessous du titre, quelle que soit sa hauteur. J'ai défini des contraintes d'espacement vertical entre les étiquettes et la petite image, ainsi qu'une contrainte d'espacement en haut entre l'étiquette de titre et sa super-vue et une contrainte d'espacement en bas entre la petite image et sa super-vue. Le UIView blanc n'a pas de contrainte de hauteur, il doit donc s'étirer verticalement pour contenir ses sous-vues. J'ai défini le nombre de lignes de l'étiquette de titre sur 0.

Comment puis-je faire redimensionner l'étiquette de titre pour qu'elle corresponde au nombre de lignes requis par la chaîne? Je crois comprendre que je ne peux pas utiliser les méthodes setFrame car j'utilise la mise en page automatique. Et je dois utiliser la mise en page automatique car j'ai besoin que ces autres vues restent en dessous de l'étiquette de titre (d'où les contraintes).

Comment puis-je y arriver?

L'utilisation -setPreferredMaxLayoutWidthsur UILabelet la mise en page automatique devrait gérer le reste.

[label setPreferredMaxLayoutWidth:200.0];

Reportez-vous à la documentation UILabel sur favoriteMaxLayoutWidth .

Mettre à jour:

Il suffit de définir la heightcontrainte dans le storyboard sur Greater than or equal to, pas besoin de setPreferredMaxLayoutWidth.

Développez le nombre de lignes de votre jeu d'étiquettes à 0 et, plus important encore, pour la mise en page automatique, définissez la hauteur sur> = x. La mise en page automatique fera le reste. Vous pouvez également contenir vos autres éléments basés sur l'élément précédent pour positionner correctement ensuite.

Source: http://www.objc.io/issue-3/advanced-auto-layout-toolbox.html

Taille du contenu intrinsèque du texte multiligne

La taille du contenu intrinsèque de UILabel et NSTextField est ambiguë pour le texte multiligne. La hauteur du texte dépend de la largeur des lignes, qui reste à déterminer lors de la résolution des contraintes. Afin de résoudre ce problème, les deux classes ont une nouvelle propriété appelée favoriteMaxLayoutWidth, qui spécifie la largeur de ligne maximale pour calculer la taille du contenu intrinsèque.

Puisque nous ne connaissons généralement pas cette valeur à l'avance, nous devons adopter une approche en deux étapes pour y parvenir. Nous laissons d'abord la mise en page automatique faire son travail, puis nous utilisons le cadre résultant dans la passe de mise en page pour mettre à jour la largeur maximale préférée et déclencher à nouveau la mise en page.

- (void)layoutSubviews
{
    [super layoutSubviews];
    myLabel.preferredMaxLayoutWidth = myLabel.frame.size.width;
    [super layoutSubviews];
}

Le premier appel à [super layoutSubviews] est nécessaire pour que l'étiquette obtienne son jeu de cadres, tandis que le deuxième appel est nécessaire pour mettre à jour la mise en page après la modification. Si nous omettons le deuxième appel, nous obtenons une erreur NSInternalInconsistencyException, car nous avons apporté des modifications dans la passe de mise en page qui nécessitent la mise à jour des contraintes, mais nous n'avons pas déclenché à nouveau la mise en page.

Nous pouvons également le faire dans une sous-classe d'étiquettes elle-même:

@implementation MyLabel
- (void)layoutSubviews
{
    self.preferredMaxLayoutWidth = self.frame.size.width;
    [super layoutSubviews];
}
@end

Dans ce cas, nous n'avons pas besoin d'appeler d'abord [super layoutSubviews], car lorsque layoutSubviews est appelé, nous avons déjà un cadre sur l'étiquette elle-même.

Pour effectuer cet ajustement à partir du niveau du contrôleur de vue, nous nous connectons à viewDidLayoutSubviews. À ce stade, les cadres de la première passe de mise en page automatique sont déjà définis et nous pouvons les utiliser pour définir la largeur maximale préférée.

- (void)viewDidLayoutSubviews
{
    [super viewDidLayoutSubviews];
    myLabel.preferredMaxLayoutWidth = myLabel.frame.size.width;
    [self.view layoutIfNeeded];
}

Enfin, assurez-vous que vous n'avez pas de contrainte de hauteur explicite sur l'étiquette qui a une priorité plus élevée que la priorité de résistance à la compression du contenu de l'étiquette. Sinon, il l'emportera sur la hauteur calculée du contenu. Assurez-vous de vérifier toutes les contraintes qui peuvent affecter la hauteur de l'étiquette.

Je me battais juste avec ce scénario exact, mais avec quelques vues supplémentaires qui devaient être redimensionnées et abaissées si nécessaire. Cela me rendait fou, mais je l'ai finalement compris.

Voici la clé: Interface Builder aime ajouter des contraintes supplémentaires lorsque vous ajoutez et déplacez des vues et vous ne le remarquerez peut-être pas. Dans mon cas, j'avais une vue à mi-chemin qui avait une contrainte supplémentaire qui spécifiait la taille entre elle et son superview, l'épinglant essentiellement à ce point. Cela signifiait que rien au-dessus ne pouvait être redimensionné plus grand car cela irait à l'encontre de cette contrainte.

Un moyen simple de savoir si tel est le cas consiste à essayer de redimensionner l'étiquette manuellement. IB vous permet-il de le cultiver? Si tel est le cas, les libellés ci-dessous se déplacent-ils comme prévu? Assurez-vous d'avoir coché ces deux éléments avant de redimensionner pour voir comment vos contraintes déplaceront vos vues:

Si la vue est bloquée, suivez les vues qui se trouvent en dessous et assurez-vous que l'une d'elles n'a pas d'espace supérieur pour superviser la contrainte. Ensuite, assurez-vous simplement que votre option de nombre de lignes pour l'étiquette est définie sur 0 et qu'elle devrait s'occuper du reste.

Je trouve que vous avez besoin des éléments suivants:

• Une contrainte majeure
• Une contrainte principale (par exemple côté gauche)
• Une contrainte de fin (par exemple côté droit)
• Définissez la priorité de respect du contenu, horizontale à faible, de sorte qu'il remplisse l'espace donné si le texte est court.
• Réglez la résistance à la compression du contenu, horizontale à faible, pour qu'elle s'enroule au lieu d'essayer de s'élargir.
• Définissez le nombre de lignes sur 0.
• Définissez le mode de saut de ligne sur word wrap.

Aucune des différentes solutions trouvées dans les nombreux sujets sur le sujet n'a fonctionné parfaitement pour mon cas (x étiquettes multilignes dynamiques dans des cellules de vue de tableau dynamique).

J'ai trouvé un moyen de le faire:

Après avoir défini les contraintes sur votre étiquette et mis sa propriété multiligne à 0, créez une sous-classe de UILabel; J'ai appelé le mien AutoLayoutLabel:

@implementation AutoLayoutLabel

- (void)layoutSubviews{
    [self setNeedsUpdateConstraints];
    [super layoutSubviews];
    self.preferredMaxLayoutWidth = CGRectGetWidth(self.bounds);
}

@end

J'ai un UITableViewCell qui a une étiquette d'habillage de texte. J'ai travaillé l'habillage de texte comme suit.

1) Définissez les contraintes UILabel comme suit.

2) Réglez no. de lignes à 0.

3) Ajout de la contrainte de hauteur UILabel à UITableViewCell.

@IBOutlet weak var priorityLabelWidth: NSLayoutConstraint!

4) Sur UITableViewCell:

priorityLabel.sizeToFit()
priorityLabelWidth.constant = priorityLabel.intrinsicContentSize().width+5

Une façon de faire cela ... À mesure que la longueur du texte augmente, essayez de modifier (réduire) la taille de la police du texte de l'étiquette en utilisant

Label.adjustsFontSizeToFitWidth = YES;