UICollectionView(Basics)

From iOS6, UICollectionView was coming. It realizes tile like layout.
The style of programming is similar to UITableView.
Let’s make a sample!

Sample

This sample is only codes!(no use storyboard, and xib)
It prepares class which has UICollectionView, and implements 2 protocols.

• UICollectionViewDelegate
• UICollectionViewDataSource

It’s just like UITableView isn’t it?
Also, need to prepare cell which has extends UICollectionViewCell
It is cell sample, draws rect and circle for example.

Cell.h

@interface Cell : UICollectionViewCell
@end

Cell.m

#import "Cell.h"

@implementation Cell

- (id)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        // Initialization code
    }
    return self;
}


// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect
{
    // Drawing code
    CGContextRef context = UIGraphicsGetCurrentContext();
    
    CGContextSetRGBFillColor(context, 1.0, 0.5, 0.0, 1.0);
    CGRect r1 = CGRectMake(0 , 0, 25, 25);         // Size
    CGContextAddRect(context,r1);
    CGContextFillPath(context);
    
    CGContextSetRGBStrokeColor(context, 1.0, 1.0, 0.5, 1.0);
    CGContextAddEllipseInRect(context, CGRectMake(0 , 0, 25, 25));
    CGContextStrokePath(context);
}
@end

Next is main codes. It is ViewController

CollectionViewSample.h

@interface CollectionViewSample : UIViewController<UICollectionViewDelegate, UICollectionViewDataSource>
@end

CollectionViewSample.m

#import "CollectionViewSample.h"
#import "Cell.h"

@interface CollectionViewSample ()
@property (nonatomic) IBOutlet UICollectionView *collectionView;
@end

@implementation CollectionViewSample

-(void)viewDidLoad {
    [super viewDidLoad];
    
    UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc] init];
    layout.itemSize = CGSizeMake(25, 25);
    layout.minimumLineSpacing = 10.0f;
    layout.minimumInteritemSpacing = 12.0f;
    
    self.collectionView = [[UICollectionView alloc] initWithFrame:CGRectMake(0, 20, self.view.frame.size.width, self.view.frame.size.height-20) collectionViewLayout:layout];
    self.collectionView.delegate = self;
    self.collectionView.dataSource = self;
    
    [self.collectionView registerClass:[Cell class] forCellWithReuseIdentifier:@"CellA"];
    
    
    [self.view addSubview:self.collectionView];
}

#pragma mark -
#pragma mark - UICollectionViewDataSource
-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
    
    UICollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"CellA" forIndexPath:indexPath];
    
    return cell; // Cell
}

- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView
{
    return 1;  // number of section
}

- (NSInteger)collectionView:(UICollectionView *)collectionView
     numberOfItemsInSection:(NSInteger)section
{
    return 120;  // number of item
}


@end

Result

Ref

A Simple UICollectionView Tutorial