改变uicollectionviewcell的顺序

Posted 2023-03-14

【中文标题】改变uicollectionviewcell的顺序

【英文标题】：Change the sequence of uicollectionviewcell

【发布时间】：2015-03-20 10:53:26

【问题描述】：

我正在尝试将序列更改为在 collectionview 中呈现的单元格。默认情况下在垂直布局collectionview单元格显示在

1 2 3
4 5 6
7 8 9

我想要做的是通过以下方式改变这个顺序

1  2  3
6  5  4      <----- this order is reversed
7  8  9
12 11 10     <----- this order is reversed

谁能告诉我如何实现这种行为。

到目前为止，我已经实现了UICollectionViewFlowLayout 并试图操纵它的方法但没有成功

注意：所有项目只能在一个部分中加载

【问题讨论】：

你走在正确的道路上，你必须实现一个自定义的UICollectionViewLayout，这将为你完成这项工作；您需要专注于实现自定义的–centerForIndexPath:frame: 方法以实现所需的布局。

@holex 你能给我一个例子或参考吗？

网上有很多关于实现自定义布局的好例子......如果我是你，我会开始用谷歌搜索它。

【参考方案1】：

我通过继承UICollectionViewLayout 找到了解决方案，并计算了每个项目所需的框架。在prepareLayout 方法中。

以下代码仍有改进的余地。

-(void)prepareLayout
    NSInteger itemCount = [self.collectionView numberOfItemsInSection:0];
    NSMutableDictionary *layoutAttr = [NSMutableDictionary dictionary];
    CGFloat y=0,x=0;
    for (int i = 0; i<itemCount; i++) 
        NSIndexPath *indexPath = [NSIndexPath indexPathForItem:i inSection:0];
        UICollectionViewLayoutAttributes *attributes = [UICollectionViewLayoutAttributes layoutAttributesForCellWithIndexPath:indexPath];
        CGRect frame;
        if (indexPath.row == 0) 
            x= 0;
            y=0;
            frame = CGRectMake(x,  y, self.itemSize.width, self.itemSize.height);
            x += self.itemSize.width;
        else if (indexPath.row % 2 == 0 ) 
            y += self.itemSize.height;
            x -=self.itemSize.width;
            frame = CGRectMake(x,  y, self.itemSize.width, self.itemSize.height);
            if (x <= 0) 
                x += self.itemSize.width;
            else
                x -= self.itemSize.width;
            
        else
            frame = CGRectMake(x,  y, self.itemSize.width, self.itemSize.height);
            x += self.itemSize.width;
        
        attributes.frame=frame;

        attributes.zIndex = i;
        layoutAttr[indexPath] = attributes;
    
    layoutAttributes=layoutAttr;

【参考方案2】：

为了实现这一点，您需要构建自己的集合视图布局。首先阅读此处的文档：https://developer.apple.com/library/ios/documentation/WindowsViews/Conceptual/CollectionViewPGforIOS/CreatingCustomLayouts/CreatingCustomLayouts.html

否则，您可能会很幸运在http://cocoapods.org/ 上找到一个 我快速搜索了一下，结果一无所获。

正如理查德达斯所建议的......

这里有一个教程： http://skeuo.com/uicollectionview-custom-layout-tutorial

您还应该查看 WWDC 视频： http://devstreaming.apple.com/videos/wwdc/2014/232xxz8gxpbstio/232/232_hd_advanced_user_interfaces_with_collection_views.mov?dl=1

祝你好运！

【参考方案3】：

如何实现自定义 UICollectionFlowLayout

要了解如何开始使用自定义集合视图布局，我强烈推荐此链接：http://www.objc.io/issue-3/collection-view-layouts.html

首先继承 UICollectionViewLayout 并覆盖 layoutAttributesForItemAtIndexPath：

- (UICollectionViewLayoutAttributes *)layoutAttributesForItemAtIndexPath:(NSIndexPath *)indexPath

    CollectionViewDataSource *dataSource = self.collectionView.dataSource;
    id<CollectionViewDataSourceItem> item = [dataSource itemAtIndexPath:indexPath];
    UICollectionViewLayoutAttributes *attributes = [UICollectionViewLayoutAttributes layoutAttributesForCellWithIndexPath:indexPath];

    // here you can customise the frame of your item if it is on a row that is even
    if (indexPath.row % 2 == 0)
    
        CGFloat horizontalOffset = ???; // change to your new offset, positive or negative
        CGRect rect = CGRectOffset( attributes.frame, horizontalOffset, 0);
        attributes.frame = rect;
    
    return attributes;