iOS 開發筆記 - Use UICollectionView without Storyboard and XIB

最近才發現這個 Class ，真是乃覺三十里 XD 有可能已經習慣自己刻 UITableViewCell 了 Orz 所以一直沒去學習新技能，這次看到一些特效後，原本以為單純手動安排 View 變化，仔細一看才發現 UICollectionView 啦，就順手筆記一下，此外，坊間多為使用 Storyboard、XIB 的做法。

1. Create an ViewControler extends UIViewController
2. Add UICollectionView *collectionView property
3. Init collectionView with UICollectionViewFlowLayout
4. Use UICollectionViewDelegate and UICollectionViewDataSource
5. Implement collectionView:numberOfItemsInSection: and collectionView:cellForItemAtIndexPath:

如此一來，就可以動了 XD

//
// TestCollectionViewController.h:
//
#import <UIKit/UIKit.h>

@interface TestCollectionViewController : UIViewController
@property (nonatomic, strong) UICollectionView *collectionView;
@end

//
// TestCollectionViewController.m:
//
#import "TestCollectionViewController.h"

@interface TestCollectionViewController () <UICollectionViewDelegate, UICollectionViewDataSource>

@end

@implementation TestCollectionViewController

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

- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
    UICollectionViewCell * collectionViewCell = [collectionView dequeueReusableCellWithReuseIdentifier:@"Cell" forIndexPath:indexPath];
    
        CGFloat comps[3];
        for (int i = 0; i < 3; i++)
            comps[i] = (CGFloat)arc4random_uniform(256)/255.f;
        collectionViewCell.backgroundColor = [UIColor colorWithRed:comps[0] green:comps[1] blue:comps[2] alpha:1.0];
    return collectionViewCell;
}

- (UICollectionView *)collectionView
{
    if (!_collectionView) {
        UICollectionViewFlowLayout *flowLayout = [[UICollectionViewFlowLayout alloc] init];
        flowLayout.itemSize = CGSizeMake(100, 100);
        flowLayout.scrollDirection = UICollectionViewScrollDirectionHorizontal;
     
        _collectionView = [[UICollectionView alloc] initWithFrame:CGRectMake(0, 0, 300, 300) collectionViewLayout:flowLayout];
        _collectionView.delegate = self;
        _collectionView.dataSource = self;
        _collectionView.backgroundColor = [UIColor whiteColor];
        [_collectionView registerClass:[UICollectionViewCell class] forCellWithReuseIdentifier:@"Cell"];
    }
    return _collectionView;
}

- (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil
{
    self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil];
    if (self) {
        // Custom initialization
    }
    return self;
}

- (void)viewDidLoad
{
    [super viewDidLoad];
 
    [self.view addSubview:self.collectionView];
 
    // Do any additional setup after loading the view.
}

- (void)didReceiveMemoryWarning
{
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

@end

iOS 開發筆記 - Terminating app due to uncaught exception 'NSInternalInconsistencyException', reason: 'unable to dequeue a cell with identifier myCell - must register a nib or a class for the identifier or connect a prototype cell in a storyboard'

 

最近摸 Storyboard 一陣子，偶爾還會犯一些傻 bug ，就是 Identifier 設錯地方 XD 例如跑去 Identity Inspector 的 Identity 之 Restoration ID ：



結果程式一跑時，就噴訊息了：

** Terminating app due to uncaught exception 'NSInternalInconsistencyException', reason: 'unable to dequeue a cell with identifier myCell - must register a nib or a class for the identifier or connect a prototype cell in a storyboard'

解法就是開啟 storyboard 後，仔細查看左邊的 Document Outline 之 UITableViewController 裡的 Table View Cell 是不是有被標記起來，接著去看看右邊 Attributes Inspector 顯示的 Identifier 是不是跟程式碼一樣的，如此就能 debug 啦。

忘記是不是 iOS 5 SDK 開始，預設的 UITableViewController 的範例程式都是寫成綁定在 Interface builder (xib) / Storyboard 的寫法：

static NSString *CellIdentifier = @"myCell";
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier forIndexPath:indexPath];

早期 iOS 4 SDK 預設 UITableViewController 之 (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath 寫法：

static NSString *CellIdentifier = @"myCell";
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
if (cell == nil) {
        cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier] autorelease];
}

早期 Interface builder (xib) 的用法，須寫程式註冊 Nib：

- (void)viewDidLoad
{
[super viewDidLoad];
[self.tableView registerNib:[UINib nibWithNibName:@“MyCell" bundle:nil]
forCellReuseIdentifier:@“myCell”]; // "MyCell" for MyCell.xib
}