web-dev-qa-db-fra.com

UILabel en haut à gauche, placez le texte en haut de la vue des étiquettes

Y a-t-il un moyen de "top aligner" un UILabel, c'est-à-dire que le texte reste collé en haut de la vue de l'étiquette? Par opposition au centre aligné verticalement ou flottant au centre de la vue, comme c'est le cas par défaut?

Voici une image de trois étiquettes, alignées à gauche, à droite et au centre, et une vue UITextView alignée au centre et en haut. Le texte de textView reste en haut quelle que soit la taille verticale de la vue. Puis-je faire la même chose avec une étiquette?

enter image description here

iphoneobjective-ciosxcode
25
Mrwolfy

Il n'y a aucun moyen de définir l'alignement vertical d'une UILabel par défaut dans iOS. Au lieu de cela, vous voudrez utiliser l’une des méthodes sizeWithFont fournies par NSString. Celui que vous utilisez dépend si vous voulez une étiquette multiligne ou une ligne. sizeWithFont:forWidth:lineBreakMode: peut être utilisé pour les étiquettes sur une seule ligne, alors que sizeWithFont:constrainedToSize:lineBreakMode: peut être utilisé pour les étiquettes sur plusieurs lignes. Vous pouvez facilement charger le paramètre de police avec la propriété font de l'étiquette en question. Vous pouvez consulter ici pour plus de détails sur l’utilisation de ces fonctions.

Ces méthodes renverront une structure CGSize avec la taille minimale de votre étiquette en fonction du texte de la NSString. Une fois que vous avez la bonne taille pour l'étiquette, vous pouvez facilement la placer en haut de votre aperçu et elle semblera alignée en haut.

9
Paul O.

Il y a une solution de contournement pour cela:

  1. Définissez une hauteur & largeur constraint sur votre UILabel avec une constante <= sur la hauteur maximale | largeur souhaitée.
  2. Définissez number of lines à zéro.
  3. Définissez la hauteur dans storyboard pour s’adapter à une seule ligne.
  4. Dans votre code, après avoir défini le texte de UILabel, appelez sizeToFit.

Ceci ferait que votre UILabel redimensionne dans les limites de la largeur et de la hauteur maximales que vous voulez et le texte sera toujours aligné en haut.

26
AboulEinein

J'ai utilisé la réponse ci-dessus liée à nevan king dans un commentaire à ma question: Aligner verticalement le texte en haut dans un UILabel

Le code que j'ai utilisé est ici:

- (void)setUILabelTextWithVerticalAlignTop:(NSString *)theText {
    CGSize labelSize = CGSizeMake(250, 300);
    CGSize theStringSize = [theText sizeWithFont:targetLabel.font constrainedToSize:labelSize lineBreakMode:targetLabel.lineBreakMode];
    targetLabel.frame = CGRectMake(targetLabel.frame.Origin.x, targetLabel.frame.Origin.y, theStringSize.width, theStringSize.height);
    targetLabel.text = theText;
}

//linked to a button that sets the text from a UITextView to the label.
- (IBAction)setText:(id)sender {

    [sourceText resignFirstResponder];
    [self setUILabelTextWithVerticalAlignTop:sourceText.text];
    [targetLabel setNumberOfLines:0];
    [targetLabel sizeToFit];

}

Voici le projet:

owolf.net/uploads/StackOverflow/verticalAlignUILabel.Zip

12
Mrwolfy

J'ai remplacé UILabel par UITextView, car dans UITextView, le texte reste en haut.

Juste une suggestion, cela peut être utile pour quelqu'un. 

6
WebOrCode

Faire une sous-classe de UILabel 

fichier .h

@property (nonatomic, assign) UIControlContentVerticalAlignment verticalAlignment;

fichier .m

- (void) drawTextInRect:(CGRect)rect 
{
    if(_verticalAlignment == UIControlContentVerticalAlignmentTop ||  _verticalAlignment == UIControlContentVerticalAlignmentBottom)    
    {
         // If one line, we can just use the lineHeight, faster than querying sizeThatFits
         const CGFloat height = floorf(((self.numberOfLines == 1) ? ceilf(self.font.lineHeight) : [self sizeThatFits:self.frame.size].height));
          rect.Origin.y = floorf(((self.frame.size.height - height) / 2.0f) * ((_verticalAlignment == UIControlContentVerticalAlignmentTop) ? -1.0f : 1.0f));
    }
    [super drawTextInRect:rect];
}


- (void) setVerticalAlignment:(UIControlContentVerticalAlignment)newVerticalAlignment
{
     _verticalAlignment = newVerticalAlignment;
     [self setNeedsDisplay];
}

Je l'ai utilisé pour l'alignement vertical. 

1
Wodjefer

Il existe une solution simple pour les cas où la hauteur d'une étiquette n'a pas besoin d'être constante: mettez votre Label dans un Stack View. Assurez-vous d’ajouter les constantes de début et de fin au Stack View. Voici une capture d’écran montrant comment procéder dans le storyboard:

 enter image description here

1
Alexander Poleschuk

Ce que j'ai fait dans mon application a été de définir la propriété de ligne de UILabel sur 0 ainsi que de créer une contrainte inférieure de UILabel et de m'assurer qu'elle est définie sur> = 0, comme indiqué dans l'image ci-dessous.

 enter image description here

0
Jack