IOS - UIView中使用AutoLayout的UILabel动态高度

Posted

技术标签:

【中文标题】IOS - UIView中使用AutoLayout的UILabel动态高度【英文标题】:IOS - UILabel dynamic height in UIView using AutoLayout 【发布时间】:2015-06-23 18:08:23 【问题描述】:

我有一个 UITableView 和自定义 UITableViewCell。我在单元格内添加了 AutoLayout,在这个单元格中,我有一个需要动态更改其高度的 UILabel,然后我有一个 UIView,其中包含其他子视图,包括需要动态更改其高度的 UILabel。我没有收到任何错误,但这是自定义 UITableViewCell:

动态文本应该在动态文本之后强制底部 UIView。但正如你所见,动态文本通过了底部的 UIView。

        #import "PostTableViewCell.h"

        @implementation PostTableViewCell

        @synthesize main;
        @synthesize top;
        @synthesize center;
        @synthesize bottom;
        @synthesize labelMessage;
        @synthesize labelCat;
        @synthesize labelUser;
        @synthesize labelDate;
        @synthesize imageviewThreadImage;

        - (id)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier 
            self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
            if (self) 
            [self.contentView setTranslatesAutoresizingMaskIntoConstraints:NO];
            self.contentView.autoresizingMask = UIViewAutoresizingFlexibleHeight|UIViewAutoresizingFlexibleWidth;

            CGRect screenBound = [[UIScreen mainScreen] bounds];
            CGSize screenSize = screenBound.size;
            CGFloat screenWidth = screenSize.width;
            CGFloat screenHeight = screenSize.height;

            main = [UIView new];
            [self.contentView addSubview:main];
            main.translatesAutoresizingMaskIntoConstraints = NO;
            //[main sizeToFit];
            main.backgroundColor = [UIColor whiteColor];

            top = [UIView new];
            [main addSubview:top];
            top.translatesAutoresizingMaskIntoConstraints = NO;
            //[top sizeToFit];
            top.backgroundColor = [UIColor whiteColor];

            labelUser = [UILabel new];
            [top addSubview:labelUser];
            labelUser.translatesAutoresizingMaskIntoConstraints = NO;
            //[labelUser sizeToFit];
            [labelUser setFont:[UIFont systemFontOfSize:14]];
            labelUser.textColor = [UIColor colorWithRed:(114.0/255.0) green:(114.0/255.0) blue:(114.0/255.0) alpha:1.0];

            labelDate = [UILabel new];
            [top addSubview:labelDate];
            labelDate.translatesAutoresizingMaskIntoConstraints = NO;
            [labelDate sizeToFit];
            [labelDate setFont:[UIFont systemFontOfSize:14]];
            labelDate.textColor = [UIColor colorWithRed:(114.0/255.0) green:(114.0/255.0) blue:(114.0/255.0) alpha:1.0];

            center = [UIView new];
            [main addSubview:center];
            center.translatesAutoresizingMaskIntoConstraints = NO;
            [center sizeToFit];
            center.backgroundColor = [UIColor whiteColor];

            imageviewThreadImage = [UIImageView new];
            [center addSubview:imageviewThreadImage];
            imageviewThreadImage.translatesAutoresizingMaskIntoConstraints = NO;
            imageviewThreadImage.backgroundColor = [UIColor colorWithRed:(207.0/255.0) green:(215.0/255.0) blue:(248.0/255.0) alpha:1.0];

            labelMessage = [UILabel new];
            [center addSubview:labelMessage];
            labelMessage.translatesAutoresizingMaskIntoConstraints = NO;
            [labelMessage sizeToFit];
            [labelMessage setFont:[UIFont systemFontOfSize:14]];
            labelMessage.preferredMaxLayoutWidth = screenWidth - 10 - 36;
            labelMessage.lineBreakMode = NSLineBreakByWordWrapping;
            labelMessage.numberOfLines = 0;
            labelMessage.textColor = [UIColor lightGrayColor];

            bottom = [UIView new];
            [main addSubview:bottom];
            bottom.translatesAutoresizingMaskIntoConstraints = NO;
            [bottom sizeToFit];

            labelCat = [UILabel new];
            [bottom addSubview:labelCat];
            labelCat.translatesAutoresizingMaskIntoConstraints = NO;
            [labelCat sizeToFit];
            [labelCat setFont:[UIFont systemFontOfSize:12]];
            labelCat.textColor = [UIColor colorWithRed:(58.0/255.0) green:(82.0/255.0) blue:(207.0/255.0) alpha:1.0];
            

            return self;
        

        - (void)layoutSubviews
        
            [super layoutSubviews];

            // Make sure the contentView does a layout pass here so that its subviews have their frames set, which we
            // need to use to set the preferredMaxLayoutWidth below.
            [self.contentView setNeedsLayout];
            [self.contentView layoutIfNeeded];

            // Set the preferredMaxLayoutWidth of the mutli-line bodyLabel based on the evaluated width of the label's frame,
            // as this will allow the text to wrap correctly, and as a result allow the label to take on the correct height.
            self.labelMessage.preferredMaxLayoutWidth = CGRectGetWidth(self.labelMessage.frame);
        

        - (void)updateConstraints 
            [super updateConstraints];

            if (self.didSetupConstraints) return;

            NSDictionary *viewsDictionary7 = @@"main":main;
            NSArray *constraint_H37 = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|[main]|"
                                              options:0
                                              metrics:nil
                                            views:viewsDictionary7];

            NSArray *constraint_V37 = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|[main]|"
                                              options:0
                                              metrics:nil
                                            views:viewsDictionary7];
            [self.contentView addConstraints:constraint_H37];
            [self.contentView addConstraints:constraint_V37];


            NSDictionary *viewsDictionary3 = @@"top":top,@"center":center,@"bottom":bottom,@"labelMessage":labelMessage;
            NSArray *constraint_H3 = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-5-[top]-5-[center]-5-[bottom]-10-|"
                                             options:0
                                             metrics:nil
                                               views:viewsDictionary3];

            NSArray *constraint_H33 = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|[top]|"
                                              options:0
                                              metrics:nil
                                            views:viewsDictionary3];

            NSArray *constraint_H333 = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|[center]|"
                                               options:0
                                               metrics:nil
                                             views:viewsDictionary3];

            NSArray *constraint_H3335657 = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|[bottom]|"
                                               options:0
                                               metrics:nil
                                                 views:viewsDictionary3];

            NSDictionary *viewsDictionary4 = @@"labelUser":labelUser,@"labelDate":labelDate;
            NSArray *constraint_H4 = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|[labelUser]|"
                                             options:0
                                             metrics:nil
                                               views:viewsDictionary4];

            NSDictionary *viewsDictionary45 = @@"labelDate":labelDate;
            NSArray *constraint_H4555 = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|[labelDate]|"
                                            options:0
                                            metrics:nil
                                              views:viewsDictionary45];

            NSArray *constraint_H44 = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-5-[labelUser]-20-[labelDate]-5-|"
                                              options:0
                                              metrics:nil
                                            views:viewsDictionary4];

            NSDictionary *viewsDictionary48 = @@"labelMessage":labelMessage,@"imageviewThreadImage":imageviewThreadImage;
            NSArray *constraint_H48 = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-0-[labelMessage]"
                                              options:0
                                              metrics:nil
                                            views:viewsDictionary48];

            NSArray *constraint_H48342 = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-8-[imageviewThreadImage(36)]|"
                                             options:0
                                             metrics:nil
                                               views:viewsDictionary48];

            NSArray *constraint_H448 = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-5-[imageviewThreadImage(36)]-5-[labelMessage]-5-|"
                                               options:0
                                               metrics:nil
                                             views:viewsDictionary48];

            NSDictionary *viewsDictionary488 = @@"labelCat":labelCat;
            NSArray *constraint_H488 = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-5-[labelCat]|"
                                               options:0
                                               metrics:nil
                                             views:viewsDictionary488];

            NSArray *constraint_H4488 = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-5-[labelCat]"
                                            options:0
                                            metrics:nil
                                              views:viewsDictionary488];



            [main addConstraints:constraint_H3];
            ////[main addConstraints:constraint_H33];
            [main addConstraints:constraint_H333];
            [top addConstraints:constraint_H4];
            [top addConstraints:constraint_H44];
            [center addConstraints:constraint_H48];
            [center addConstraints:constraint_H448];
            [top addConstraints:constraint_H4555];
            [main addConstraints:constraint_H3335657];
            [main addConstraints:constraint_H488];
            [main addConstraints:constraint_H48342];
            [main addConstraints:constraint_H4488];



            self.didSetupConstraints = YES;

        

        - (void)awakeFromNib 
            // Initialization code
        

        - (void)setSelected:(BOOL)selected animated:(BOOL)animated 
            [super setSelected:selected animated:animated];

            // Configure the view for the selected state
        

        @end

这是我得到的结果:

【问题讨论】:

问题不在于标签,它的单元格不会自行调整大小,您支持的最低 ios 版本是多少? 我正在测试我的 iphone 4s 上的应用程序,我也使用了我的 iphone 4,但是 iphone 4 的单元格不能正常工作,如果它在 iphone 4s IOS 8.0 上工作,自动布局是否能在 iphone 5 和6? 【参考方案1】:

这是你的答案redoc01

- (CGFloat)tableView:(UITableView *)aTableView heightForRowAtIndexPath:(NSIndexPath *)indexPath  

    // Get table dat
    static NSString *CellIdentifier = @"CustomCell";
    UITableViewCell *cell = [aTableView dequeueReusableCellWithIdentifier:CellIdentifier];
    if (cell == nil) 

        //Create Cell
        NSArray *nib;
        nib = [[NSBundle mainBundle] loadNibNamed:CellIdentifier owner:self options:nil];
        cell = (UITableViewCell *) [nib objectAtIndex:0];
    

    if(indexPath.section == 0)  
        UILabel *dateLable = (UILabel *) [cell.contentView viewWithTag:CELL_DATE_LABLE];
        dateLable.text = _string3;
        [dateLable layoutIfNeeded];
        return dateLable.frame.size.height;
    

让我知道您的反馈..

【讨论】:

【参考方案2】:

我通过更改 AutoLayout 解决了这个问题,这是修改后的 UITableViewCell 使其与 AutoLayout 一起使用:

        #import "PostTableViewCell.h"

        @implementation PostTableViewCell

        @synthesize main;
        @synthesize top;
        @synthesize center;
        @synthesize centerLeft;
        @synthesize centerRight;
        @synthesize bottom;
        @synthesize labelMessage;
        @synthesize labelCat;
        @synthesize labelUser;
        @synthesize labelDate;
        @synthesize imageviewThreadImage;

        - (id)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier 
            self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
            if (self) 
            [self.contentView setTranslatesAutoresizingMaskIntoConstraints:NO];
            self.contentView.autoresizingMask = UIViewAutoresizingFlexibleHeight|UIViewAutoresizingFlexibleWidth;

            CGRect screenBound = [[UIScreen mainScreen] bounds];
            CGSize screenSize = screenBound.size;
            CGFloat screenWidth = screenSize.width;
            CGFloat screenHeight = screenSize.height;

            main = [UIView new];
            //[self.contentView addSubview:main];
            main.translatesAutoresizingMaskIntoConstraints = NO;
            [main sizeToFit];
            main.backgroundColor = [UIColor whiteColor];

            top = [UIView new];
            [self.contentView addSubview:top];
            top.translatesAutoresizingMaskIntoConstraints = NO;
            [top sizeToFit];
            top.backgroundColor = [UIColor whiteColor];

            labelUser = [UILabel new];
            [top addSubview:labelUser];
            labelUser.translatesAutoresizingMaskIntoConstraints = NO;
            [labelUser sizeToFit];
            [labelUser setFont:[UIFont systemFontOfSize:14]];
            labelUser.textColor = [UIColor colorWithRed:(114.0/255.0) green:(114.0/255.0) blue:(114.0/255.0) alpha:1.0];

            labelDate = [UILabel new];
            [top addSubview:labelDate];
            labelDate.translatesAutoresizingMaskIntoConstraints = NO;
            [labelDate sizeToFit];
            [labelDate setFont:[UIFont systemFontOfSize:14]];
            labelDate.textColor = [UIColor colorWithRed:(114.0/255.0) green:(114.0/255.0) blue:(114.0/255.0) alpha:1.0];

            center = [UIView new];
            [self.contentView addSubview:center];
            center.translatesAutoresizingMaskIntoConstraints = NO;
            [center sizeToFit];
            center.backgroundColor = [UIColor whiteColor];


            imageviewThreadImage = [UIImageView new];
            [center addSubview:imageviewThreadImage];
            imageviewThreadImage.translatesAutoresizingMaskIntoConstraints = NO;
            imageviewThreadImage.backgroundColor = [UIColor colorWithRed:(207.0/255.0) green:(215.0/255.0) blue:(248.0/255.0) alpha:1.0];
            [imageviewThreadImage sizeToFit];

            labelMessage = [UILabel new];
            [center addSubview:labelMessage];
            labelMessage.translatesAutoresizingMaskIntoConstraints = NO;
            [labelMessage sizeToFit];
            [labelMessage setFont:[UIFont systemFontOfSize:14]];
            labelMessage.preferredMaxLayoutWidth = screenWidth - 10 - 36;
            labelMessage.lineBreakMode = UILineBreakModeWordWrap;
            labelMessage.numberOfLines = 0;
            labelMessage.textColor = [UIColor lightGrayColor];
            //labelMessage.lineBreakMode = UILineBreakModeWordWrap;

            bottom = [UIView new];
            [self.contentView addSubview:bottom];
            bottom.translatesAutoresizingMaskIntoConstraints = NO;
            [bottom sizeToFit];

            labelCat = [UILabel new];
            [bottom addSubview:labelCat];
            labelCat.translatesAutoresizingMaskIntoConstraints = NO;
            [labelCat sizeToFit];
            [labelCat setFont:[UIFont systemFontOfSize:12]];
            labelCat.textColor = [UIColor colorWithRed:(58.0/255.0) green:(82.0/255.0) blue:(207.0/255.0) alpha:1.0];
            labelCat.lineBreakMode = UILineBreakModeWordWrap;
            labelCat.numberOfLines = 0;
            

            return self;
        

        - (void)layoutSubviews
        
            [super layoutSubviews];
            // Make sure the contentView does a layout pass here so that its subviews have their frames set, which we
            // need to use to set the preferredMaxLayoutWidth below.
            [self.contentView setNeedsLayout];
            [self.contentView layoutIfNeeded];

            // Set the preferredMaxLayoutWidth of the mutli-line bodyLabel based on the evaluated width of the label's frame,
            // as this will allow the text to wrap correctly, and as a result allow the label to take on the correct height.
            self.labelMessage.preferredMaxLayoutWidth = CGRectGetWidth(self.labelMessage.frame);
        

        - (void)updateConstraints 
            [super updateConstraints];

            if (self.didSetupConstraints) return;

            /**NSDictionary *viewsDictionary7 = @@"main":main;
            NSArray *constraint_H37 = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|[main]|"
                                              options:0
                                              metrics:nil
                                            views:viewsDictionary7];

            NSArray *constraint_V37 = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|[main]|"
                                              options:0
                                              metrics:nil
                                            views:viewsDictionary7];
            [self.contentView addConstraints:constraint_H37];
            [self.contentView addConstraints:constraint_V37];**/

            NSString *text = labelMessage.text;

            NSDictionary *viewsDictionary3 = @@"top":top,@"center":center,@"bottom":bottom;
            NSArray *constraint_H3 = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-10-[top]-5-[center(>=50)]-5-[bottom]-10-|"
                                             options:0
                                             metrics:nil
                                               views:viewsDictionary3];

            NSArray *constraint_H33 = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|[top]|"
                                              options:0
                                              metrics:nil
                                            views:viewsDictionary3];

            NSArray *constraint_H333 = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|[center]|"
                                               options:0
                                               metrics:nil
                                             views:viewsDictionary3];

            NSArray *constraint_H3335657 = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|[bottom]|"
                                               options:0
                                               metrics:nil
                                                 views:viewsDictionary3];

            NSDictionary *viewsDictionary4 = @@"labelUser":labelUser,@"labelDate":labelDate;
            NSArray *constraint_H4 = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|[labelUser]|"
                                             options:0
                                             metrics:nil
                                               views:viewsDictionary4];

            NSDictionary *viewsDictionary45 = @@"labelDate":labelDate;
            NSArray *constraint_H4555 = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|[labelDate]|"
                                            options:0
                                            metrics:nil
                                              views:viewsDictionary45];

            NSArray *constraint_H44 = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-5-[labelUser]-20-[labelDate]-5-|"
                                              options:0
                                              metrics:nil
                                            views:viewsDictionary4];

            NSDictionary *viewsDictionary48 = @@"labelMessage":labelMessage,@"imageviewThreadImage":imageviewThreadImage;



            NSArray *constraint_H48 = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-5-[labelMessage]|"
                                              options:0
                                              metrics:nil
                                            views:viewsDictionary48];

            NSArray *constraint_H48342 = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-8-[imageviewThreadImage(36)]"
                                             options:0
                                             metrics:nil
                                               views:viewsDictionary48];



            NSArray *constraint_H448345fgdfg = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-5-[imageviewThreadImage(36)]-5-[labelMessage]-5-|"
                                               options:0
                                               metrics:nil
                                             views:viewsDictionary48];



            /**NSArray *constraint_H448 = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-5-[labelMessage]-5-|"
                                               options:0
                                               metrics:nil
                                             views:viewsDictionary48];**/

            NSDictionary *viewsDictionary488 = @@"labelCat":labelCat;
            NSArray *constraint_H488 = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|[labelCat]|"
                                               options:0
                                               metrics:nil
                                             views:viewsDictionary488];

            NSArray *constraint_H4488 = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-5-[labelCat]"
                                            options:0
                                            metrics:nil
                                              views:viewsDictionary488];



            [self.contentView addConstraints:constraint_H3];
            [self.contentView addConstraints:constraint_H33];
            [self.contentView addConstraints:constraint_H333];
            [self.contentView addConstraints:constraint_H4];
            [self.contentView addConstraints:constraint_H44];
            [self.contentView addConstraints:constraint_H48];
            //[self.contentView addConstraints:constraint_H448];
            [self.contentView addConstraints:constraint_H4555];
            [self.contentView addConstraints:constraint_H3335657];
            [self.contentView addConstraints:constraint_H488];
            [self.contentView addConstraints:constraint_H48342];
            [self.contentView addConstraints:constraint_H4488];
            [self.contentView addConstraints:constraint_H448345fgdfg];



            self.didSetupConstraints = YES;

        



        - (CGFloat)heightForText:(NSString *)bodyText
        
            UIFont *cellFont = [UIFont systemFontOfSize:17];
            CGSize constraintSize = CGSizeMake(300, MAXFLOAT);
            CGSize labelSize = [bodyText sizeWithFont:cellFont constrainedToSize:constraintSize lineBreakMode:UILineBreakModeWordWrap];
            CGFloat height = labelSize.height + 10;
            return height;
        


        - (void)awakeFromNib 
            // Initialization code
        

        - (void)setSelected:(BOOL)selected animated:(BOOL)animated 
            [super setSelected:selected animated:animated];

            // Configure the view for the selected state
        

        @end

【讨论】:

如果问题与您不再相关,请接受您的回答并关闭问题。我很高兴你把事情解决了:)【参考方案3】:

在 iOS 8 中,您可以使用委托函数来计算单元格大小,如下所示:

- (CGFloat)tableView:(UITableView *)tableView estimatedHeightForRowAtIndexPath:(NSIndexPath *)indexPath 
return UITableViewAutomaticDimension;

确保标签到 contentView 底部之间有底部约束,然后就完成了。

请注意,它仅适用于 iOS 8。

【讨论】:

以上是关于IOS - UIView中使用AutoLayout的UILabel动态高度的主要内容,如果未能解决你的问题,请参考以下文章

iOS Autolayout 调整标签大小和它们之间的空间

UISearchBar AutoLayout ios7 错误?

AutoLayout 适用于 UIView 但不适用于 UILabel。为啥?

在AutoLayout - iOS中,约束计数总是变为零

iOS Autolayout:两个等宽等间距的视图

如何使用 AutoLayout (iOS/Xamarin.iOS) 使 ScrollView 适合其内容?