IOS开发之瀑布流和下拉刷新上拉加载实现

效果图： 

视图的层次结构

self.view --->AOWaterView(继承UIScrollView)--->v1,v2,v3(继承UIView) --->MessView(继承UIView)

--->UrlImageButton(继承UIButton，图片作为button的背景图片显示)

类的说明：

AOWaterView 继承UIScrollView，能够上下滑动，显示瀑布流。

MessView 继承UIView，图片显示在此视图中。

DataInfo 数据Model类

DataAccess 用于读取plist文件

主要实现代码：

1、读取dataList.plist中的数据，并保存到定义好的Model中，然后把Model存到一个数组中。初始化DataAccess

[objc] view plaincopy

//初始化  

- (void)viewDidLoad  

{  

    [super viewDidLoad];  

    //创建DataAccess对象，用来读取dataList.plist中的数据  

    DataAccess *dataAccess= [[DataAccess alloc]init];  

    //获取图片Model，加入数组  

    NSMutableArray *dataArray = [dataAccess getDateArray];  

    self.aoView = [[AOWaterView alloc]initWithDataArray:dataArray];  

    self.aoView.delegate=self;  

    [self.view addSubview:self.aoView];  

}  

读取数据

[objc] view plaincopy

-(NSDictionary *)getDicByPlist{  

    NSString *path=[[NSBundle mainBundle] pathForResource:@"dataList" ofType:@"plist"];  

    NSMutableDictionary *dic = [[NSMutableDictionary alloc]initWithContentsOfFile:path];  

    return dic;  

}  

//获取基础联系列表  

-(NSMutableArray *)getDateArray{  

    NSDictionary *dic = [self getDicByPlist];  

    NSMutableArray *imageList = [[NSMutableArray alloc]init];  

    NSMutableArray *dicArray = [dic objectForKey:@"imageList"];  

    for (NSDictionary *vdic in dicArray) {  

        DataInfo *data=[[DataInfo alloc]init];  

        NSNumber *hValue=[vdic objectForKey:@"height"];  

        data.height= hValue.floatValue;  

        NSNumber *wValue=[vdic objectForKey:@"width"];  

        data.width= wValue.floatValue;  

        data.url = [vdic objectForKey:@"url"];  

        data.title=[vdic objectForKey:@"title"];  

        data.mess=[vdic objectForKey:@"mess"];  

        [imageList addObject:data];  

    }  

    return imageList;  

}  

[objc] view plaincopy

//初始化视图  

-(id)initWithDataArray:(NSMutableArray *)array{  

    self=[super initWithFrame:CGRectMake(0, 0, 320, 416)];  

    if (self) {  

        [self initProperty];//初始化参数  

        for (int i=0; i<array.count; i++) {  //遍历数组  

            if (i/3>0&&i%3==0) {  

                row++;   //所在行数  

            }  

            DataInfo *data = (DataInfo*)[array objectAtIndex:i];  //取得Model数据  

            //如果是第一行，第一行高度一样  

            if (row==1) {  

                switch (i%3) {  

                    case 0:  

                        [self addMessView:lower DataInfo:data];  

                        break;  

                    case 1:  

                        [self addMessView:lower DataInfo:data];  

                        break;  

                    case 2:  

                        [self addMessView:lower DataInfo:data];  

                        break;  

                    default:  

                        break;  

                }  

            }else{  

                [self addMessView:lower DataInfo:data];  

            }  

            //重新判断最高和最低view  

            [self getHViewAndLView];  

        }  

        //添加scrollView  

        [self setContentSize:CGSizeMake(320, highValue)];  

        [self addSubview:v1];  

        [self addSubview:v2];  

        [self addSubview:v3];  

    }  

    return self;  

}  

[objc] view plaincopy

//初始化参数  

-(void)initProperty{  

    row =1;  

    //初始化第一列视图  

    v1 = [[UIView alloc]initWithFrame:CGRectMake(0, 0, WIDTH, 0)];  

    //初始化第二列视图  

    v2 = [[UIView alloc]initWithFrame:CGRectMake(WIDTH, 0, WIDTH, 0)];  

   //初始化第三列视图  

    v3 = [[UIView alloc]initWithFrame:CGRectMake( WIDTH*2,0, WIDTH, 0)];  

 //初始化最高视图  

    higher =1;  

    //初始化最低视图  

    lower=1;  

    //最高列高度  

    highValue=1;  

}  

[objc] view plaincopy

//向视图添加MessView  

-(void)addMessView:(int)lValue DataInfo:(DataInfo *)data{  

    MessView *mView=nil;  

    float hValue=0;  

    switch (lValue) {  

        case 1:  

            // 创建内容视图  

            mView= [[MessView alloc]initWithData:data yPoint:v1.frame.size.height];  

            hValue=mView.frame.size.height;  

            //把新加的图片高度累加到v1的原高度 并把新高度赋给v1  

            v1.frame=CGRectMake(v1.frame.origin.x, v1.frame.origin.y, WIDTH, v1.frame.size.height+hValue);  

            [v1 addSubview:mView];  

            break;  

        case 2:  

            // 创建内容视图  

            mView= [[MessView alloc]initWithData:data yPoint:v2.frame.size.height];  

           hValue=mView.frame.size.height;  

            v2.frame=CGRectMake(v2.frame.origin.x, v2.frame.origin.y, WIDTH, v2.frame.size.height+hValue);  

            [v2 addSubview:mView];  

            break;  

        case 3:  

            // 创建内容视图  

            mView= [[MessView alloc]initWithData:data yPoint:v3.frame.size.height];  

            hValue=mView.frame.size.height;  

            v3.frame=CGRectMake(v3.frame.origin.x, v3.frame.origin.y, WIDTH, v3.frame.size.height+hValue);  

            [v3 addSubview:mView];  

            break;  

        default:  

            break;  

    }  

}  

[objc] view plaincopy

-(id)initWithData:(DataInfo *)data yPoint:(float) y{  

    float imgW=data.width;//图片原宽度  

    float imgH=data.height;//图片原高度  

    float sImgW = WIDTH-4;//缩略图宽带  

    float sImgH = sImgW*imgH/imgW;//缩略图高度,等比放大缩小  

    self = [super initWithFrame:CGRectMake(0, y, WIDTH, sImgH+4)];  

    if (self) {  

        UrlImageButton *imageBtn = [[UrlImageButton alloc]initWithFrame:CGRectMake(2,2, sImgW, sImgH)];//初始化url图片按钮控件  

        //设置图片地址，用到了第三方框架UrlImageButton  

        [imageBtn setImageFromUrl:YES withUrl:data.url];  

        [imageBtn addTarget:self action:@selector(click) forControlEvents:UIControlEventTouchUpInside];  

        [self addSubview:imageBtn];  

        UILabel *label = [[UILabel alloc]initWithFrame:CGRectMake(2, self.frame.size.height-22, WIDTH-4, 20)];  

        label.backgroundColor = [UIColor blackColor];  

        label.alpha=0.8;  

        label.text=data.title;  

        label.textColor =[UIColor whiteColor];  

        [self addSubview:label];  

    }  

    return self;  

}  

[objc] view plaincopy

//重新判断最高和最低view  

-(void)getHViewAndLView{  

    if (v1.frame.size.height>highValue) {   //判断v1的高度是否大于最高列高度  

        highValue=v1.frame.size.height;  //如果大于，把高度赋给highValue  

        higher=1;    //设置视图高度最高的列数  

    }else if(v2.frame.size.height>highValue) {  

        highValue=v2.frame.size.height;  

        higher=2;  

    }else if(v3.frame.size.height>highValue) {  

        highValue=v3.frame.size.height;  

        higher=3;  

    }  

    float v1Height=v1.frame.size.height;  

    float v2Height=v2.frame.size.height;  

    float v3Height=v3.frame.size.height;  

    //求得视图高度最小的列数  

    if (v1Height<v2Height) {  

        if (v1Height<v3Height) {  

            lower=1;  

        }else{  

            lower=3;  

        }  

    }else{  

        if (v2Height<v3Height) {  

            lower=2;  

        }else{  

            lower=3;  

        }  

    }  

}