?? 使用 ZZFLEX 框架的模版代碼挡毅。
命令式的列表控制器:ZZFLEXAngel
初始化 Angle
// tableView
UITableView *tableView = self.view.addTableView(0).view;
ZZFLEXAngel *angel = [[ZZFLEXAngel alloc] initWithHostView:tableView];
// collectionView
UICollectionView *collectionView = self.view.addCollectionView(1).view;
ZZFLEXAngel *angel2 = [[ZZFLEXAngel alloc] initWithHostView:collectionView];
頁(yè)面容器層(hostView)
- (void)reloadListUI
{
// 清空所有數(shù)據(jù)
self.clear();
// 添加section 1
{
// section 標(biāo)識(shí)
NSInteger sectionType = 1;
/*
添加section
sectionInsets: section邊距
minimumLineSpacing: 行間距
minimumInteritemSpacing: 列間距
*/
self.angel.addSection(sectionType).sectionInsets(UIEdgeInsetsMake(15, 15, 15, 15)).minimumLineSpacing(15).minimumInteritemSpacing(15);
/// 設(shè)置section header,footer亦然
self.angel.setHeader([UICollectionReusableView class]).toSection(sectionType);
/*
往section添加cell
withDataModel:cell數(shù)據(jù)模型
selectedAction:cell點(diǎn)擊事件
eventAction: cell內(nèi)部事件,業(yè)務(wù)方自行設(shè)置和調(diào)用溉愁,eventType為事件類型草娜、model是事件數(shù)據(jù)
viewTag: cell標(biāo)識(shí)羞迷,便于調(diào)試,或用于查找定位或作為插入其他cell的錨點(diǎn)
*/
self.angel.addCell([UICollectionViewCell class]).toSection(sectionType).withDataModel(@"hello")
.selectedAction(^ (id model) {
NSLog(@"cell 點(diǎn)擊事件");
})
.eventAction(^ id(NSInteger eventType, id model) {
NSLog(@"cell 內(nèi)部事件萝招,類型:%ld, 模型: %@", eventType, model);
return nil;
})
.viewTag(10001);
/*
往section批量添加cell
withDataModelArray:cell數(shù)據(jù)模型數(shù)組,cell個(gè)數(shù)由數(shù)組元素個(gè)數(shù)決定
delegate:為cell設(shè)置代理
*/
self.angel.addCells([UICollectionViewCell class]).toSection(sectionType).withDataModelArray(@[@"1", @"2", @"3"])
.selectedAction(^ (id model) {
NSLog(@"cell 點(diǎn)擊事件存捺,數(shù)據(jù)模型為:%@", model);
}).delegate(self);
}
// 刷新數(shù)據(jù)
[self.angel reloadView];
}
元素層
/**
* 所有要加入 ZZFLEXAngel槐沼、ZZFLEX*ViewController 的 view/cell 都要實(shí)現(xiàn)此協(xié)議
*
* 除獲取大小/高度兩個(gè)方法需要二選一之外,其余都可按需選擇實(shí)現(xiàn)
*/
@protocol ZZFlexibleLayoutViewProtocol <NSObject>
@optional;
/**
* 獲取cell/view大小召噩,與viewHeightByDataModel二選一
* 僅 CollectionView 可選擇使用
*
* 調(diào)用時(shí)機(jī):添加到ZZFlexibleLayoutViewController或ZZFLEXAngel時(shí)母赵,如實(shí)現(xiàn)僅調(diào)用一次后,大小會(huì)緩存在ViewModel中具滴。
* 其他:如需更新視圖大小凹嘲,需手動(dòng)調(diào)用update方法
* 小Tips:0至-1表示比例,如size.width=-0.5時(shí)构韵,表示視圖的寬度為列表寬度的50%
*/
+ (CGSize)viewSizeByDataModel:(id)dataModel;
/**
* 獲取cell/view高度周蹭,與viewSizeByDataModel二選一
* CollectionView、TableView 均可選擇使用
*
* 調(diào)用時(shí)機(jī):添加到ZZFlexibleLayoutViewController或ZZFLEXAngel時(shí)疲恢,如實(shí)現(xiàn)僅調(diào)用一次后凶朗,高度會(huì)緩存在ViewModel中。
* 其他:如需更新視圖高度显拳,需手動(dòng)調(diào)用update方法
* 小Tips:CollectionView也可用此方法棚愤,寬度默認(rèn)為-1,即列表寬度
*/
+ (CGFloat)viewHeightByDataModel:(id)dataModel;
/**
* 設(shè)置cell/view的數(shù)據(jù)源
*
* 調(diào)用時(shí)機(jī):cellForRowAtIndexPath或者cellForItemAtIndexPath,如實(shí)現(xiàn)每次都會(huì)調(diào)用
* 小Tips:如果模型未變化時(shí)不需要更新UI宛畦,建議在此方法執(zhí)行時(shí)做判斷直接return
*/
- (void)setViewDataModel:(id)dataModel;
/**
* 設(shè)置cell/view的delegate對(duì)象
*
* 調(diào)用時(shí)機(jī):cellForRowAtIndexPath或者cellForItemAtIndexPath瘸洛,如實(shí)現(xiàn)每次都會(huì)調(diào)用
*/
- (void)setViewDelegate:(id)delegate;
/**
* 設(shè)置cell/view的actionBlock
*
* 調(diào)用時(shí)機(jī):cellForRowAtIndexPath或者cellForItemAtIndexPath,如實(shí)現(xiàn)每次都會(huì)調(diào)用
*/
- (void)setViewEventAction:(id (^)(NSInteger actionType, id data))eventAction;
/**
* 當(dāng)前視圖的indexPath次和,所在section元素?cái)?shù)(目前僅cell調(diào)用)
*
* 調(diào)用時(shí)機(jī):cellForRowAtIndexPath或者cellForItemAtIndexPath反肋,如實(shí)現(xiàn)每次都會(huì)調(diào)用
* 小Tips:可用于UI差異化設(shè)置等,不建議cell持有indexPath踏施,因?yàn)榭赡軙?huì)經(jīng)常變
*/
- (void)onViewPositionUpdatedWithIndexPath:(NSIndexPath *)indexPath sectionItemCount:(NSInteger)count;
@end
Foundation 擴(kuò)展
/// 創(chuàng)建style
NSMutableParagraphStyle *style = NSMutableParagraphStyle.zz_create.lineSpacing(5).paragraphSpacing(20).alignment(NSTextAlignmentCenter).lineBreakMode(NSLineBreakByWordWrapping).object;
/// 編輯style(整段縮進(jìn)石蔗、右側(cè)縮進(jìn)或顯示寬度)
style.zz_setup.headIndent(20).tailIndent(20);
/// 創(chuàng)建富文本
NSMutableAttributedString *attrStr = NSMutableAttributedString.zz_create(@"富文本字符串").backgroundColor([UIColor redColor]).font([UIFont systemFontOfSize:32]).foregroundColor([UIColor redColor]).object;
/// 編輯富文本(拼接圖片、字符串畅形、富文本等)
attrStr.zz_setup.paragraphStyle(style).appendString(@"拼接字符串").appendImage([UIImage imageNamed:@"要拼接的圖片名稱.png"], CGRectMake(0, 0, 20, 20));
/// 設(shè)置富文本屬性(帶range)
attrStr.zz_setup.fontWithRange([UIFont boldSystemFontOfSize:12], NSMakeRange(0, 10)).foregroundColorWithRange([UIColor blueColor], NSMakeRange(0, 10));
UIView 擴(kuò)展:分割線养距、圓角
/*
添加分割線
type:支持top、bottom束亏、left铃在、right、centerX碍遍、centerY定铜,同一view可執(zhí)行多個(gè)addSeparatorz操作
beginAt:開始位置偏移,默認(rèn)0
endAt: 結(jié)束位置偏移怕敬,默認(rèn)0揣炕;也可設(shè)置length屬性代替
offset: 具type類型偏移,默認(rèn)0(-10為距離底端10)
*/
self.view.addSeparator(ZZSeparatorPositionTop).color([UIColor grayColor]).beginAt(15).endAt(-15).offset(-10);
self.view.removeSeparator(ZZSeparatorPositionTop);
/*
設(shè)置圓角
cornor: 支持topLeft东跪、topRight畸陡、bottomLeft、bottomRight虽填、top丁恭、bottom、left斋日、right牲览、all,支持邏輯或
*/
self.view.setCornor(ZZCornerPositionLeft | ZZCornerPositionTop).radius(5.0f).color([UIColor grayColor]).borderWidth(1);
self.view.removeCornor();
UIView 擴(kuò)展:UIButton
UIButton *button = self.view.addButton(1)
// 設(shè)置字體恶守,各狀態(tài)字色第献、背景色
.titleFont([UIFont systemFontOfSize:12])
.titleColor([UIColor blackColor]).titleColorHL([UIColor redColor]).titleColorDisabled([UIColor grayColor])
.backgroundColor([UIColor whiteColor]).backgroundColorHL([UIColor yellowColor])
// 設(shè)置圓角、陰影
.cornerRadius(5.0f).shadow(CGSizeZero, 5.0f, [UIColor grayColor], 1.0)
// 設(shè)置事件
.eventTouchDown(^ (UIButton *sender) {
NSLog(@"touch down");
})
.eventTouchUpInside(^ (UIButton *sender) {
NSLog(@"touch inside");
})
// 設(shè)置約束(Masonry)
.masonry(^ (UIButton *sender, MASConstraintMaker *make) {
make.left.top.mas_equalTo(0);
make.size.mas_equalTo(CGSizeMake(80, 30));
})
.view;
// 編輯控件的屬性
button.zz_setup.title(@"hello").titleFont([UIFont boldSystemFontOfSize:32]);
// 單獨(dú)創(chuàng)建一個(gè)控件兔港,而不添加到視圖上
UIButton *button = UIButton.zz_create(1001).title(@"hello").titleHL(@"world").view;
UIView 擴(kuò)展:UIImage
// 右側(cè)箭頭圖片
self.contentView.addImageView(2)
.image([UIImage imageNamed:@"arrow"])
.masonry(^(UIView *senderView, MASConstraintMaker *make) {
make.right.mas_equalTo(-15);
make.centerY.mas_equalTo(0);
});
UIView 擴(kuò)展:UILabel
self.titleLabel = self.contentView.addLabel(1)
.font([UIFont boldSystemFontOfSize:16])
.textColor([UIColor blackColor])
.masonry(^(UIView *senderView, MASConstraintMaker *make) {
make.left.mas_equalTo(15);
make.centerY.mas_equalTo(0);
make.right.mas_lessThanOrEqualTo(-35);
})
.view;