Skip to content

nobodyJee/CustomLayout

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

11 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

自定义collocationViewLayout实现瀑布流

功能描述:
  1. 满足UICollectionViewFlowLayout提供的普通的线性布局和网格布
  2. 满足单区和多区的瀑布流布局
  3. 满足多区瀑布流时每个区的列数可以不同
  4. 满足设置header和footer
  5. 满足设置header和footer的间距
使用方法

和UICollectionViewFlowLayout 使用方法一致,具体看 Demo

API

如下:


@protocol JWCCustomLayoutDelegate <NSObject>

@required 
// cell 高
- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(JWCCustomLayout *)collectionViewLayout heightForRowAtIndexPath:(NSIndexPath *)indexPath itemWidth:(CGFloat)itemWidth ;

@optional
// headersize
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(JWCCustomLayout *)collectionViewLayout referenceSizeForHeaderInSection:(NSInteger)section;

// footer 的 size
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(JWCCustomLayout *)collectionViewLayout referenceSizeForFooterInSection:(NSInteger)section;

// 每个区的边距
- (UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(JWCCustomLayout*)collectionViewLayout insetForSectionAtIndex:(NSInteger)section;

// 每个区多少列
- (NSInteger)collectionView:(UICollectionView *)collectionView layout:(JWCCustomLayout *)collectionViewLayout columnNumberAtSection:(NSInteger )section;


// 每个区多少中行距
- (NSInteger)collectionView:(UICollectionView *)collectionView layout:(JWCCustomLayout *)collectionViewLayout lineSpacingForSectionAtIndex:(NSInteger)section;

// 每个 item 之间的左右间距
- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(JWCCustomLayout*)collectionViewLayout interitemSpacingForSectionAtIndex:(NSInteger)section;

// 本区区头和上个区区尾的间距
- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(JWCCustomLayout*)collectionViewLayout spacingWithLastSectionForSectionAtIndex:(NSInteger)section;  (注意:在collectionViewFolwLayout中是无法设置当前的区头和上个区尾的间距的,为了弥补这一缺憾,特此添加这个方法)

效果图

image 效果图2 一个区 无header 无footer

image 效果图1 多区 有header有footer header和footer有间隔

image

效果图3 多区 有header有footer header和footer无间隔

原理解释

看个人博客

原理解释

如果解决了您的问题,请给个 start 鼓励

About

UIcollectionViewLayout 自定义layout 瀑布流 支持多区瀑布流 支持设置footer和header

Topics

Resources

Stars

Watchers

Forks

Packages

No packages published