50
49

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

iOS6から追加されたCollectionViewのサンプル

Last updated at Posted at 2012-12-26

##開発環境

  • XCode Ver. 4.5.2

##ざくっとすること

  • ViewControllerでは
    Cellの登録
    必要なデリゲートメソッドの追加。
    メソッド毎にロジックを追加

  • storyboardで
    CollectionViewを配置
    その中にCellも配置
    必要であれば他のオブジェクトも配置(サンプルはLabelを配置している)
    上で配置したCellの設定をIB上で行う

  • Cell用のクラスを新規作成し、ロジックを追加

##サンプルコード

###Cellの登録

[self.collectionView registerClass:[CollectionViewCell class] forCellWithReuseIdentifier:@"cell"];

forCellWithReuseIdentifier : Cellの識別子を指定。識別子は、"Collection Reusable View"のIdentifierで指定したのを使用。

###必要なデリゲートメソッドとメソッド毎にロジックを追加

//セクション数を設定
- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView {
    return 1;
}

// セクションに応じたセルの数を返す
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section
{
    return datas.count;
}

// セルオブジェクトを返す
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
    
    CollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"cell" forIndexPath:indexPath];
    cell.label.text = datas[indexPath.row];
    return cell;
}

###storyboardでの作業

CollectionViewに"Collection View Cell"オブジェクトを置く。
Cellの中にサンプルで表示する為のLabelオブジェクトもあわせて置く。
IdentifierforCellWithReuseIdentifierで指定した識別子を指定。

###Cell用のクラスを新規作成し、ロジックを追加

#####Labelオブジェクトの設定

@property (weak, nonatomic) IBOutlet UILabel *label;
@synthesize label = _label;

Cellの初期設定を行う。サンプルではラベルを追加している。

- (id)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        // Initialization code
        UILabel* label = [[UILabel alloc] initWithFrame:CGRectMake(10, 10, frame.size.width - 6, frame.size.height - 6)];
        label.backgroundColor = [UIColor redColor];
        [self.contentView addSubview:label];
        self.label = label;
    }
    return self;
}

Headerの追加方法 (2013.03.24追記)

すること

  • Headerの登録
[self.collectionView registerClass:[HeaderView class] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"header"];
// withReuseIdentifierはIBで登録した名称を使用
  • 対象のデリゲートメソッドを追加
- (UICollectionReusableView *)collectionView:(UICollectionView *)collectionView
           viewForSupplementaryElementOfKind:(NSString *)kind
                                 atIndexPath:(NSIndexPath *)indexPath {
    HeaderView *headerView = [collectionView dequeueReusableSupplementaryViewOfKind:UICollectionElementKindSectionHeader
                                                                withReuseIdentifier:@"header"
                                                                       forIndexPath:indexPath];
    return headerView;
}

"#参考情報
[iOS6] Collection View 基本的な使い方
※github上のコードが参考になりました。

#"サンプルコード
github

※このコードを足掛かりにするので、随時変更される可能性があります。

50
49
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
50
49

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?