美文网首页iOS常用
iOS开发-云标签布局

iOS开发-云标签布局

作者: 善良的皮蛋 | 来源:发表于2020-08-04 16:27 被阅读0次

日常开发中很多需要云标签布局的需求


image.png

我的需求:布局了云标签然后下面View自适应布局,工具是Masonry.

- (void)testCloudTag{
    /** 父视图View */
    UIView *tagView = [[UIView alloc]init];
    tagView.backgroundColor = [UIColor redColor];
    tagView.userInteractionEnabled = YES;
    
    [self.view addSubview:tagView];
    [tagView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.top.equalTo(self.view.mas_top).offset(120);
        make.left.right.equalTo(self.view);
        make.height.greaterThanOrEqualTo(@30);
    }];
    
    UIView *downView = [[UIView alloc]init];
      downView.backgroundColor = [UIColor purpleColor];
      [self.view addSubview:downView];
      [downView mas_makeConstraints:^(MASConstraintMaker *make) {
          make.top.equalTo(tagView.mas_bottom).offset(10);
          make.left.right.equalTo(tagView);
          make.height.equalTo(@50);
      }];
    
    
    NSArray *array = @[@"测试",@"测试测试测试测试测试",@"测试",@"测试测试测试测试测试测试",@"测试",@"测试测试",@"测试测试测试",@"测试测试测试测试",@"测试"];
       
       UIButton *listButton;
       
       __block float buttonRight;
       
       for (int i = 0; i < array.count; i++) {
           
           NSString *title = array[i];
           
           CGFloat titleW = [self labelAutoCalculateRectWith:title FontSize:14 MaxSize:CGSizeMake(MAXFLOAT, MAXFLOAT)].width + 20;
           UIButton *button = [UIButton new];
           button.tag = i;
           button.backgroundColor = [UIColor blueColor];
           [button setTitle:title forState:UIControlStateNormal];
           [button setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
           [button addTarget:self action:@selector(btnClicked:) forControlEvents:UIControlEventTouchUpInside];
           button.titleLabel.font = [UIFont systemFontOfSize:14];
           button.layer.cornerRadius = 10;
           button.layer.masksToBounds = YES;
           [tagView addSubview:button];
           [button mas_makeConstraints:^(MASConstraintMaker *make) {
               
               if (listButton) {
                   //当前按钮右侧坐标
                   buttonRight = buttonRight + 15 + titleW;
                   if (buttonRight > self.view.frame.size.width) {
                       make.top.mas_equalTo(listButton.mas_bottom).offset(15);
                       make.left.mas_equalTo(10);
                       buttonRight = 30 + titleW;
                   }else{
                       make.top.mas_equalTo(listButton.mas_top).offset(0);
                       make.left.mas_equalTo(listButton.mas_right).offset(15);
                   }
               }else{
                   make.top.mas_equalTo(25);
                   make.left.mas_equalTo(10);
                   buttonRight = 30 + titleW;
               }
               make.size.mas_equalTo(CGSizeMake(titleW, 20));
           }];
           
           didLayout(^{
//                   button.bounds;
                NNHLog(@"button.frame:%f",button.frame.origin.y);
               CGFloat b_h = button.frame.origin.y;
               
               /** remark */
               [tagView mas_remakeConstraints:^(MASConstraintMaker *make) {
                   make.top.equalTo(self.view.mas_top).offset(120);
                   make.left.right.equalTo(self.view);
                   make.height.greaterThanOrEqualTo(@(b_h+30+10));
               }];
              });
           
           listButton = button;

       }
}

//ViewController.m
//定义一个C函数,用来简单封装一下dispatch_after
void didLayout(void(^layout)(void)) {
    dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(0 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
        if (layout) layout();
    });
}

- (CGSize)labelAutoCalculateRectWith:(NSString *)text FontSize:(CGFloat)fontSize MaxSize:(CGSize)maxSize {
    NSMutableParagraphStyle * paragraphStyle = [[NSMutableParagraphStyle alloc]init];
    paragraphStyle.lineBreakMode = NSLineBreakByWordWrapping;
    NSDictionary * attributes = @{NSFontAttributeName:[UIFont systemFontOfSize:fontSize], NSParagraphStyleAttributeName:paragraphStyle.copy};
    CGSize labelSize = [text boundingRectWithSize:maxSize options:NSStringDrawingUsesLineFragmentOrigin |NSStringDrawingUsesFontLeading | NSStringDrawingTruncatesLastVisibleLine attributes:attributes context:nil].size;
    labelSize.height = ceil(labelSize.height);
    labelSize.width = ceil(labelSize.width);
    return labelSize;
}

- (void )btnClicked:(UIButton *)btn{
    NSLog(@"%zd",btn.tag);
}

参考链接

相关文章

网友评论

    本文标题:iOS开发-云标签布局

    本文链接:https://www.haomeiwen.com/subject/sktmrktx.html