【无限互联】IOS开发之瀑布流的实现(UICollectionView与UIScrollView)【DOC精选】.docVIP

【无限互联】IOS开发之瀑布流的实现(UICollectionView与UIScrollView) 瀑布流可以在保证图片原始比例的情况下，灵活的展现内容，相对于传统的使用相同大小的网格展现大量图片,要好上很多，而实现瀑布流的方式有很多种，网上比较流行的有三种实现方式。 1，使用UIScrollView，主要技术点在于视图的重用。 2，使用UITableView,这种方式应该是最易想到的，因为需要展现几列就用几个tabelview就ok了，而且不需要考虑重用，应为苹果已经做好了，只需要考虑如何在几列tabelView滑动的时候，保持同步不出现BUG。 3，使用UICollectionView，UICollectionView在iOS6中第一次被介绍，它与UITableView有许多相似点，但它多了一个布局类，而实现瀑布流，就与这个布局类有关。此种方式实现，也不需要考虑视图重用。 以上三种方式实现瀑布流,使用UICollectionView应该算是最简单的了,so,就重最简单的开始吧。 由于网络太差，所以展现的并不是网络上的图片，而是将用户相册中的图片读取出，并用瀑布流展现。 首先，遍历用户相册，将照片放到准备好的数组中。访问用户相册需要导入AssetsLibrary/AssetsLibrary.h框架 [objc]?view plaincopy span?style=font-size:14px;????_images?=?[NSMutableArray?array];?? ????//创建相册库?? ????library?=?[[ALAssetsLibrary?alloc]?init];?? ?????? ????[library?enumerateGroupsWithTypes:ALAssetsGroupSavedPhotos?usingBlock:^(ALAssetsGroup?*group,?BOOLBOOL?*stop)?{?? ????????if?(group)?{?? ????????????[group?enumerateAssetsUsingBlock:^(ALAsset?*result,?NSUInteger?index,?BOOLBOOL?*stop)?{?? ????????????????if?(result)?{?? ????????????????????ALAssetRepresentation?*resentation?=?[result?defaultRepresentation];?? ????????????????????CGImageRef?imageRef?=?resentation.fullResolutionImage;?? ????????????????????UIImage?*image?=?[UIImage?imageWithCGImage:imageRef];?? ?????????????????????? ????????????????????//将相片加入到数组中?? ????????????????????[self.images?addObject:image];?? ????????????????????[_collectionView?reloadData];?? ????????????????}?? ?????????????????? ????????????}];?? ????????}?? ?????????? ????}?failureBlock:^(NSError?*error)?{?? ?????????? ????}];?? /span?? 然后创建UICollectionView，注意这里放置UICollectionView的控制器要实现,UICollectionViewDelegateFlowLayout和UICollectionViewDatasource两个协议。 UICollectionView创建时需要传入一个布局对象，布局类继承自UICollectionViewLayout这个抽象基类,我们需要自定义布局对象，继承 UICollectionViewLayout的子类，UICollectionViewFlowLayout类，命名为WaterFlowLayout。 [objc]?view plaincopy span?style=font-size:14px;@interface?WaterFlowLayout?:?UICollectionViewFlowLayout?? @property?(nonatomic,assign)idUICollectionViewDelegateFlowLayout?delegate;?