UICollectionView自定义单元格布局

Question

I have a UICollectionView and I'm trying customize it a little.

Here's what I want:

Here's what I have:

I thought implementing sizeForItemAtIndexPath from UICollectionViewDelegate would be enough.

Here's what I'm doing: - I returning half of the screen's width for all the cell's widths - For the first and third cells I'm returning a height of 50 - For the second cell I'm returning a height of 100.

What am I doing wrong?

Answer 1

There is no way to do that with simple UICollectionViewDelegateFlowLayout methods. You have subclass from UICollectionViewFlowLayout .

Here is very dirty example how you can do this

@interface CVFlowLayout1 : UICollectionViewFlowLayout

@property (nonatomic, strong) NSDictionary *layoutInfo;

@end

@implementation CVFlowLayout1

- (instancetype)init
{
    if (self = [super init])
    {
        self.minimumLineSpacing = 0;
        self.minimumInteritemSpacing = 0;
    }
    return self;
}

- (void)prepareLayout
{
    NSMutableDictionary *newLayoutInfo = [NSMutableDictionary dictionary];
    NSMutableDictionary *cellLayoutInfo = [NSMutableDictionary dictionary];

    NSInteger sectionCount = [self.collectionView numberOfSections];
    NSIndexPath *indexPath = [NSIndexPath indexPathForItem:0 inSection:0];

    for (NSInteger section = 0; section < sectionCount; section++) {
        NSInteger itemCount = [self.collectionView numberOfItemsInSection:section];

        for (NSInteger item = 0; item < itemCount; item++) {
            indexPath = [NSIndexPath indexPathForItem:item inSection:section];

            UICollectionViewLayoutAttributes *itemAttributes =
            [UICollectionViewLayoutAttributes layoutAttributesForCellWithIndexPath:indexPath];
            itemAttributes.frame = CGRectMake(item == 1 ? [UIScreen mainScreen].bounds.size.width/2.0 : 0, section == 0 ? 0 : 50, [UIScreen mainScreen].bounds.size.width/2.0, item == 1 ? 100 : 50);

            cellLayoutInfo[indexPath] = itemAttributes;
        }
    }

    newLayoutInfo[@"Cell"] = cellLayoutInfo;

    self.layoutInfo = newLayoutInfo;
}

- (UICollectionViewLayoutAttributes *)layoutAttributesForItemAtIndexPath:(NSIndexPath *)indexPath
{
    return self.layoutInfo[@"Cell"][indexPath];
}

- (NSArray *)layoutAttributesForElementsInRect:(CGRect)rect
{
    NSMutableArray *allAttributes = [NSMutableArray arrayWithCapacity:self.layoutInfo.count];

    [self.layoutInfo enumerateKeysAndObjectsUsingBlock:^(NSString *elementIdentifier,
                                                         NSDictionary *elementsInfo,
                                                         BOOL *stop) {
        [elementsInfo enumerateKeysAndObjectsUsingBlock:^(NSIndexPath *indexPath,
                                                          UICollectionViewLayoutAttributes *attributes,
                                                          BOOL *innerStop) {
            if (CGRectIntersectsRect(rect, attributes.frame)) {
                [allAttributes addObject:attributes];
            }
        }];
    }];

    return allAttributes;
}

@end

just set instance of that class to your collectionView.flowLayout property

CVFlowLayout1 *layout = [[CVFlowLayout1 alloc] init];
[_collectionView setCollectionViewLayout:layout];