iOS UIButton根据文字内容自动计算宽度

1.先看一下效果图

使用系统Button根据文字内容自动计算宽度效果如下：图片一.png

代码如下：

UIButton *button = [[UIButton alloc]init];
button.titleLabel.font = [UIFont boldSystemFontOfSize:15];
[button setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
button.backgroundColor = [UIColor lightGrayColor];
button.titleLabel.numberOfLines = 0;
button.titleLabel.textAlignment = NSTextAlignmentLeft;
[button setTitleEdgeInsets:UIEdgeInsetsMake(10, 10, -10, -10)];

[button mas_makeConstraints:^(MASConstraintMaker *make) {
        make.left.top.mas_equalTo(10);
        make.bottom.mas_equalTo(self.mas_bottom).offset(-15);
        make.right.mas_equalTo(-10);
    }];

如果button 设置文字过多，如上面A/B 选项，系统Button就不会根据文字自动计算宽度，如果设置文字过少，如上面的C/D选项，系统Button暂且还能满足要求。

如果我们想彻底解决这个问题，怎么办呢？

我们知道系统Button内部有两个控件， UILabel和UIImageView，系统自带的UILabel 已经满足不了我们的要求，所以我们要自定义一个UILabel控件，让新添加的UILabel控件跟UIButton之间产生约束，把文字信息显示在自定义的UILabel上，进而达到我们的要求。

代码如下：

1.Level4AnswerButton.h文件声明一个label属性

@interface Level4AnswerButton : UIButton
@property (nonatomic, strong) UILabel *label;
@end

2.Level4AnswerButton.m文件重写-(instancetype)init方法

-(instancetype)init {
    if (self = [super init]) {
        UILabel *label = [[UILabel alloc]init];
        self.label = label;
        label.textColor = [UIColor blackColor];
        label.numberOfLines = 0;
        [self addSubview:label];
        //关闭autoresizing约束
        label.translatesAutoresizingMaskIntoConstraints = NO;
        //添加上方约束
        NSLayoutConstraint *labelTop = [NSLayoutConstraint constraintWithItem:label attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeTop multiplier:1 constant:10];
        [self addConstraint:labelTop];
        //添加左边约束
        NSLayoutConstraint *labelLeft = [NSLayoutConstraint constraintWithItem:label attribute:NSLayoutAttributeLeft relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeLeft multiplier:1 constant:10];
        [self addConstraint:labelLeft];
        //添加下边约束
        NSLayoutConstraint *labelBottom = [NSLayoutConstraint constraintWithItem:label attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeBottom multiplier:1 constant:-10];
        [self addConstraint:labelBottom];
        
        //添加右边约束
        NSLayoutConstraint *labelRight = [NSLayoutConstraint constraintWithItem:label attribute:NSLayoutAttributeRight relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeRight multiplier:1 constant:-10];
        [self addConstraint:labelRight];
    }
    return self;
}

3.NSLayoutConstraint约束中可以设置UILabel在UIButton中的位置，这个自行设置
4.在自定义的UIButton中重写setTitle方法

-(void)setTitle:(NSString *)title forState:(UIControlState)state {
    self.label.text = title;
}
-(UILabel *)titleLabel {
    return self.label;
}
-(void)setTitleColor:(UIColor *)color forState:(UIControlState)state {
    self.label.textColor = color;
}

5.用自定义类创建Button

Level4AnswerButton *button = [[Level4AnswerButton alloc]init];
 button.titleLabel.font = [UIFont boldSystemFontOfSize:15];
[button setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
button.backgroundColor = [UIColor whiteColor];
button.titleLabel.numberOfLines = 0;

再来一下最终的效果图：

图片三.png

这样我们的目的就到了，Button 根据文字内容自动计算宽度。