UICollectionView

自定义布局

UICollectionView——>可以想象成TableViewController

  • //创建CollectionView对象,传布局参数

UICollectionView *collectionView = [[UICollectionView alloc] initWithFrame : frame  collectionViewLayout: [ [ UICollectionViewFlowLayout alloc] init ] ]; 

 

collectionView.dataSource = self ; 

collectionView.delegate = self;

//设置数据源,代理

//实现代理、数据源方法;

[self.view addSubview : collectionView];

 

  • cell 注册

static NSString * const XMGPhotoId = @"photo"; //搞一个标示; 注册cell

// 注册

 [collectionView registerNib:[UINib nibWithNibName:NSStringFromClass([XMGPhotoCell class]) bundle:nil] forCellWithReuseIdentifier:XMGPhotoId];

 

  • 数据源方法://每一个cell显示什么内容

#pragma mark - <UICollectionViewDataSource>

- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section

{//显示多少条数据

    return self.imageNames.count;

}

 

- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath

{//每一条显示什么内容

    XMGPhotoCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:XMGPhotoId forIndexPath:indexPath];

    cell.imageName = self.imageNames[indexPath.item];

    return cell;

}

 

 

  • cell的布局显示滚动的方式,是由collectionViewLayout: [ [ UICollectionViewFlowLayout alloc] init ]  参数决定的;

cell 即是Items

 

UICollectionViewFlowLayout  *layout =  [ [ UICollectionViewFlowLayout alloc] init ]

layout.itemSize = CGSizeMake(); //决定每一个cell的大小;

layout.scrollDirection = UICollectionViewScrollDirectionHorizontal ; //水平滚动;

 

  • 自定义布局继承自流水布局:@interface XMGLineLayout : UICollectionViewFlowLayout

重写父类的一些方法,来到需求的布局形式;

/**

 UICollectionViewLayoutAttributes *attrs;

 1.一个cell对应一个UICollectionViewLayoutAttributes对象

 2.UICollectionViewLayoutAttributes对象决定了cell的frame

 */

 

  • - (NSArray *)layoutAttributesForElementsInRect:(CGRect)rect

{

 * 这个方法的返回值是一个数组(数组里面存放着rect范围内所有元素的布局属性)

 * 这个方法的返回值决定了rect范围内所有元素的排布(frame)

}

 

  • - (BOOL)shouldInvalidateLayoutForBoundsChange:(CGRect)newBounds

{

    return YES;

/**

 * 当collectionView的显示范围发生改变的时候,是否需要重新刷新布局

 * 一旦重新刷新布局,就会重新调用下面的方法:

 1.prepareLayout

 2.layoutAttributesForElementsInRect:方法

 */

 

}

 

  • - (CGPoint)targetContentOffsetForProposedContentOffset:(CGPoint)proposedContentOffset withScrollingVelocity:(CGPoint)velocity

{

/**

 * 这个方法的返回值,就决定了collectionView停止滚动时的偏移量

 */

 

}

 

 // 设置内边距

    CGFloat inset = (self.collectionView.frame.size.width - self.itemSize.width) * 0.5;

    self.sectionInset = UIEdgeInsetsMake(0, inset, 0, inset);

 

 

  • - (void)prepareLayout{

/**

 * 用来做布局的初始化操作(不建议在init方法中进行布局的初始化操作)

 */

    [super prepareLayout];

    

    // 水平滚动

    self.scrollDirection = UICollectionViewScrollDirectionHorizontal;

    

    // 设置内边距

    CGFloat inset = (self.collectionView.frame.size.width - self.itemSize.width) * 0.5;

    self.sectionInset = UIEdgeInsetsMake(0, inset, 0, inset);

}

 

 

GitHud

CarouseL  相册框架

 

 

布局只负责展示

 

点击事件  还是得要代理来实现

#pragma mark - <UICollectionViewDelegate>

  • - (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath

{

    [self.imageNames removeObjectAtIndex:indexPath.item];

    [self.collectionView deleteItemsAtIndexPaths:@[indexPath]];

}

 

往cell上添加内容   ——>自定义cell

posted @ 2017-06-29 12:37  laugh  阅读(117)  评论(0编辑  收藏  举报