How to remove the margin between two UICollectionView columns

Question

I have UICollectionView in which I would like to have no spacing between the cells. However despite my all effort I can't seem to remove the the space,

enter image description here

Code

- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout minimumInteritemSpacingForSectionAtIndex:(NSInteger)section
{
    return 0;
}

- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout minimumLineSpacingForSectionAtIndex:(NSInteger)section
{
    return 0;
}

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

Extra Info

Cell width is 234
UICollectionView width is 703

Hint is in the method name, this is the 'minimum' spacing between items. The CollectionView will decide how big the gap will be down to that amount. I think you will need to create your own UICollectionViewLayout — Tim, Jan 22 '14 at 11:26
I'm not sure that theMoonlitKnight is correct. I have a working example, absolutely basic, created from the single view app template for the iPad, using your dimensions, with a default flow layout that shows that no gap is possible and controllable with the minimum... delegate methods you've included above. Have you logged that code to verify that it's being called? — Murray Sagal, Jan 23 '14 at 06:49

score 25 · Answer 1 · edited May 23 '17 at 10:31

25

From this. You need to change minimumInteritemSpacing and minimumLineSpacing.

UICollectionViewFlowLayout *flow = [[UICollectionViewFlowLayout alloc] init];
flow.itemSize = CGSizeMake(cellWidth, cellHeight);
flow.scrollDirection = UICollectionViewScrollDirectionHorizontal;
flow.minimumInteritemSpacing = 0;
flow.minimumLineSpacing = 0;
mainCollectionView.collectionViewLayout = flow;

edited May 23 '17 at 10:31

Community

1
1

answered Oct 21 '14 at 13:33

Hsm

1,510
17
16

Fahim Parkar · Answer 2 · 2015-09-28T05:34:40.490

Below did trick for me.

UICollectionViewFlowLayout *flow = [[UICollectionViewFlowLayout alloc] init];
flow.itemSize = CGSizeMake(360*iPhoneFactorX, 438*iPhoneFactorX);
flow.scrollDirection = UICollectionViewScrollDirectionHorizontal;
flow.minimumInteritemSpacing = 0;
flow.minimumLineSpacing = 0;


[mainCollectionView reloadData];
mainCollectionView.collectionViewLayout = flow;

Last line is very important where we are assigning the layout

Shrawan · Answer 3 · 2017-01-17T17:12:43.037

2

I have fixed similar issue by unchecking "Relative to margin" in size inspector.

Change the spacing in storyBoard or programmatically.

or

   func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAt section: Int) -> CGFloat {
        return 0
    }

edited Jan 17 '17 at 17:12

answered Nov 12 '16 at 14:53

Shrawan

7,128
4
29
40

score 1 · Answer 4 · answered Jan 22 '14 at 19:02

You can't do that with the default UICollectionViewFlowLayout. Although you can use another layout, like a subclass of it. I'm using this class to set the spacing explicitly:

@implementation FlowLayoutExt
@synthesize maxCellSpacing;

- (NSArray *)layoutAttributesForElementsInRect:(CGRect)rect {
    NSArray* attributesToReturn = [super layoutAttributesForElementsInRect:rect];
    for (UICollectionViewLayoutAttributes* attributes in attributesToReturn) {
        if (nil == attributes.representedElementKind) {
            NSIndexPath* indexPath = attributes.indexPath;
            attributes.frame = [self layoutAttributesForItemAtIndexPath:indexPath].frame;
        }
    }
    return attributesToReturn;
}

- (UICollectionViewLayoutAttributes *)layoutAttributesForItemAtIndexPath:(NSIndexPath *)indexPath {
    UICollectionViewLayoutAttributes* currentItemAttributes =
    [super layoutAttributesForItemAtIndexPath:indexPath];

    UIEdgeInsets sectionInset = [(UICollectionViewFlowLayout *)self.collectionView.collectionViewLayout sectionInset];

    if (indexPath.item == 0) { // first item of section
//        CGRect frame = currentItemAttributes.frame;
//        frame.origin.x = sectionInset.left; // first item of the section should always be left aligned
//        currentItemAttributes.frame = frame;

        return currentItemAttributes;
    }

    NSIndexPath* previousIndexPath = [NSIndexPath indexPathForItem:indexPath.item-1 inSection:indexPath.section];
    CGRect previousFrame = [self layoutAttributesForItemAtIndexPath:previousIndexPath].frame;
    CGFloat previousFrameRightPoint = previousFrame.origin.x + previousFrame.size.width + maxCellSpacing;

    CGRect currentFrame = currentItemAttributes.frame;
    CGRect strecthedCurrentFrame = CGRectMake(0,
                                              currentFrame.origin.y,
                                              self.collectionView.frame.size.width,
                                              currentFrame.size.height);

    if (!CGRectIntersectsRect(previousFrame, strecthedCurrentFrame)) { // if current item is the first item on the line
        // the approach here is to take the current frame, left align it to the edge of the view
        // then stretch it the width of the collection view, if it intersects with the previous frame then that means it
        // is on the same line, otherwise it is on it's own new line
        CGRect frame = currentItemAttributes.frame;
        frame.origin.x = sectionInset.left; // first item on the line should always be left aligned
        currentItemAttributes.frame = frame;
        return currentItemAttributes;
    }

    CGRect frame = currentItemAttributes.frame;
    frame.origin.x = previousFrameRightPoint;
    currentItemAttributes.frame = frame;
    return currentItemAttributes;
}

score 0 · Answer 5 · edited Aug 24 '17 at 15:57

0

Actually, you won't be able to set a parameter to achieve your goal using UICollectionViewFlowLayout because it plays with the cell spacing to properly align all items in the screen, and that's the reason why they set the cells spacing as a minimum. If your cell size are fixed you can play with the ViewCollection Size so that all cells and margins perfectly fit in it.

edited Aug 24 '17 at 15:57

Tim Ferrell

1,348
3
17
40

answered Aug 24 '17 at 14:26

Alvaro Menoni

67
8

score -1 · Answer 6 · answered Jan 22 '14 at 18:41

-1

Try setting 0(zero) to the properties of UICollectionView: Min Spacing For Cells and For Lines

answered Jan 22 '14 at 18:41

Henrique Güttler Morbin

357
1
12

How to remove the margin between two UICollectionView columns

6 Answers6

Linked