动态展示标签(数量可变且长度不一) 并居中(iOS 开发)

2018-05-08  本文已影响7人  百事星空

引言

说一下自己在开发中遇到的需求及实现方法,需求是这样的,要在屏宽的范围内动态展示标签(标签数量可变),并且标签要居中显示,标签后台配置的一个长字符串,格式如下,“标题1@标题2@标题3”,以@ 符分割多个标题(分割方式自行约定)。

思路

刚看完这个需求可能直接就会想到用for循环 创建多个label,先不说具体的算法怎么弄,你可记得需求中可是要求居中的呢,这样的话居中就不好处理了。要解决居中,可以先创建一个父视图,让其居中显示,然后再在父视图上for循环动态创建label,这样不就解决了么,大致思路就这样,具体算法看代码。

代码

创建父视图

-(instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier{
    self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
    if (self) {
       [self.contentView addSubview:self.markBgview];
       [_markBgview mas_makeConstraints:^(MASConstraintMaker *make) {
          make.centerX.equalTo(self.contentView.mas_centerX).offset(0);
          make.top.equalTo(_subTitle.bottom).offset(15);
          make.size.equalTo(CGSizeMake(SCREEN_WIDTH, 21));
       }];
    }
    return self;
}

动态添加标签视图

-(void)configure:(HotBorrowModel*)model{
model.borrowTip = @"我是长标签@小标签@迷你标签";//此句是事例
    if (model) {
        if (model.borrowTip) {
            for (UIView *view in _markBgview.subviews) {
                [view removeFromSuperview];
            }
            NSArray *array = [NSArray array];//存放截取的多个字符串
            CGSize sizeMax = CGSizeZero;//字符串总的大小
            CGSize size = CGSizeZero;//分割后的小字符串的大小
            CGFloat wMax = 0.00;//父视图宽度
           CGFloat space = 5.00;//标签间隔
            NSString *str =  model.borrowTip;
            if ([model.borrowTip containsString:@"@"]) {
                //去除@ 获取字符串真实长度
                 str = [model.borrowTip stringByReplacingOccurrencesOfString:@"@" withString:@""];
            }
            sizeMax = [str sizeThatFits:CGSizeMake(CGFLOAT_MAX, 21) font:[UIFont systemFontOfSize:[GlobalUtil getFitSize:16]]];//这个是获取字符串尺寸的方法(封装过的) 网上很多就不写了

            array = [model.borrowTip componentsSeparatedByString:@"@"];
            wMax = sizeMax.width + (array.count-1)* space;
            
            CGRect rect = CGRectZero;
            
            for (int i =0; i<array.count; i++) {
                
                size = [array[i] sizeThatFits:CGSizeMake(CGFLOAT_MAX, 21) font:[UIFont systemFontOfSize:[GlobalUtil getFitSize:16]]];
                CGFloat w =size.width;
                rect = CGRectMake(rect.origin.x + rect.size.width ,0, w, size.height);
                UILabel *markLabel = [[UILabel alloc]init];
                
                markLabel.frame = CGRectMake(rect.origin.x+ space*i, 0, w, 21);
                [_markBgview addSubview:markLabel];
                markLabel.text = array[i];
                markLabel.textAlignment = NSTextAlignmentCenter;
                markLabel.font = [UIFont systemFontOfSize:13];
                markLabel.textColor = [UIColor hexfecb2fColor];
                markLabel.layer.borderWidth = 0.5;
                markLabel.layer.borderColor = [UIColor hexfecb2fColor].CGColor;
                
            }
           //更新父视图约束
            [_markBgview mas_updateConstraints:^(MASConstraintMaker *make) {
                make.size.equalTo(CGSizeMake(wMax, 21));
            }];

        }
        
    }
}

运行效果图:


1.png
2.png
3.png
图层.png
上一篇下一篇

猜你喜欢

热点阅读