UICollectionViewFlowLayout subclass to vertically align cells at the bottom edge.

gistfile1.m

@interface MTLibraryCollectionViewFlowLayout : UICollectionViewFlowLayout
@end

gistfile2.m

@implementation MTLibraryCollectionViewFlowLayout

- (NSArray *)layoutAttributesForElementsInRect:(CGRect)rect;
{
  NSArray *attrs = [super layoutAttributesForElementsInRect:rect];
  for (UICollectionViewLayoutAttributes *element in attrs) {
    if (element.representedElementCategory == UICollectionElementCategoryCell) {
      CGRect frame = element.frame;
      // Get the diff between the ideal height and the actual thumbnail height.
      CGFloat deltaY = self.itemSize.height - CGRectGetHeight(frame);
      // As the element is already centered, the delta should take that into account.
      deltaY = ceilf(deltaY / 2.0);
      // Offset and be done with it.
      element.frame = CGRectOffset(frame, 0, deltaY);
    }
  }
  return attrs;
}

@end

Hello @alloy,

Your code didn't work for me because the call to self.itemSize.height did not give the correct value. I found the following code would be much simpler and works without relying on this API.

class AlignBottomCollectionViewFlowLayout: UICollectionViewFlowLayout {

    override func layoutAttributesForElementsInRect(rect: CGRect) -> [UICollectionViewLayoutAttributes]? {
        let attrs = super.layoutAttributesForElementsInRect(rect)
        var attrsCopy = [UICollectionViewLayoutAttributes]()
        for  element in attrs! {
            let elementCopy = element.copy() as! UICollectionViewLayoutAttributes
            if (elementCopy.representedElementCategory == .Cell) {
                elementCopy.frame.origin.y = elementCopy.frame.origin.y * 2.0
            }

            attrsCopy.append(elementCopy)
        }

        return attrsCopy
    }
}

Essentially all you need to do is double the top margin because, assuming the cell is centered, that's all that's required to bottom along each cell. Hope this works for you and anyone else trying to solve this annoying problem, which I personally think is a bug in with Apple because setting sectionOffset should really do the trick (if all cells are the same height).

Thanks for getting me down the right path though!

Swift 3 version:

class AlignBottomCollectionViewFlowLayout: UICollectionViewFlowLayout {
    
    override func layoutAttributesForElements(in rect: CGRect) -> [UICollectionViewLayoutAttributes]? {
        let attrs = super.layoutAttributesForElements(in: rect)
        var attrsCopy = [UICollectionViewLayoutAttributes]()
        for  element in attrs! {
            let elementCopy = element.copy() as! UICollectionViewLayoutAttributes
            if (elementCopy.representedElementCategory == .cell) {
                elementCopy.frame.origin.y = elementCopy.frame.origin.y * 2.0
            }
            
            attrsCopy.append(elementCopy)
        }
        
        return attrsCopy
    }
}

Great idea!

Works great in theory but is still a hack and can't be animated between layouts