【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での実装との相違点だと思います。)