【Objective-C】UICollectionViewをUIViewControllerで実装する方法(xibあり)
こういう人に向けて発信しています。
・UIViewControllerクラスでDelegateを採用してコレクションビューを使いたい人
・UICollectionViewの余白なども意識して描画したい人
・Objective−c 初心者
おことわり
普段はxib/コーディング、どっちでも行ってますが、
今回はxibだけで紹介させて下さい。
xibでObjectを置けばレイアウトの設定などは不要ですが、
コードで書くと、Layoutなどきっちり書かないといけなくて
工数が増えそうなので。
実装イメージ
使用するクラスについて
・ViewController. h / .m /.xib
xibファイルはスクリーンショット撮ったので後ほど貼ります。
ViewController.h
#import <UIKit/UIKit.h>
@interface ViewController : UIViewController
@end
ViewController.m
#import "ViewController.h"
@interface ViewController ()<UICollectionViewDelegate,UICollectionViewDataSource>{
}
//XIBファイルのオブジェクトとアウトレット接続してます。
@property (weak, nonatomic) IBOutlet UICollectionView *collectionView;
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
_collectionView.delegate = self;
_collectionView.dataSource = self;
_collectionView.bounces =NO;
_collectionView.backgroundColor = [UIColor grayColor];
[self collectionBrank];
// Do any additional setup after loading the view, typically from a nib.
[_collectionView registerClass:[UICollectionViewCell class] forCellWithReuseIdentifier:NSStringFromClass([UICollectionViewCell class])];
}
- (void)collectionBrank{
UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc]init];
layout.sectionInset = UIEdgeInsetsMake(10, 10, 10, 10);
//Storyboardで設定してても改めて設定しないとnilでデフォルトの垂直が反映されちゃうと思います。
layout.scrollDirection = UICollectionViewScrollDirectionHorizontal;
_collectionView.collectionViewLayout = layout;
}
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section
{
return 30;
}
- (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;
}
- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView
{
return 1;
}
- (CGSize)collectionView:(UICollectionView *)collectionView
layout:(UICollectionViewLayout*)collectionViewLayout
sizeForItemAtIndexPath:(NSIndexPath *)indexPath
{
return CGSizeMake(100, 100);
}
@end
ViewController.xib
重要なのは、
(1)←・↓・→は隙間0で反映
(2)高さは120取っている(セルサイズ100,上下余白10ずつ)
余談:UIScrollViewとどっちの方が良いか。
個人的にはUICollectionViewは必要な横幅など自動で計算して
ContentSize生成してくれるの素晴らしいなぁとは思います。
セルなどもカスタムセル採用して、
仕様変更などに耐えられるのを考えたら、
コレクションビューに采配が上がるかな。