我如何在UICollectionViewFlowLayout中为每个单元格添加标题/标签补充视图

Question

我看到的所有示例都使用补充视图作为页眉或页脚。我需要在流布局的每个单元格上方和/或下方添加一个标签。

起初我以为我所要做的是注册一个类的补充视图的类型，然后实现 collectionviewforaddientaryelementofkindatindexpath ，我很好去，但似乎FlowLayout开箱只支持页眉和页脚。

apple文档似乎建议更多的东西将需要一个子类化FlowLayout。

由于我不想重新工作苹果已经完成了流布局，因为我的单元格预计大小不同，我想扩展流布局，以支持每个单元格的供应视图。

我认为我应该能够通过子类化UICollectionViewFlowLayout来实现这一点。

但是我不确定如何告诉流布局要求每个单元格的补充视图。简单地为供应视图注册一个类并不会强制布局调用 layoutattributesforsupplements viewofkind 。目前，它从未在我的子类中被调用。我想如果我为一个供应视图注册一个类，它应该为我的部分中的每个项目请求供应视图…这似乎是一个错误的假设。

我看过一个很棒的自定义布局示例，其中使用nsdictionary手动管理布局，但我不确定如何将这些知识应用于内置流布局。

Answer 1

那么，您需要为每个单元格添加描述可重用视图的属性。您可以根据布局单元格时已经存在的属性为每个单元格添加这些属性。你可以在layoutAttributesForElementInRect中这样做。

- (NSArray *)layoutAttributesForElementsInRect:(CGRect)rect
{
    //first get a copy of all layout attributes that represent the cells. you will be modifying this collection.
    NSMutableArray *allAttributes = [[super layoutAttributesForElementsInRect:rect] mutableCopy]; 
    //go through each cell attribute
    for (UICollectionViewLayoutAttributes *attributes in [super layoutAttributesForElementsInRect:rect])
    {
        //add a title and a detail supp view for each cell attribute to your copy of all attributes
        [allAttributes addObject:[self layoutAttributesForSupplementaryViewOfKind:SomeCellDetailsKind atIndexPath:[attributes indexPath]]];
        [allAttributes addObject:[self layoutAttributesForSupplementaryViewOfKind:SomeCellTitleKind atIndexPath:[attributes indexPath]]];
    }
    //return the updated attributes list along with the layout info for the supp views
    return allAttributes;
}
-(UICollectionViewLayoutAttributes*) layoutAttributesForSupplementaryViewOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath{
    //create a new layout attributes to represent this reusable view
    UICollectionViewLayoutAttributes *attrs = [UICollectionViewLayoutAttributes layoutAttributesForSupplementaryViewOfKind:kind withIndexPath:indexPath];
    if(attrs){
        //get the attributes for the related cell at this index path
        UICollectionViewLayoutAttributes *cellAttrs = [super layoutAttributesForItemAtIndexPath:indexPath];
        if(kind == SomeCellDetailsKind){
            //position this reusable view relative to the cells frame
            CGRect frame = cellAttrs.frame;
            frame.origin.y += (frame.size.height - _detailHeight);
            frame.size.height = _detailHeight;
            attrs.frame = frame;
        }
        if(kind == SomeCellTitleKind){
            //position this reusable view relative to the cells frame
            CGRect frame = cellAttrs.frame;
            frame.origin.y -= _titleHeight; //+= frame.size.height; //( - frame.size.height;
            frame.size.height = _titleHeight;
            attrs.frame = frame;
        }
    }
    return attrs;
}

然后你可以实现collectionviewforsupplements yelementofkindatindexpath来描述视图应该是什么样子。

就像Derrick Hathaway提到的，流布局不会考虑到辅助视图的高度大小行高度，所以一定要适当调整集合视图上的最小行高度。