iOS-UICollectionViewController 介绍

废话不多说,列几个列子 (几种情况下的做法):

 

情景一:

介绍:1. 在UIViewController 上加 UICollectionView (用代码 创建 UICollectionView)。

   2. UICollectionView上的cell为自定义的view,名字叫:MyDealCell,用的是 xib。 ( 新建类 MyDealCell 继承自 UICollectionViewCell )

   3. 选中 MyDealCell.xib 修改其 identifier 为 ListCell。

   4. 注册 cell 用 registerClass 。

     5. 在iPad上测试。

 

=======GoodListViewController.h=======

@interface GoodListViewController : UIViewController<UICollectionViewDataSource,UICollectionViewDelegate,UICollectionViewDelegateFlowLayout>

@end

 

=======GoodListViewController.m=======

 

static NSString * const reuseIdentifier = @"ListCell";

- (void)viewDidLoad {
    [super viewDidLoad];

    UICollectionViewFlowLayout *flowLayout=[[UICollectionViewFlowLayout alloc] init];
    flowLayout.scrollDirection=UICollectionViewScrollDirectionVertical;
    collection=[[UICollectionView alloc] initWithFrame:self.view.bounds collectionViewLayout:flowLayout];
    collection.dataSource=self;
    collection.delegate=self;
    collection.backgroundColor=[UIColor redColor];
    [self.view addSubview:collection];

    // [self.collectionView registerNib:[UINib nibWithNibName:@"MyDealCell" bundle:nil] forCellWithReuseIdentifier:reuseIdentifier]; // MyDealCell用Xib实现的
    [collection registerClass:[GoodListCell class] forCellWithReuseIdentifier:reuseIdentifier]; // GoodListCell 里面的控件既可以用代码实现,也可以用xib,用xib的话,在 GoodListCell 里面要通过 GoodListCell *goodsView = [[NSBundle mainBundle] loadNibNamed:@"CollectionCell" owner:self options:nil][0]; 加载xib。
}


-(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section
{
    return 23;
}

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

  // 在 [collection dequeueReusableCellWithReuseIdentifier:@"cell" forIndexPath:indexPath];中的 collection 和 上面 形参 collectionView 一样
    MyDealCell *cell=[collection dequeueReusableCellWithReuseIdentifier:reuseIdentifier  forIndexPath:indexPath];
    cell.backgroundColor = [UIColor yellowColor];
    return cell;
}

-(CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath
{
    return CGSizeMake(Screen_Width/3-10, Screen_Height-104);
}

-(UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout insetForSectionAtIndex:(NSInteger)section
{
    return UIEdgeInsetsMake(20, 7.5, 20, 7.5);
}

-(CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout minimumInteritemSpacingForSectionAtIndex:(NSInteger)section
{
    return 7.5;
}

-(CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout minimumLineSpacingForSectionAtIndex:(NSInteger)section
{
    return 20;
}

 

情景二:

介绍:1. GoodListViewController 继承自 UICollectionViewController

   2. UICollectionView上的cell为自定义的view,名字叫:MyDealCell,用的是 xib。( 新建类 MyDealCell 继承自 UICollectionViewCell )

   3. 选中 MyDealCell.xib 修改其 identifier 为 ListCell。

   4. 注册cell用 registerNib

   5. 例子是在iPad上运行调试。

 

=======GoodListViewController.h=======

@interface GoodListViewController : UICollectionViewController

@end

 

static NSString * const reuseIdentifier = @"ListCell";


- (instancetype)init
{
    UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc] init];
    // cell的大小
    layout.itemSize = CGSizeMake(305, 305);
    return [self initWithCollectionViewLayout:layout];
}

- (void)viewDidLoad {
    [super viewDidLoad];

    self.collectionView.backgroundColor = [UIColor redColor];
  
    // Register cell classes
    [self.collectionView registerNib:[UINib nibWithNibName:@"MTDealCell" bundle:nil] forCellWithReuseIdentifier:reuseIdentifier];
    self.collectionView.alwaysBounceVertical = YES;
    
 //   // 添加上拉加载
 //   [self.collectionView addFooterWithTarget:self action:@selector(loadMoreDeals)];
}


/**
 当屏幕旋转,控制器view的尺寸发生改变调用
 */
- (void)viewWillTransitionToSize:(CGSize)size withTransitionCoordinator:(id<UIViewControllerTransitionCoordinator>)coordinator
{
    // 根据屏幕宽度决定列数
    int cols = (size.width == 1024) ? 3 : 2;
    
    // 根据列数计算内边距
    UICollectionViewFlowLayout *layout = (UICollectionViewFlowLayout *)self.collectionViewLayout;
    CGFloat inset = (size.width - cols * layout.itemSize.width) / (cols + 1);
    layout.sectionInset = UIEdgeInsetsMake(inset, inset, inset, inset);
    
    // 设置每一行之间的间距
    layout.minimumLineSpacing = 50;
}

#pragma mark <UICollectionViewDataSource>
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section {
    // 计算一遍内边距
    [self viewWillTransitionToSize:CGSizeMake(collectionView.width, 0) withTransitionCoordinator:nil];
  
    return 30;
}

- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
    MTDealCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:reuseIdentifier forIndexPath:indexPath];
    
     GoodListCell *cell=[collection dequeueReusableCellWithReuseIdentifier:@"cell" forIndexPath:indexPath];
       cell.backgroundColor = [UIColor yellowColor];
       return cell;
}

#pragma mark <UICollectionViewDelegate>
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath
{
  NSLog(@"=====selected=indexPath.item", indexPath.item);
}

 

 

情景三:

介绍:1. ViewController 继承自 UIViewController

     2. 在ViewController 控制器对应的故事版中直接拉一个 UICollectionView 控件。然后连线到控制器。

   3. UICollectionView上的cell为自定义的view,名字叫:CollectionCell,用的是 xib。( 新建类 CollectionCell 继承自 UICollectionViewCell )

     4. 选中刚刚新建的xib,更改类名为 CollectionCell

   5. 控制器中注册cell用 registerClass

   6. 例子在iphone上运行。

   6. 这个和上两中情景不一样的地方是:在控制器中用 registerClass,加载 CollectionCell 对应的 xib 的时候,是在 CollectionCell.m 中通过:

       NSArray *arrayOfViews = [[NSBundle mainBundle] loadNibNamed:@"CollectionCell" owner:self options:nil];加载的。

 

     上面的情景一:在控制器中用 registerClass 的时候,cell里面的控件是用代码实现的;

   上面的情景二:在控制器中用 registerNib 的时候,   cell里面的控件是在xib中实现的。

  

 

一、自定义Cell

 

1、新建类CollectionCell继承自UICollectionViewCell

2、新建Xib,命名为CollectionCell.xib

  a.选中CollectionCell.xib删掉默认的View,从控件中拖一个Collection View Cell(图3)到画布中,设置大小为95*116

  b.选中刚刚新建的xib,更改类名为CollectionCell

  c.在CollectionCell.xib的CollectionCell中添加一个Label, 然后连线。

 

==========CollectionCell.m , 重写 initWithFrame 方法 =============

- (id) initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self)
    {
        // 初始化时加载collectionCell.xib文件
        NSArray *arrayOfViews = [[NSBundle mainBundle] loadNibNamed:@"CollectionCell" owner:self options:nil];
        
        // 如果路径不存在,return nil
        if (arrayOfViews.count < 1)
        {
            return nil;
        }
        // 如果xib中view不属于UICollectionViewCell类,return nil
        if (![[arrayOfViews objectAtIndex:0] isKindOfClass:[UICollectionViewCell class]])
        {
            return nil;
        }
        // 加载nib
        self = [arrayOfViews objectAtIndex:0];
    }
    return self;
}

 

二、定义UICollectionView;

1、拖动一个Collection View到指定 ViewController控制器 的View上

2、连线dataSource和delegate,并创建映射(连线),命名 (在控制器中用这个属性) 为CollectionView

3、选中CollectionView的标尺,将Cell Size的Width和Height改成与自定义的Cell一样的95*116,

4、选中CollectionView的属性,可以修改其属性,比如是垂直滑动,还是水平滑动,选择Vertical或Horizontal

5、选中CollectionViewCell,修改Class,继承自CollectionCell。

 

=======ViewController.h=======

#import <UIKit/UIKit.h>
@interface ViewController : UIViewController


@end

 

=======ViewController.m=======

#import "ViewController.h"
#import "CollectionCell.h"

@interface ViewController () <UICollectionViewDataSource, UICollectionViewDelegate, UICollectionViewDelegateFlowLayout>

@property (weak, nonatomic) IBOutlet UICollectionView *collectionView;  // 通过连线创建的属性


@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    
    self.view.backgroundColor = [UIColor lightGrayColor];
    
    self.collectionView.backgroundColor = [UIColor grayColor];
    [self.collectionView registerClass:[CollectionCell class] forCellWithReuseIdentifier:@"CollectionCell"];
    self.collectionView.delegate = self;
    self.collectionView.dataSource = self;

}

//每个section的item个数
-(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section
{
    return 40;
}

-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
//    CollectionCell *cell = (CollectionCell *)[collectionView dequeueReusableCellWithReuseIdentifier:@"CollectionCell" forIndexPath:indexPath];
//    
//    //图片名称
//    NSString *imageToLoad = [NSString stringWithFormat:@"%d.png", indexPath.row];
//    //加载图片
//    cell.imageView.image = [UIImage imageNamed:imageToLoad];
//    //设置label文字
//    cell.label.text = [NSString stringWithFormat:@"{%ld,%ld}",(long)indexPath.row,(long)indexPath.section];
    
   CollectionCell *cell = (CollectionCell *)[collectionView dequeueReusableCellWithReuseIdentifier:@"CollectionCell"forIndexPath:indexPath];
    
    return cell;
}

-(void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath
{
    NSLog(@"===indexPath.item=%d", (int)indexPath.item);
}

 

posted @ 2016-03-04 13:36  nxz_diy  阅读(370)  评论(0编辑  收藏  举报