前言

1、之前项目中会有一些标签列表来显示某些特性或要求，如下图（代码实现后的效果）:

2、期间也是浏览了好多其他的第三方，但是可能是没找到好的方法去寻找吧，没有找到一个合适的，况且又不是特别复杂的东西，所以就自己写了一套，但是注意因为我们项目中使用的是rac+mansory,所以想要使用的话需要引入这两个库=_=。

3、自己写的时候考虑的不是太多，中心思想是viewmodel做定制需求，view通过viewmodel来实现定制化ui，其他更多的是逻辑上的排版，所以不做更多赘述，自己体会y^o^y 。

view布局

lslabeltextview.h的实现

? 1 2 3 4 5 6 7 8 9 10 11 12 13 // // lslabeltextview.h // rencheren // // created by 王隆帅 on 15/12/30. // copyright © 2015年 王隆帅. all rights reserved. // #import "ycview.h" @interface lslabeltextview : ycview @end

lslabeltextview.m的实现

? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 // // lslabeltextview.m // rencheren // // created by 王隆帅 on 15/12/30. // copyright © 2015年 王隆帅. all rights reserved. // #import "lslabeltextview.h" #import "lslabeltextviewmodel.h" @interface lslabeltextview () @property (nonatomic, strong) lslabeltextviewmodel *viewmodel; @end @implementation lslabeltextview { masconstraint *_toleftbtnmasconstraint; masconstraint *_totopbtnmasonstraint; masconstraint *_toleftselfmasconstraint; masconstraint *_totopselfmasonstraint; } - (instancetype)initwithviewmodel:(id<ycviewmodelprotocol>)viewmodel { self.viewmodel = (lslabeltextviewmodel *)viewmodel; return [super initwithviewmodel:viewmodel]; } - (void)yc_bindviewmodel { @weakify(self); [[racobserve(self, viewmodel.dataarray) distinctuntilchanged] subscribenext:^(id x) { @strongify(self); [self.subviews makeobjectsperformselector:@selector(removefromsuperview)]; if (self.viewmodel.dataarray.count <= 0) { __weak uiview *weaknullview; uiview *nullview = [[uiview alloc] init]; weaknullview = nullview; [self addsubview:weaknullview]; ws(weakself) [weaknullview mas_makeconstraints:^(masconstraintmaker *make) { make.top.right.left.bottom.equalto(weakself); make.height.equalto(weakself.viewmodel.nullheight); }]; return; } nsinteger linenum = 1; cgfloat allwidth = 0; __weak uibutton *lastbtn; for (int i = 0; i < self.viewmodel.dataarray.count; i++) { nsstring *string = [self.viewmodel.dataarray stringwithindex:i]; __weak uibutton *weakbtn = [self ls_getbtnwithstring:string]; [self addsubview:weakbtn]; cgsize size = [string widthwithheight:20 andfont:self.viewmodel.textfontnum]; cgfloat needfloat = size.width < self.viewmodel.miniwidth ? self.viewmodel.miniwidth : size.width; if (lastbtn) { ws(weakself) [weakbtn mas_makeconstraints:^(masconstraintmaker *make) { _toleftbtnmasconstraint = make.left.equalto(lastbtn.mas_right).offset(weakself.viewmodel.labelhorizontalspace); [_toleftbtnmasconstraint activate]; _totopbtnmasonstraint = make.top.equalto(lastbtn.mas_bottom).offset(weakself.viewmodel.labelverticalspace); [_totopbtnmasonstraint deactivate]; _toleftselfmasconstraint = make.left.equalto(weakself.viewmodel.lefttoviewedge); _totopselfmasonstraint = make.top.equalto(lastbtn); make.size.equalto(cgsizemake(needfloat + 20, weakself.viewmodel.labelheight)); }]; if (allwidth + self.viewmodel.labelhorizontalspace + needfloat + 20 + self.viewmodel.righttoviewedge > self.viewmodel.allwidth) { [_toleftselfmasconstraint activate]; [_toleftbtnmasconstraint deactivate]; [_totopbtnmasonstraint activate]; [_totopselfmasonstraint deactivate]; linenum ++; allwidth = self.viewmodel.lefttoviewedge + needfloat + 20; } else { [_toleftselfmasconstraint deactivate]; [_toleftbtnmasconstraint activate]; [_totopbtnmasonstraint deactivate]; [_totopselfmasonstraint activate]; allwidth = allwidth + self.viewmodel.labelhorizontalspace + needfloat + 20; } } else { ws(weakself) [weakbtn mas_makeconstraints:^(masconstraintmaker *make) { make.left.equalto(weakself.viewmodel.lefttoviewedge); make.size.equalto(cgsizemake(needfloat + 20, weakself.viewmodel.labelheight)); make.top.equalto(weakself.viewmodel.toptoviewedge); }]; allwidth = allwidth + self.viewmodel.lefttoviewedge + needfloat + 20; } lastbtn = weakbtn; } ws(weakslef) [lastbtn mas_updateconstraints:^(masconstraintmaker *make) { make.bottom.equalto(weakslef.viewmodel.bottomtoviewedge); }]; }]; } - (uibutton *)ls_getbtnwithstring:(nsstring *)string { uibutton *btn = [uibutton buttonwithtype:uibuttontypecustom]; btn.layer.borderwidth = 0.5; btn.layer.bordercolor = self.viewmodel.bordercolor.cgcolor; [btn settitlecolor:self.viewmodel.titlecolor forstate:uicontrolstatenormal]; btn.backgroundcolor = self.viewmodel.backgroundcolor; btn.layer.maskstobounds = yes; btn.layer.cornerradius = self.viewmodel.cornerradius; btn.titlelabel.font = yc_yahei_font(self.viewmodel.textfontnum); [btn settitle:string forstate:uicontrolstatenormal]; btn.ls_typestring = string; return btn; } @end

viewmodel适配

lslabeltextviewmodel.h的实现

? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 // // lslabeltextviewmodel.h // rencheren // // created by 王隆帅 on 15/12/30. // copyright © 2015年 王隆帅. all rights reserved. // #import "ycviewmodel.h" @interface lslabeltextviewmodel : ycviewmodel /** * 标签数组 */ @property (nonatomic, strong) nsmutablearray *dataarray; /** * 总的宽度 */ @property (nonatomic, assign) cgfloat allwidth; /** * 没有标签时的高度 */ @property (nonatomic, assign) cgfloat nullheight; /** * 文字字体大小 */ @property (nonatomic, assign) cgfloat textfontnum; /** * 取得标签为空的时候，标签最小长度 */ @property (nonatomic, assign) cgfloat miniwidth; /** * 标签高度 */ @property (nonatomic, assign) cgfloat labelheight; /** * 最左侧标签距离view的边缘的宽度 */ @property (nonatomic, assign) cgfloat lefttoviewedge; /** * 最右侧标签距离view的边缘的宽度 */ @property (nonatomic, assign) cgfloat righttoviewedge; /** * 最上侧标签距离view的边缘的宽度 */ @property (nonatomic, assign) cgfloat toptoviewedge; /** * 最下侧标签距离view的边缘的宽度 */ @property (nonatomic, assign) cgfloat bottomtoviewedge; /** * 横向标签之间的宽度 */ @property (nonatomic, assign) cgfloat labelhorizontalspace; /** * 纵向标签之间的宽度 */ @property (nonatomic, assign) cgfloat labelverticalspace; /** * label(btn) 的相关属性 */ @property (nonatomic, assign) cgfloat borderwidth; @property (nonatomic, strong) uicolor *bordercolor; @property (nonatomic, strong) uicolor *titlecolor; @property (nonatomic, strong) uicolor *backgroundcolor; @property (nonatomic, assign) cgfloat cornerradius; @end

lslabeltextviewmodel.m的实现

? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 // // lslabeltextviewmodel.m // rencheren // // created by 王隆帅 on 15/12/30. // copyright © 2015年 王隆帅. all rights reserved. // #import "lslabeltextviewmodel.h" @implementation lslabeltextviewmodel - (nsmutablearray *)dataarray { if (!_dataarray) { _dataarray = [[nsmutablearray alloc] init]; } return _dataarray; } @end

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持服务器之家。

原文链接：http://www.jianshu.com/p/db3ead7a8d31#