QuiltView 瀑布流 (第三方)

使用第三方 : QuiltView  (可在cocoapods上找到)

.h 文件

#import <UIKit/UIKit.h>
#import "TMQuiltView.h"
#import "TMPhotoQuiltViewCell.h"

@interface SelfHomeViewController : UIViewController <TMQuiltViewDataSource,TMQuiltViewDelegate> {
}
@property(strong,nonatomic)TMQuiltView *quiltView;
@property(strong,nonatomic)NSArray *images;
@end

.m 文件

主要代码:

#define kNumberOfCells           50

- (void)dealloc {
    [_quiltView release];
    _quiltView = nil;
    
    [_images release];
    _images = nil;
    [super dealloc];
}

- (void)viewDidLoad
{
    [super viewDidLoad];
    _quiltView = [[TMQuiltView alloc] initWithFrame:self.view.bounds];
    _quiltView.dataSource = self;
    _quiltView.delegate = self;
    [self.view addSubview:_quiltView];
    
    [_quiltView reloadData];
}

#pragma mark - QuiltViewControllerDataSource

- (NSArray *)images {
    if (!_images) {
        NSMutableArray *imageNames = [NSMutableArray array];
        for(int i = 0; i < kNumberOfCells; i++) {
            [imageNames addObject:[NSString stringWithFormat:@"%d.jpeg", i % 10 + 1]];
        }
        _images = [imageNames retain];
    }
    return _images;
}

- (UIImage *)imageAtIndexPath:(NSIndexPath *)indexPath {
    return [UIImage imageNamed:[self.images objectAtIndex:indexPath.row]];
}

- (NSInteger)quiltViewNumberOfCells:(TMQuiltView *)TMQuiltView {
    return [self.images count];
}

- (TMQuiltViewCell *)quiltView:(TMQuiltView *)quiltView cellAtIndexPath:(NSIndexPath *)indexPath {
    TMPhotoQuiltViewCell *cell = (TMPhotoQuiltViewCell *)[quiltView dequeueReusableCellWithReuseIdentifier:@"PhotoCell"];
    if (!cell) {
        cell = [[[TMPhotoQuiltViewCell alloc] initWithReuseIdentifier:@"PhotoCell"] autorelease];
    }
    
    cell.photoView.image = [self imageAtIndexPath:indexPath];
    cell.titleLabel.text = [NSString stringWithFormat:@"%d", indexPath.row + 1];
    return cell;
}

#pragma mark - TMQuiltViewDelegate

- (NSInteger)quiltViewNumberOfColumns:(TMQuiltView *)quiltView {
    return 3;
}

- (CGFloat)quiltView:(TMQuiltView *)quiltView heightForCellAtIndexPath:(NSIndexPath *)indexPath {
    return [self imageAtIndexPath:indexPath].size.height / [self quiltViewNumberOfColumns:quiltView];
}
时间: 2024-08-28 11:20:55

QuiltView 瀑布流 (第三方)的相关文章

自定义UICollectionViewLayout之瀑布流

目标效果 因为系统给我们提供的 UICollectionViewFlowLayout 布局类不能实现瀑布流的效果,如果我们想实现 瀑布流 的效果,需要自定义一个 UICollectionViewLayout  类,实现瀑布流效果.效果如右图. 依赖工具: 我们需要一个图片大小和图片地址的Josn数据, 和 SDWebImage图片加载的第三方工具 RootViewController.m 1 #import "RootViewController.h" 2 #import "

iOS横向瀑布流的封装

前段时间, 做一个羡慕, 需要使用到瀑布流! 说道瀑布流, 或许大家都不陌生, 瀑布流的实现也有很多种! 从scrollView 到 tableView 书写的瀑布流, 然后再到2012年iOS6 苹果API 新加进的collectionView进行的瀑布流封装! 确实, 不论是写起来还是用起来都要方便很多! 由于项目开发中需要使用到很像瀑布流, 本来想着懒省事, 直接搜一个第三方, 可搜了一会, 并没有搜到有关横向瀑布流的第三方! 于是就决定自己写一个吧! 里边用到的就是UIColleciti

ios瀑布流

一般来说瀑布流主要有两种实现方式.方法一:使用UITableView.方法二:使用UIScrollView.先介绍方法一(也是官方推荐的方式)1. 总先做成几列是事先要清楚,有多少条记录.2. 假设要做成3列,就用三个uitableview,宽度平均,高度动态,页面高度取uitableview中最高的.3. 三个uitableview初始化的时候用到tag(我越来越觉得tag在ios中的用处很大,就像js中读取html控件中的id一样),然后 showsVerticalScrollIndicat

iOS 美丽说瀑布流界面纯AutoLayout光速布局

最近在Github上看到三个库,分别是 GSKStretchyHeaderView,CHTCollectionViewWaterfallLayout ,JZNavigationExtension, 其中第一个是给CollectionView添加可动画的头部,添加方式和内容非常丰富,第二个是 瀑布流布局,第三个是UINavigationController的导航栏扩展.这三个东西厉害了啊,结 合起来咱们写个Demo,纯AutoLayout,效率非常高 (小弟搜集的好用的第三方库传送门:点击打开链接

iOS开发UI篇—自定义瀑布流控件(蘑菇街实现)

iOS开发UI篇—自定义瀑布流控件(蘑菇街瀑布流) 一.简单说明 关于瀑布流 1.是使用UIScrollView实现的 2.刷新数据(reloadData)方法里面做哪些事情 3.layoutSubviews方法里面做哪些事情 4.模仿UItableView进行设计 完善: 瀑布流控件第一次显示到屏幕上的时候自动的向数据源索要数据,而不需要手动调用.这需要监听View的显示,View的显示有一个方法,叫做willMoveToSuperview:在该方法中直接刷新一次数据即可. 二.把自定义的瀑布

iOS开发笔记15:地图坐标转换那些事、block引用循环、UICollectionviewLayout及瀑布流、图层混合

1.地图坐标转换那些事 (1)投影坐标系与地理坐标系 地理坐标系使用三维球面来定义地球上的位置,单位即经纬度.但经纬度无法精确测量距离戒面积,也难以在平面地图戒计算机屏幕上显示数据.通过投影的方式可以将其转换成平面的投影坐标系,不同的投影方式可能会带来不同的变形及误差,类似于把一个橘子的橘子皮剥开摊平到桌面. GPS以及iOS系统定位获得的坐标是地理坐标系WGS1984,Web地图一般用的坐标细是投影坐标系WGS 1984 Web Mercator,国内出于相关法律法规要求,对国内所有GPS设备

UICollectionView详解五:瀑布流

前面四个章节,我已经详细的讲解了UICollectionView的使用,这一节,我用一个非常实用的例子"瀑布流"来进一步说明UICollectionView的强大作用. 先分析一下瀑布流的特点: 1. 所有item的宽度是一致的. 2. 所有item应该是等比例缩放的. 3. 所有item的高度应该是通过实际宽度与缩放比例计算而得出的. 4. 要保证每一列的底部的y值均匀分布,不能偏差很大. 5. 瀑布流不是常规的流式布局,所以应该使用UICollectionViewLayout,对U

扩展版瀑布流

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>瀑布流-扩展版02</title> <style type="text/css"> * { margin: 0; padding: 0; } #list { list-style: none; position: relative; margin: 0 auto; }

PSCollectionView瀑布流实现

[-] 一基本原理 二具体实现 相关数据结构 视图更新方式 relayoutViews方法 removeAndAddCellsIfNecessary方法 select方法 重用数据块视图机制 三使用方法 四其他瀑布流实现 PSCollectionView是一个实现较简洁的仿Pinterest瀑布流iOS版实现,使用UIScrollView做容器,每列列宽固定,高度可变,使用方式类似UITableView.其效果如图: 一.基本原理 其基本实现原理为: 列数固定,根据列数每列存储一个当前列的高度值