標(biāo)簽列表 .png
最后做成的效果就是上圖
要實(shí)現(xiàn)上面這種效果圖 有許多方法，例如for循環(huán)創(chuàng)建， for in 遍歷，集合視圖也可以，這里采用的是遍歷方法。
寫這個的主要問題有兩個需要解決
第一個：是否超過父視圖的右邊界判斷
第二個：超過邊界換行展示
問題的解決都在代碼里面了
CGFloat tagsTotalWidth = 0;
CGFloat tagsTotalHeigh = 0;
CGFloat tagHeight = 0;
for (NSString *str in tagArray) {
UILabel *label = [[UILabel alloc]initWithFrame:CGRectMake(tagsTotalWidth, tagsTotalHeigh, 0, 0)];
label.font = [UIFont systemFontOfSize:12];
label.textAlignment = NSTextAlignmentCenter;
label.layer.cornerRadius = 2;
label.layer.borderWidth = 0.5;
label.layer.borderColor = [UIColor colorWithRed:153/255.0 green:153/255.0 blue:153/255.0 alpha:1].CGColor;
label.text = str;
label.textColor = [UIColor colorWithRed:153/255.0 green:153/255.0 blue:153/255.0 alpha:1];
[label sizeToFit];
label.frame = CGRectMake(tagsTotalWidth, tagsTotalHeigh, CGRectGetWidth(label.frame) + 4, CGRectGetHeight(label.frame)+2);
tagsTotalWidth += CGRectGetWidth(label.frame)+4;
tagHeight = CGRectGetHeight(label.frame);
if (tagsTotalWidth > self.frame.size.width) {
tagsTotalHeigh += CGRectGetHeight(label.frame) + 4;
tagsTotalWidth = 0;
label.frame = CGRectMake(tagsTotalWidth, tagsTotalHeigh, CGRectGetWidth(label.frame) + 4, CGRectGetHeight(label.frame));
tagsTotalWidth += CGRectGetWidth(label.frame)+4;
}
// CGFloat a = CGRectGetHeight(label.frame);
// NSLog(@"%f",a);
[self addSubview:label];
}
tagsTotalHeigh += tagHeight;
self.frame = CGRectMake(self.frame.origin.x, self.frame.origin.y, self.frame.size.width, tagsTotalHeigh);
對于這一行代碼
label.frame = CGRectMake(tagsTotalWidth, tagsTotalHeigh, CGRectGetWidth(label.frame) + 4, CGRectGetHeight(label.frame)+2);
里面的寬高分別+4，+2是為了label里面的字體不會和label的邊界挨得太緊，可自行選擇
附上小Demo：https://git.oschina.net/T1_mine/TagsView.git
