iOS Masonry 自动适配聊天气泡cell

小编已经近一年没有写技术文档了，感觉稍有荒废。在前几天面试过程中，面试官小伙问了一个关于用如何用 Masonry 自动适配聊天气泡的问题，因为有一段时间没有写聊天页面了，对有些细节记忆的不太清楚，近期以技术文档的形式进行了归纳，希望对开发的小伙伴有些许帮助。
首先集成 Masonry ，然后 UIViewController 中代码实现


- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
    //数据源
    _array = @[@"今天的天气真好，今天的天气真好，今天的天气真好，今天的天气真好，今天的天气真好", @"今天的天气真好，今天的天气真好", @"今天的天气真好，今天的天气真好，今天的天气真好", @"今天的天气真好"];
    _tableView = [[UITableView alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height) style:UITableViewStylePlain];
    _tableView.delegate = self;
    _tableView.dataSource = self;
    [_tableView registerClass:[CYTabCell class] forCellReuseIdentifier:@"CYTabCell"];
    [self.view addSubview:_tableView];
    
}

//记住千万不要实现 tableView 的 cell 高度代理
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
    return _array.count;
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    CYTabCell *cell = [tableView dequeueReusableCellWithIdentifier:@"CYTabCell"];
    cell.str = _array[indexPath.row];
    return cell;
}

UITabelViewCell 中的内容


#import "CYTabCell.h"

@interface CYTabCell ()
//气泡弹窗
@property (nonatomic, strong)UILabel *label;
//文本
@property (nonatomic, strong)UIImageView *imgView;

@end

@implementation CYTabCell

- (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier {
    self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
    if (self) {
        //只是为了代码清晰，和懒加载没啥关系
        [self.contentView addSubview:self.imgView];
        [self.contentView addSubview:self.label];
    }
    return self;
}

- (UILabel *)label {
    if (!_label) {
        _label = [[UILabel alloc] init];
        _label.font = [UIFont systemFontOfSize:15];
        _label.textColor = [UIColor blackColor];
        //设置最大宽度
        _label.preferredMaxLayoutWidth = 300;
        _label.numberOfLines = 0;
    }
    return _label;
}

- (UIImageView *)imgView {
    if (!_imgView) {
        _imgView = [[UIImageView alloc] init];
        _imgView.backgroundColor = [UIColor orangeColor];
        _imgView.layer.cornerRadius = 5;
        _imgView.layer.masksToBounds = YES;
        [self.contentView addSubview:_imgView];
    }
    return _imgView;
}

- (void)setStr:(NSString *)str {
    _str = str;
    _label.text = _str;

    [_label mas_updateConstraints:^(MASConstraintMaker *make) {
        //不要设置 left
        make.top.equalTo(_label.superview.mas_top).offset(15);
        make.right.equalTo(_label.superview.mas_right).offset(-40);
        make.bottom.equalTo(_label.superview.mas_bottom).offset(-15);
    }];

    [_imgView mas_updateConstraints:^(MASConstraintMaker *make) {
        make.left.equalTo(_label).offset(-15);
        make.top.equalTo(_label).offset(-10);
        make.bottom.mas_equalTo(_label).offset(10);
        make.right.mas_equalTo(_label).offset(15);
    }];
}

- (void)layoutSubviews {
    [super layoutSubviews];
}

效果图

1554298562249.jpg

谢谢！

最后编辑于：2019.04.03 21:51:41