Specify row and column number for UICollectionView

Question

I want to show a UICollectionView which contains exactly 2 rows and 100 cells in each row.

// 1
- (NSInteger)collectionView:(UICollectionView *)view numberOfItemsInSection:(NSInteger)section {

    return 100;
}
// 2
- (NSInteger)numberOfSectionsInCollectionView: (UICollectionView *)collectionView {
    return 2;
}
// 3
- (UICollectionViewCell *)collectionView:(UICollectionView *)cv cellForItemAtIndexPath:(NSIndexPath *)indexPath {
    MyCell *cell = [cv dequeueReusableCellWithReuseIdentifier:@"cell" forIndexPath:indexPath];

        cell.lbl.text = @"Data";

    return cell;
}

I am getting this:

enter image description here

How can I specify a row number for UICollectionView? I want to create a 2x100 table.

score 18 · Accepted Answer · answered Sep 25 '13 at 18:05

Try this:

// 1
- (NSInteger)collectionView:(UICollectionView *)view numberOfItemsInSection:(NSInteger)section {

    return 2;
}
// 2
- (NSInteger)numberOfSectionsInCollectionView: (UICollectionView *)collectionView {
    return 100;
}
// 3
- (UICollectionViewCell *)collectionView:(UICollectionView *)cv cellForItemAtIndexPath:(NSIndexPath *)indexPath {
    MyCell *cell = [cv dequeueReusableCellWithReuseIdentifier:@"cell" forIndexPath:indexPath];

        cell.lbl.text = @"Data";

    return cell;
}

Sakshi Singla · Answer 2 · 2016-04-01T12:45:59.310

17

For 3 cells per row .. Add this code.

- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath
{
     return CGSizeMake(collectionView.frame.size.width/3.2 , 100);
}

edited Apr 01 '16 at 12:45

answered Sep 17 '15 at 07:58

Sakshi Singla

531
6
5

2

The `UICollectionViewDelegateFlowLayout` protocol is needed for this method. – Zane Helton Dec 29 '15 at 04:38
1

Yes,, We do need. Take a look at: https://developer.apple.com/library/ios/documentation/UIKit/Reference/UICollectionViewDelegateFlowLayout_protocol/ – Zane Helton Dec 31 '15 at 18:42
1

@SakshiSingla Why did you use 3.2 ? – Piyush Dubey Jun 07 '16 at 12:45
Just calculations ! – Sakshi Singla Jun 07 '16 at 13:10
Can you specify how u calculated, i want use same for calculations for 4 and 5 cells per row. Thanks – Santhosh S Kashyap May 29 '19 at 12:24

Vivek Bansal · Answer 3 · 2016-03-26T13:36:55.393

The more general approach to achieve n columns in collection view which is compatible in any orientation is

 func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize {

   // flow layout have all the important info like spacing, inset of collection view cell, fetch it to find out the attributes specified in xib file
   guard let flowLayout = collectionViewLayout as? UICollectionViewFlowLayout else {
        return CGSize()
    }

    // subtract section left/ right insets mentioned in xib view

    let widthAvailbleForAllItems =  (collectionView.frame.width - flowLayout.sectionInset.left - flowLayout.sectionInset.right)

    // Suppose we have to create nColunmns
    // widthForOneItem achieved by sunbtracting item spacing if any

    let widthForOneItem = widthAvailbleForAllItems / nColumns - flowLayout.minimumInteritemSpacing


    // here height is mentioned in xib file or storyboard
    return CGSize(width: CGFloat(widthForOneItem), height: (flowLayout.itemSize.height))
 }

Are you sure there aren't any other critical steps to get this method to work? The function doesn't call over here. — JCutting8, Feb 01 '20 at 13:08

score 12 · Answer 4 · answered Oct 04 '15 at 05:14

For Swift : 3 Rows per Column (By using @SakhshiSingla Answer)

override func numberOfSectionsInCollectionView(collectionView: UICollectionView) -> Int {
  return 1
}

override func collectionView(collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
    return 3
}

func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize
    {
        return CGSize(width: collectionView.frame.size.width/3.2, height: 100)
    }

score 3 · Answer 5 · answered Jun 07 '14 at 07:00

3

The Number of sections dictates how many cells will be in each row, assuming the cell size allows for it.

A section will always start a new row.

answered Jun 07 '14 at 07:00

themikola

124
3

Specify row and column number for UICollectionView

5 Answers5

Linked