【Objective-C】UICollectionViewをコードのみで描画する方法(カスタムセル採用)【Xcode10.2対応】

こういう人に向けて発信しています。
・UICollectionViewをコードで書かざるを得ない人
・xibの制約があってコードで書かざるを得ない人
・Objective-C初心者

アプリイメージ

はじめに(初心者へ)

初心者の方には断っておきますが、コードで書くのは本来上級者向きです。
もし初めて導入しようとしていたら私の過去の記事のような、
xib(storyBoard)で採用するタイプで実装してください。

構成内容

ViewControllerクラスとUICollectionCustomCellクラスを採用。
UICollectionCustomCellクラスに関してはxib使ってます。
理由は面倒だったというのとわざわざTableViewやCustomCellを
カスタムにする=こだわって実装する場合で、
詳細にオートレイアウトなど確認しづらいコードで作業を行うのは
生産性が悪いからしないだろうという見解からです。

ViewController.h

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

ViewController.m

#import "ViewController.h"
#import "CustomCell.h"

#define RGB(r, g, b) [UIColor colorWithRed:(r)/255.0 green:(g)/255.0 blue:(b)/255.0 alpha:1]
#define RGBA(r, g, b, a)    [UIColor colorWithRed:(r)/255.0 green:(g)/255.0 blue:(b)/255.0 alpha:(a)]

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

@implementation ViewController{
    UIView *view;
    UICollectionView *collectionView;
}

- (void)viewDidLoad {
    [super viewDidLoad];
    [self setCollectionView];
    
    collectionView.dataSource = self;
    collectionView.delegate = self;
    
    UINib *nib = [UINib nibWithNibName:@"CustomCell" bundle:nil];
    [collectionView registerNib:nib forCellWithReuseIdentifier:@"CustomCell"];
    
}

-(void)setCollectionView{
    CGRect rect = self.view.frame;
    collectionView = [[UICollectionView alloc]initWithFrame:rect collectionViewLayout:[self collectionBrank]];
    collectionView.backgroundColor = [UIColor whiteColor];
    collectionView.bounces = NO;
    [self.view addSubview:collectionView];
}

#pragma collectionView
- (UICollectionViewFlowLayout *)collectionBrank{
    UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc]init];
    layout.sectionInset = UIEdgeInsetsMake(20, 10, 10, 10);
    layout.scrollDirection = UICollectionViewScrollDirectionHorizontal;
    return layout;
}

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

- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
    
    //標準セルの場合
    //    NSString *cellName = NSStringFromClass([UICollectionViewCell class]);
    //    UICollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:cellName forIndexPath:indexPath];
    //    cell.backgroundColor = [UIColor redColor];
    //    return cell;
    
    //カスタムセルの場合
    CustomCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"CustomCell" forIndexPath:indexPath];
    return cell;
}

- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView
{
    return 1;
}

- (CGSize)collectionView:(UICollectionView *)collectionView
                  layout:(UICollectionViewLayout*)collectionViewLayout
  sizeForItemAtIndexPath:(NSIndexPath *)indexPath
{
    return CGSizeMake(100, 100);
}

@end

CustomCell.h

#import <UIKit/UIKit.h>

@interface CustomCell : UICollectionViewCell

@end

CustomCell.m

#import "CustomCell.h"
@implementation CustomCell
- (void)awakeFromNib {
    [super awakeFromNib];
}

@end

CustomCell.xib

気をつけたところ

-(void)setCollectionView{
    CGRect rect = self.view.frame;
    collectionView = [[UICollectionView alloc]initWithFrame:rect collectionViewLayout:[self collectionBrank]];
    collectionView.backgroundColor = [UIColor whiteColor];
    collectionView.bounces = NO;
    [self.view addSubview:collectionView];
}

#pragma collectionView
- (UICollectionViewFlowLayout *)collectionBrank{
    UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc]init];
    layout.sectionInset = UIEdgeInsetsMake(20, 10, 10, 10);
    layout.scrollDirection = UICollectionViewScrollDirectionHorizontal;
    return layout;
}
    collectionView = [[UICollectionView alloc]initWithFrame:rect collectionViewLayout:[self collectionBrank]];

上記のように初期化する際に、
collectionViewLayoutを設定してあげる必要があります。
(ここはxibでの実装との相違点だと思います。)


いいなと思ったら応援しよう!