UICollectionView小结

原创 2015年11月17日 17:41:13

一、集合视图概述

     UICollectionView也称集合视图,是一种新的数据展示方式,简单地可以理解为多列的UITableView。例如:iBooks的书架效果、购物网站的商品展示效果等等。

     UICollectionView与UITableView的实现类似,都需要设置代理和数据源。类似的是它们都有cell,但是UICollectionView比UITableView的cell布局更复杂,需要使用一个类描述集合视图的布局——UICollectionViewLayout。



二、创建UICollectionView

#import "ViewController.h"
@interface ViewController ()<UICollectionViewDelegate,UICollectionViewDataSource>
@property(nonatomic,strong) UICollectionView * collectionView;
@property(nonatomic,copy) NSMutableArray * modelArray;
@end
@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
}
/**
 *  1.创建并设置布局对象--UICollectionViewFlowLayout
 */
-(void)createAndSetLayout{
    UICollectionViewFlowLayout * layout = [[UICollectionViewFlowLayout alloc]init];
    layout.itemSize = CGSizeMake(150, 90);//设置cell大小
    layout.minimumInteritemSpacing = 10;//设置最小列间距
    layout.minimumLineSpacing =30; //设置最小行间距
    layout.sectionInset = UIEdgeInsetsMake(10, 10, 10, 10);//设置分区上下左右距离
    layout.scrollDirection = UICollectionViewScrollDirectionVertical; //滚动方向
    layout.headerReferenceSize = CGSizeMake(0, 30); //页眉大小
    layout.footerReferenceSize = CGSizeMake(30, 30);//页脚大小
    [self createAndSetCollectionViewWith:layout];
}
/**
 *  2.创建集合视图,并指定布局方式
 */
-(void)createAndSetCollectionViewWith:(UICollectionViewFlowLayout *)layout{
    self.collectionView = [[UICollectionView alloc] initWithFrame:self.view.frame collectionViewLayout:layout];
    _collectionView.dataSource = self;
    _collectionView.delegate = self;
    _collectionView.backgroundColor = [UIColor redColor];
    [self.view addSubview:_collectionView];
}

/**
 *  3.注册重用集合
 */

-(void)resignCollectionViewReuse{
  //注册重用cell
    [_collectionView registerClass:[UICollectionViewCell  class] forCellWithReuseIdentifier:@"cell"];
 //注册header footer
    [_collectionView registerClass:[UICollectionReusableView class] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"header"];
    [_collectionView registerClass:[UICollectionReusableView class] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"footer"];
}
/**
 * 4 代理,数据源
 */
//@required
//设置每个分区item个数
-(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
    return _modelArray.count;
}

-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
    UICollectionViewCell * cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"cell" forIndexPath:indexPath];
    cell.contentView.backgroundColor = [UIColor whiteColor];
    
    return cell;
}
//@optional
//设置分区个数
-(NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView{
    return 2;
}
//设置区头,尾
-(UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath{
    if([kind isEqualToString:UICollectionElementKindSectionHeader]){
       //重用集合中取
        UICollectionReusableView * headerView = [collectionView dequeueReusableSupplementaryViewOfKind:kind withReuseIdentifier:@"header" forIndexPath:indexPath];
        headerView.backgroundColor = [UIColor cyanColor];
        return headerView;
    }else{
        UICollectionReusableView * footerView = [collectionView dequeueReusableSupplementaryViewOfKind:kind withReuseIdentifier:@"footer" forIndexPath:indexPath];
        footerView.backgroundColor =[UIColor blackColor];
        return footerView;
    }
}
- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

@end


三、代理、数据源协议

1>UICollectionViewDataSource 和 UICollectionViewDelegate

@protocol UICollectionViewDataSource <NSObject>
@required //必须实现
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section;
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath;
@optional //可选实现
- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView;
- (UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath;
//设置某个item是否可以被移动,返回NO则不能移动
- (BOOL)collectionView:(UICollectionView *)collectionView canMoveItemAtIndexPath:(NSIndexPath *)indexPath NS_AVAILABLE_IOS(9_0);
//移动item的时候,会调用这个方法
- (void)collectionView:(UICollectionView *)collectionView moveItemAtIndexPath:(NSIndexPath *)sourceIndexPath toIndexPath:(NSIndexPath*)destinationIndexPath;
@end

@protocol UICollectionViewDelegate <UIScrollViewDelegate>
@optional
//关于用户交互,UICollectionView也做了改进。每个cell现在有独立的高亮事件和选中事件的delegate,用户点击cell的时候,现在会按照以下流程向delegate进行询问
//是否应该高亮
-(BOOL)collectionView:(UICollectionView *)collectionView shouldHighlightItemAtIndexPath:(NSIndexPath *)indexPath;
//如果1回答为是,那么高亮
- (void)collectionView:(UICollectionView *)collectionView didHighlightItemAtIndexPath:(NSIndexPath *)indexPath;
//如果1回答为是,那么现在取消高亮
- (void)collectionView:(UICollectionView *)collectionView didUnhighlightItemAtIndexPath:(NSIndexPath *)indexPath;
//是否可以被选中
- (BOOL)collectionView:(UICollectionView *)collectionView shouldSelectItemAtIndexPath:(NSIndexPath *)indexPath;
//是否可以不被选中
- (BOOL)collectionView:(UICollectionView *)collectionView shouldDeselectItemAtIndexPath:(NSIndexPath *)indexPath;
//确实被选中
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath;
//确实未被被选中
- (void)collectionView:(UICollectionView *)collectionView didDeselectItemAtIndexPath:(NSIndexPath *)indexPath;
//将要加载某个Item时调用的方法
- (void)collectionView:(UICollectionView *)collectionView willDisplayCell:(UICollectionViewCell *)cell forItemAtIndexPath:(NSIndexPath *)indexPath NS_AVAILABLE_IOS(8_0);
//将要加载头尾视图时调用的方法
- (void)collectionView:(UICollectionView *)collectionView willDisplaySupplementaryView:(UICollectionReusableView *)view forElementKind:(NSString *)elementKind atIndexPath:(NSIndexPath *)indexPath NS_AVAILABLE_IOS(8_0);
//已经展示某个Item时触发的方法
- (void)collectionView:(UICollectionView *)collectionView didEndDisplayingCell:(UICollectionViewCell *)cell forItemAtIndexPath:(NSIndexPath *)indexPath;
//已经展示某个头尾视图时触发的方法
- (void)collectionView:(UICollectionView *)collectionView didEndDisplayingSupplementaryView:(UICollectionReusableView *)view forElementOfKind:(NSString *)elementKind atIndexPath:(NSIndexPath *)indexPath;
//这个方法设置是否展示长按菜单
- (BOOL)collectionView:(UICollectionView *)collectionView shouldShowMenuForItemAtIndexPath:(NSIndexPath *)indexPath;
//这个方法用于设置要展示的菜单选项
- (BOOL)collectionView:(UICollectionView *)collectionView canPerformAction:(SEL)action forItemAtIndexPath:(NSIndexPath *)indexPath withSender:(id)sender;
这个方法用于实现点击菜单按钮后的触发方法,通过测试,只有copy,cut和paste三个方法可以使用
- (void)collectionView:(UICollectionView *)collectionView performAction:(SEL)action forItemAtIndexPath:(NSIndexPath*)indexPath withSender:(id)sender;
//collectionView进行重新布局时调用的方法
- (UICollectionViewTransitionLayout *)collectionView:(UICollectionView *)collectionView transitionLayoutForOldLayout:(UICollectionViewLayout *)fromLayout newLayout:(UICollectionViewLayout *)toLayout;
@end

注意:代理中方法的优先级比setter方法的优先级高

3>UICollectionViewDelegateFlowLayout

@protocol UICollectionViewDelegateFlowLayout <UICollectionViewDelegate>
@optional
//动态设置每个Item的尺寸大小
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath;
//动态设置每个分区的EdgeInsets
- (UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout insetForSectionAtIndex:(NSInteger)section;
//动态设置每行的间距大小
-(CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout minimumLineSpacingForSectionAtIndex:(NSInteger)section;
//动态设置每列的间距大小
-(CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout minimumInteritemSpacingForSectionAtIndex:(NSInteger)section;
//动态设置某个分区头视图大小
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout referenceSizeForHeaderInSection:(NSInteger)section;
//动态设置某个分区尾视图大小
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout referenceSizeForFooterInSection:(NSInteger)section;
@end
版权声明:本文为博主原创文章,未经博主允许不得转载。

UICollectionView使用小结

UICollectionViewFlowLayout 类是一个具体的布局对象,它将一个个部件组织成一个可分组的(每个分组都有可选的页眉和页脚视图)网格;这些部件在集合视图中从一行流向下一行或者一列流向...
  • junjun150013652
  • junjun150013652
  • 2015年04月13日 11:44
  • 2766

UICollectionView的用法小结

UICollectionView的简单用法,具体可参考http://blog.csdn.net/majiakun1/article/details/17204693,有相关的三篇博客,个人感觉还不错,...
  • Red_coralDown
  • Red_coralDown
  • 2015年12月11日 17:16
  • 672

iOS开发 UICollectionView详解+实例

文章来源:http://www.cnblogs.com/ios8/p/iOS-UICollectionView.html 本章通过先总体介绍UICollectionView及其常用方法,再结合一...
  • sevenquan
  • sevenquan
  • 2015年12月31日 12:05
  • 433

MJRefresh的下拉刷新,UICollectionView,UItableview

1.将MJRefresh文件夹整个导入所需的工程中。 2.文件夹中的MJRefresh.bundle--->arrow@2x.png 图片可自行替换,这个会在刷新过程中显示。 3.可以在MJRef...
  • maiwc
  • maiwc
  • 2015年08月16日 11:29
  • 3438

UIScrollView+横置UICollectionView实现滑动返回(以及每页都可滑动返回)

当UIScrollView有多页的时候我们知道会出现滑动返回失效的情况,同理横置UICollectionView也是同一个道理,因为UICollectionView本身就是继承与UIScrollVie...
  • u012891546
  • u012891546
  • 2016年09月05日 17:44
  • 773

iOS UICollectionView小结 + 选中效果

UICollectionView的出现使得复杂的界面简单化,下面带来UICollectionView的一些使用细节,以及多选的效果     新建工程,在viewController .m 里的代码如...
  • Amydom
  • Amydom
  • 2016年05月16日 16:05
  • 8852

IOS-给UIScrollView(包括继承它的UITableView、UICollectionView)添加下拉刷新-上拉加载更多

IOS里面用到的下拉刷新、上拉加载更多控件,开源的第三方框架很多,我们可以直接拿过来用,别人造好的轮子我们就没有必要再造一遍了,这里推荐几款下拉刷新、上拉加载更多控件 只有下拉刷新的: ...
  • hanhailong726188
  • hanhailong726188
  • 2014年12月28日 23:48
  • 14441

UICollectionView-设置弹簧效果是否显示滚动条等向

  • baohanqing
  • baohanqing
  • 2016年04月08日 09:53
  • 2155

iOS UITableView、UICollectionView、UIWebView

UITableView使用及UITableViewCell使用,UIWebView及UICollectionView
  • ccflying88
  • ccflying88
  • 2016年03月04日 09:56
  • 804

多行多列控件:UICollectionView

本章通过先总体介绍UICollectionView及其常用方法,再结合一个实例,了解如何使用UICollectionView。   UICollectionView 和 UICollectionV...
  • xiaoyangsavvy
  • xiaoyangsavvy
  • 2015年03月05日 21:27
  • 1991
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:UICollectionView小结
举报原因:
原因补充:

(最多只允许输入30个字)