ios开发瀑布流框架的应用

一：瀑布流框架的应用：将封装好的瀑布流框架导入，遵守协议

二：代码：

#import "HMShopsViewController.h"
#import "HMShopCell.h"
#import "HMWaterflowView.h"
#import "HMShop.h"
#import "MJExtension.h"
#import "MJRefresh.h"

@interface HMShopsViewController ()<HMWaterflowViewDataSource, HMWaterflowViewDelegate>
@property (nonatomic, strong) NSMutableArray *shops;
@property (nonatomic, weak) HMWaterflowView *waterflowView;
@end

@implementation HMShopsViewController

- (NSMutableArray *)shops
{
    if (_shops == nil) {
        self.shops = [NSMutableArray array];
    }
    return _shops;
}

- (void)viewDidLoad
{
    [super viewDidLoad];
    
    // 0.初始化数据
    NSArray *newShops = [HMShop objectArrayWithFilename:@"2.plist"];
    [self.shops addObjectsFromArray:newShops];
    
    // 1.瀑布流控件
    HMWaterflowView *waterflowView = [[HMWaterflowView alloc] init];
    waterflowView.backgroundColor = [UIColor redColor];
    // 跟随着父控件的尺寸而自动伸缩
    waterflowView.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth;
    waterflowView.frame = self.view.bounds;
    waterflowView.dataSource = self;
    waterflowView.delegate = self;
    [self.view addSubview:waterflowView];
    self.waterflowView = waterflowView;
    
    // 2.继承刷新控件
//    [waterflowView addFooterWithCallback:^{
//        NSLog(@"进入上拉加载状态");
//    }];
    
//    [waterflowView addHeaderWithCallback:^{
//        NSLog(@"进入下拉加载状态");
    //    }];
    
    [waterflowView addHeaderWithTarget:self action:@selector(loadNewShops)];
    [waterflowView addFooterWithTarget:self action:@selector(loadMoreShops)];
}

- (void)didRotateFromInterfaceOrientation:(UIInterfaceOrientation)fromInterfaceOrientation
{
//    NSLog(@"屏幕旋转完毕");
    [self.waterflowView reloadData];
}

- (void)loadNewShops
{
    static dispatch_once_t onceToken;
    dispatch_once(&onceToken, ^{
        // 加载1.plist
        NSArray *newShops = [HMShop objectArrayWithFilename:@"1.plist"];
        [self.shops insertObjects:newShops atIndexes:[NSIndexSet indexSetWithIndexesInRange:NSMakeRange(0, newShops.count)]];
    });
    
    dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(2.0 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
        // 刷新瀑布流控件
        [self.waterflowView reloadData];
        
        // 停止刷新
        [self.waterflowView headerEndRefreshing];
    });
}

- (void)loadMoreShops
{
    static dispatch_once_t onceToken;
    dispatch_once(&onceToken, ^{
        // 加载3.plist
        NSArray *newShops = [HMShop objectArrayWithFilename:@"3.plist"];
        [self.shops addObjectsFromArray:newShops];
    });
    
    dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(2.0 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
        
        // 刷新瀑布流控件
        [self.waterflowView reloadData];
        
        // 停止刷新
        [self.waterflowView footerEndRefreshing];
    });
}

#pragma mark - 数据源方法
- (NSUInteger)numberOfCellsInWaterflowView:(HMWaterflowView *)waterflowView
{
    return self.shops.count;
}

- (HMWaterflowViewCell *)waterflowView:(HMWaterflowView *)waterflowView cellAtIndex:(NSUInteger)index
{
    HMShopCell *cell = [HMShopCell cellWithWaterflowView:waterflowView];
    
    cell.shop = self.shops[index];
    
    return cell;
}

- (NSUInteger)numberOfColumnsInWaterflowView:(HMWaterflowView *)waterflowView
{
    if (UIInterfaceOrientationIsPortrait(self.interfaceOrientation)) {
        // 竖屏
        return 3;
    } else {
        return 5;
    }
}

#pragma mark - 代理方法
- (CGFloat)waterflowView:(HMWaterflowView *)waterflowView heightAtIndex:(NSUInteger)index
{
    HMShop *shop = self.shops[index];
    // 根据cell的宽度 和 图片的宽高比 算出 cell的高度
    return waterflowView.cellWidth * shop.h / shop.w;
}
@end

知识点分析：1:利用MJEXtension将plist文件转化成模型数组：NSArray *newShops = [HMShop objectArrayWithFilename:@"2.plist"]; [self.shops addObjectsFromArray:newShops];2：向数据源中添加数据：addObjectsFromArray , insertObject atIndexes :NSArray *newShops = [HMShop objectArrayWithFilename:@"1.plist"]; [self.shops insertObjects:newShops atIndexes:[NSIndexSet indexSetWithIndexesInRange:NSMakeRange(0, newShops.count)]];

2:监听屏幕的旋转：在控制器中实现didRotateFromInterfaceOrientation，可以实现对屏幕旋转的监听，此时设置waterFlow的autoresizingMask属性，设置其宽高随父视图宽高自由伸缩，waterflowView.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth;在返回列数的代理方法中，根据屏幕的方向，来确定列数

 if (UIInterfaceOrientationIsPortrait(self.interfaceOrientation)) {

        // 竖屏

        return 3;

    } else {

        return 5;

    }

3：MJRefresh:添加上拉刷新，下拉加载更多。两种方法1：block回调的方式 2：addTarget 方式来添加 。停止刷新：

 [self.waterflowView headerEndRefreshing];

 [self.waterflowView footerEndRefreshing];

4：GCD执行一次函数：

   static dispatch_once_t onceToken;

    dispatch_once(&onceToken, ^{

        // 加载3.plist

        NSArray *newShops = [HMShop objectArrayWithFilename:@"3.plist"];

        [self.shops addObjectsFromArray:newShops];

    });

 5:在返回cell高度的方法中：要根据cell的宽度 和 图片的宽高比 算出 cell的高度。

     HMShop *shop = self.shops[index];

    // 根据cell的宽度 和 图片的宽高比 算出 cell的高度

    return waterflowView.cellWidth * shop.h / shop.w;

6：cell的封装

#import "HMWaterflowViewCell.h"
@class HMWaterflowView, HMShop;

@interface HMShopCell : HMWaterflowViewCell
+ (instancetype)cellWithWaterflowView:(HMWaterflowView *)waterflowView;

@property (nonatomic, strong) HMShop *shop;
@end

#import "HMShopCell.h"
#import "HMWaterflowView.h"
#import "UIImageView+WebCache.h"
#import "HMShop.h"

@interface HMShopCell()
@property (weak, nonatomic) UIImageView *imageView;
@property (weak, nonatomic) UILabel *priceLabel;
@end

@implementation HMShopCell


+ (instancetype)cellWithWaterflowView:(HMWaterflowView *)waterflowView
{
    static NSString *ID = @"SHOP";
    HMShopCell *cell = [waterflowView dequeueReusableCellWithIdentifier:ID];
    if (cell == nil) {
        cell = [[HMShopCell alloc] init];
        cell.identifier = ID;
    }
    return cell;
}

- (id)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        
        UIImageView *imageView = [[UIImageView alloc] init];
        [self addSubview:imageView];
        self.imageView = imageView;
        
        UILabel *priceLabel = [[UILabel alloc] init];
        priceLabel.backgroundColor = [UIColor colorWithRed:0 green:0 blue:0 alpha:0.3];
        priceLabel.textAlignment = NSTextAlignmentCenter;
        priceLabel.textColor = [UIColor whiteColor];
        [self addSubview:priceLabel];
        self.priceLabel = priceLabel;
    }
    return self;
}

- (void)setShop:(HMShop *)shop
{
    _shop = shop;
    
    self.priceLabel.text = shop.price;
    [self.imageView sd_setImageWithURL:[NSURL URLWithString:shop.img] placeholderImage:[UIImage imageNamed:@"loading"]];
}

- (void)layoutSubviews
{
    [super layoutSubviews];
    
    self.imageView.frame = self.bounds;
    
    CGFloat priceX = 0;
    CGFloat priceH = 25;
    CGFloat priceY = self.bounds.size.height - priceH;
    CGFloat priceW = self.bounds.size.width;
    self.priceLabel.frame = CGRectMake(priceX, priceY, priceW, priceH);
}

@end

7：model的封装

#import <Foundation/Foundation.h>

@interface HMShop : NSObject
@property (nonatomic, assign) CGFloat w;
@property (nonatomic, assign) CGFloat h;
@property (nonatomic, copy) NSString *img;
@property (nonatomic, copy) NSString *price;
@end

#import "HMShop.h"

@implementation HMShop

@end