iOS 多個標籤動態排列

如上圖所示：

自訂標籤，自行排列，可控制邊距，行距，列舉，實現整齊的自由排列，話不多說，看代碼

//.m首頁面#import "ViewController.h"#import "TagsFrame.h"@interface ViewController (){    TagsFrame *_frame;    NSArray *_tagsArray;}@end@implementation ViewController- (void)viewDidLoad {    [super viewDidLoad];    _tagsArray = @[@"全部",@"哈哈哈哈哈哈",@"的點點滴滴多多",@"他啦啦啦啦啦啦",@"發哈幾個",@"鞥UNv",@"麓山國際後悔過",@"lllllldaffff",@"lalalalall",@"啦啦啦啦啦啦",@"喵喵嗎喵毛",@"囖囖囖囖大家開發及囖囖咯",@"安安",@"對對對",@"錯",@"初音MIKU",@"ANIMENZ哈哈哈哈哈哈哈",@"PENBEAT",@"OP",@"ILEM",@"原創",@"作業用BGM",@"打到車才",@"大衛反反覆複",@"BGM",@"LAUNCHPAD"];    _frame = [[TagsFrame alloc] init];    _frame.tagsArray = _tagsArray;    [self createSubView];}- (void)createSubView{    UIView *backView = [[UIView alloc] init];    backView.frame = CGRectMake(0, 64, self.view.frame.size.width, self.view.frame.size.height-64);    [self.view addSubview:backView];    for (NSInteger i=0; i< _tagsArray.count; i++) {        UIButton *tagsBtn = [UIButton buttonWithType:UIButtonTypeCustom];        [tagsBtn setTitle:_tagsArray[i] forState:UIControlStateNormal];        [tagsBtn setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];        tagsBtn.titleLabel.font = TagsTitleFont;        tagsBtn.backgroundColor = [UIColor whiteColor];        tagsBtn.layer.borderWidth = 1;        tagsBtn.layer.borderColor = [UIColor lightGrayColor].CGColor;        tagsBtn.layer.cornerRadius = 4;        tagsBtn.layer.masksToBounds = YES;        tagsBtn.frame = CGRectFromString(_frame.tagsFrames[i]);        [backView addSubview:tagsBtn];    }}@end

//標籤frame封裝#import <Foundation/Foundation.h>#import <UIKit/UIKit.h>#define WIDTH [UIScreen mainScreen].bounds.size.width#define HEIGHT [UIScreen mainScreen].bounds.size.height#define TagsTitleFont [UIFont systemFontOfSize:13]@interface TagsFrame : NSObject/** 標籤名字數組 */@property (nonatomic, strong) NSArray *tagsArray;/** 標籤frame數組 */@property (nonatomic, strong) NSMutableArray *tagsFrames;/** 全部標籤的高度 */@property (nonatomic, assign) CGFloat tagsHeight;/** 標籤間距 default is 10*/@property (nonatomic, assign) CGFloat tagsMargin;/** 標籤行間距 default is 10*/@property (nonatomic, assign) CGFloat tagsLineSpacing;/** 標籤最小內邊距 default is 10*/@property (nonatomic, assign) CGFloat tagsMinPadding;@end

//  計算多個標籤的位置//  標籤根據文字自適應寬度//  每行超過的寬度平均分配給每個標籤//  每列標籤左右對其#import "TagsFrame.h"@implementation TagsFrame- (id)init{    //初始化    self = [super init];    if (self) {        _tagsFrames = [NSMutableArray array];        _tagsMinPadding = 10;        _tagsMargin = 10;        _tagsLineSpacing = 10;    }    return self;}- (void)setTagsArray:(NSArray *)tagsArray{    _tagsArray = tagsArray;    CGFloat btnX = _tagsMargin;    CGFloat btnW = 0;    CGFloat nextWidth = 0;  // 下一個標籤的寬度    CGFloat moreWidth = 0;  // 每一行多出來的寬度    //每一行的最後一個tag的索引的數組和每一行多出來的寬度的數組    NSMutableArray *lastIndexs = [NSMutableArray array];    NSMutableArray *moreWidths = [NSMutableArray array];    for (NSInteger i=0; i<tagsArray.count; i++) {        btnW = [self sizeWithText:tagsArray[i] font:TagsTitleFont].width + _tagsMinPadding * 2;        if (i < tagsArray.count-1) {            nextWidth = [self sizeWithText:tagsArray[i+1] font:TagsTitleFont].width + _tagsMinPadding * 2;        }        CGFloat nextBtnX = btnX + btnW + _tagsMargin;        // 如果下一個按鈕，標籤最右邊則換行        if ((nextBtnX + nextWidth) > (WIDTH - _tagsMargin)) {            // 計算超過的寬度            moreWidth = WIDTH - nextBtnX;            [lastIndexs addObject:[NSNumber numberWithInteger:i]];            [moreWidths addObject:[NSNumber numberWithFloat:moreWidth]];            btnX = _tagsMargin;        }else{            btnX += (btnW + _tagsMargin);        }        // 如果是最後一個且數組中沒有，則把最後一個加入數組        if (i == tagsArray.count -1) {            if (![lastIndexs containsObject:[NSNumber numberWithInteger:i]]) {                [lastIndexs addObject:[NSNumber numberWithInteger:i]];                [moreWidths addObject:[NSNumber numberWithFloat:0]];            }        }    }    NSInteger location = 0;  // 截取的位置    NSInteger length = 0;    // 截取的長度    CGFloat averageW = 0;    // 多出來的平均的寬度    CGFloat tagW = 0;    CGFloat tagH = 30;    for (NSInteger i=0; i<lastIndexs.count; i++) {        NSInteger lastIndex = [lastIndexs[i] integerValue];        if (i == 0) {            length = lastIndex + 1;        }else{            length = [lastIndexs[i] integerValue]-[lastIndexs[i-1] integerValue];        }        // 從數組中截取每一行的數組        NSArray *newArr = [tagsArray subarrayWithRange:NSMakeRange(location, length)];        location = lastIndex + 1;        averageW = [moreWidths[i] floatValue]/newArr.count;        CGFloat tagX = _tagsMargin;        CGFloat tagY = _tagsLineSpacing + (_tagsLineSpacing + tagH) * i;        for (NSInteger j=0; j<newArr.count; j++) {            tagW = [self sizeWithText:newArr[j] font:TagsTitleFont].width + _tagsMinPadding * 2 + averageW;            CGRect btnF = CGRectMake(tagX, tagY, tagW, tagH);            [_tagsFrames addObject:NSStringFromCGRect(btnF)];            tagX += (tagW+_tagsMargin);        }    }    _tagsHeight = (tagH + _tagsLineSpacing) * lastIndexs.count + _tagsLineSpacing;}/** *  單行文本資料擷取寬高 * *  @param text 文本 *  @param font 字型 * *  @return 寬高 */- (CGSize)sizeWithText:(NSString *)text font:(UIFont *)font{    NSDictionary *attrs = @{NSFontAttributeName : font};    return [text sizeWithAttributes:attrs];}@end