Setting size of UICollectionViewCell in a way that there is no interim spacing in between

Question

I\'m using an UICollectionView on which I want to place seven cells side by side. The whole screen should be used for this. Currently, I\'m using the width of the c

Answer 1

Try this out, declare these variables

  NSInteger insets_Top=5;
  NSInteger insets_Bottom=5;
  NSInteger insets_Left=5;
  NSInteger insets_Right=5; 

and add these methods

 - (CGSize)collectionView:(UICollectionView *)collectionView layout:   (UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:   (NSIndexPath *)indexPath
{
    CGRect screenRect = [[UIScreen mainScreen] bounds];
    CGFloat screenWidth = screenRect.size.width;
    CGSize img_size=CGSizeMake(screenWidth/num_items-   (insets_Right+insets_Left), screenWidth/num_items);
    return img_size;
}

  - (UIEdgeInsets)collectionView:
 (UICollectionView *)collectionView layout:  (UICollectionViewLayout*)collectionViewLayout insetForSectionAtIndex:  (NSInteger)section
   {
      return    UIEdgeInsetsMake(insets_Top,insets_Left,insets_Bottom,insets_Right);
   }

Here num_items=7 as in your case you want number of cells in a row to be 7

Answer 2

Try this!

Most importantly add UICollectionViewDelegateFlowLayout and UICollectionViewDelegate to your controller

Implement below methods for inset and sizeForItem for your cell size.

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForSectionAt section: Int) -> UIEdgeInsets {
    return UIEdgeInsetsMake(0, 0, 0, 0)
}

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
    // Here, I need 3 equal cells occupying whole screen width so i divided it by 3.0. You can use as per your need.
    return CGSize(width: UIScreen.main.bounds.size.width/3.0, height: UIScreen.main.bounds.size.width/3.0)                
}

For 0 spacing between cells, we need to specify it’s layout like this.

let layout: UICollectionViewFlowLayout = UICollectionViewFlowLayout()
layout.sectionInset = UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 0)
layout.minimumInteritemSpacing = 0
layout.minimumLineSpacing = 0
self.collectionView!.collectionViewLayout = layout

Thanks. Hope this helps!

Answer 3

Step 1: Implement UICollectionViewDelegateFlowLayout(if not done).

Step 2: Use delegate method of UICollectionViewDelegateFlowLayout.

func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize
{
return CGSizeMake((UIScreen.mainScreen().bounds.width)/7,120); //use height whatever you wants.
}

Step 3: Go to XIB or StoryBoard where you have your CollectionView.

Step 4: In XIB or StoryBoard where you have your CollectionView, click on CollectionView.

Step 5: Go to InterfaceBuilder, then in second last tab (ie: Size Inspector) set Min Spacing

For Cells = 0

For Lines = 0

That it.

Answer 4

As you already figured out it's impossible to divide a 320 point wide screen into 7 equal portions.

But if a cell is a half or even one point larger or smaller than another one nobody will notice. You can use a little bit of math to get integer pixel values (i.e. 0.5 points).

func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize {
    var size: CGSize!
    let column = indexPath.item % 7
    let width = collectionView.bounds.size.width
    let height = 80.0

    if width == 320.0 {
        // iPhone 5
        // 46 + 0,5 + 45 + 0,5 + 45 + 0,5 + 45 + 0,5 + 45 + 0,5 + 45 + 0,5 + 46
        if column == 0 || column == 6 {
            size = CGSize(width: 46, height: height)
        }
        else {
            size = CGSize(width: 45, height: height)
        }
    }
    else if width == 375.0 {
        // iPhone 6
        // 53 + 0,5 + 53 + 0,5 + 53 + 0,5 + 54 + 0,5 + 53 + 0,5 + 53 + 0,5 + 53
        if column == 3 {
            size = CGSize(width: 54, height: height)
        }
        else {
            size = CGSize(width: 53, height: height)
        }
    }
    else if width == 414.0 {
        // iPhone 6 Plus
        // 58 + 0,5 + 59 + 0,5 + 59 + 0,5 + 59 + 0,5 + 59 + 0,5 + 59 + 0,5 + 58
        if column == 0 || column == 6 {
            size = CGSize(width: 58, height: height)
        }
        else {
            size = CGSize(width: 59, height: height)
        }
    }
    else {
        println("Unhandled Width: \(width)")
        abort()
    }
    return size
}

That's just an example, that I had ready because I am currently working on a calendar view. It has a 1 pixel spacing between each cell. For a 320 pt wide cell layout without spacing you could use something like 45.5+45.5+46+46+46+45.5+45.5