自定义瀑布流控件的流程完全是仿照系统控件UITableView进行的。
我们知道UITableView控件向外界展示出来,需要询问它的的数据源代理对象三个问题:
1> 自己有多少个分区;
2> 每个分区有多少行;
3> 每一行显示什么类型的tableViewCell.
这就是所谓的三问,数据源代理对象回答完这三个问题之后,tableView就知道自身的整体构造,然后按照要求显示出来.
按照这个思路,我们来自定义一个瀑布流控件:
要点1:waterFlowView:UIScrollView 自定义控件继承自滚动视图
WaterFlowView.h
#import <UIKit/UIKit.h>
/** cell的各种不同的内边距以枚举的形式全部列举出来 */
typedef enum{
WaterFlowViewForMarginTypeTop,
WaterFlowViewForMarginTypeBottom,
WaterFlowViewForMarginTypeLeft,
WaterFlowViewForMarginTypeRight,//前面四种是cell与父控件之间的边距
WaterFlowViewForMarginTypeRow,
WaterFlowViewForMarginTypeColum,//后面两种是cell与cell之间的边距
}WaterFlowViewForMarginType;
@class WaterFlowView;
@class WaterFlowViewCell;
/** 数据源协议 */
@protocol WaterFlowViewDataSource <NSObject>
@required
//有多少cell
- (NSUInteger)numberOfCellsInWaterFlowView:(WaterFlowView*)waterView;
//指定位置显示什么类型的cell
- (WaterFlowViewCell*)waterFlowView:(WaterFlowView*)waterFlowView cellAtIndex:(NSUInteger)index;
@optional
//有多少列(默认显示3列)
- (NSUInteger)numberColumsInWaterFlowView:(WaterFlowView*)waterFlowView;
@end
/** 代理协议 */
@protocol WaterFlowViewDelegate <UIScrollViewDelegate>
@optional
//指定位置的cell的显示高度
- (CGFloat)waterFlowView:(WaterFlowView*)waterFlowView heightAtIndex:(NSUInteger)index;
//点击指定位置的cell触发
- (void)waterFlowView:(WaterFlowView*)waterFlowView didSelectedAtIndex:(NSUInteger)index;
//返回cell的各种内边距
- (CGFloat)waterFlowView:(WaterFlowView *)waterFlowView marginForType:(WaterFlowViewForMarginType)type;
@end
@interface WaterFlowView : UIScrollView
@property(nonatomic,weak)id<WaterFlowViewDataSource> dataSource;
@property(nonatomic,weak)id<WaterFlowViewDelegate> delegate1;
/** 刷新界面数据 */
- (void)reloadData;
[刷新的要点](http://img.blog.csdn.net/20151128185716046)
@end
WaterViewFlow.m
#import "WaterFlowView.h"
#import "WaterFlowViewCell.h"
#define waterFlowViewDefaultNumberOfColums 3;
#define waterFlowViewDefaultMargin 10;
#define waterFlowViewDefaultCellHeight 75;
@interface WaterFlowView ()</