UICollectionview 中的不同单元格大小

Posted 2023-03-11

【中文标题】UICollectionview 中的不同单元格大小

【英文标题】：Different cell size in UICollectionview

【发布时间】：2013-04-17 13:46:07

【问题描述】：

在我的 iphone 应用程序中，我在集合视图中显示图像。 我从 url 获取图像，使用 url 我也得到图像大小。 例如：- 假设有横向和纵向两种图像。纵向图像的值为 P，横向图像的值为 L

如何自定义collectionView单元格的大小？

【问题讨论】：

您可以查看github.com/bryceredd/RFQuiltLayout。看起来你可以用这个

【参考方案1】：

使用这个UICollectionViewDelegateFlowLayout方法

 - (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath;

【讨论】：

谢谢。我被困在这里，并打开一个新项目进行测试和工作。

附言。 UICollectionViewDelegateFlowLayout 包括 UICollectionViewDataSource 和 UICollectionViewDelegate，因此您只需将 添加到您的委托声明中。

【参考方案2】：

1) 您可以维护和交换多个布局对象，但有一种更简单的方法。只需将以下内容添加到您的 UICollectionViewController 子类并根据需要调整大小：

- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath
    
    // Adjust cell size for orientation
    if (UIDeviceOrientationIsLandscape([[UIApplication sharedApplication] statusBarOrientation])) 
        return CGSizeMake(170.f, 170.f);
    
    return CGSizeMake(192.f, 192.f);


- (void)didRotateFromInterfaceOrientation:(UIInterfaceOrientation)fromInterfaceOrientation

    [self.collectionView performBatchUpdates:nil completion:nil];

调用 -performBatchUpdates:completion: 将使布局无效并使用动画调整单元格的大小（如果您没有额外的调整要执行，您可以将 nil 传递给两个块参数）。

2) 无需在-collectionView:layout:sizeForItemAtIndexPath 中硬编码项目大小，只需将collectionView 边界的高度或宽度除以您希望在屏幕上显示的单元格数即可。如果您的UICollectionView 水平滚动，则使用高度；如果垂直滚动，则使用宽度。

【参考方案3】：

这就是我所做的。我首先根据屏幕的大小设置单元格的大小（这样我们就可以得到每行的最佳图像数量）。您可能需要更改数字以适合您的原因。

-(CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath
CGFloat widthOfCell =(self.view.frame.size.width-30)/2;
CGFloat heightOfCell =widthOfCell * 1.33;
CGSize returnValue = CGSizeMake(widthOfCell, heightOfCell);
returnValue.height += 5; 
returnValue.width += 5; 
return returnValue;

然后我使用图像处理方法来确定横向或纵向状态，并且（对于我的应用）我决定将每张图片都设为纵向：

    if (sourceImage.size.width>sourceImage.size.height) 
    sourceImage = [[UIImage alloc] initWithCGImage: sourceImage.CGImage
                                             scale: 1.0
                                       orientation: UIImageOrientationRight];
    

如果您想反过来，请将> 替换为<

CAVEAT：我的旋转方法没有考虑图片是指向左还是右。换句话说，如果图像是倒置的横向，我的代码将无法识别。我希望其他人可以帮助你，但我希望我没有偏离轨道！ :)

【参考方案4】：

为了快速将流程布局扩展到您的视图控制器，如果您需要在单元格上显示动态图像，请制作变量，将图像名称保存到您的视图控制器中并使用：

let imageData = ["image1","image2","image3","image4"]

extension yourViewController: UICollectionViewDataSource,UICollectionViewDelegate,UICollectionViewDelegateFlowLayout
  func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize 

    let photo = UIImage(named: imageData[indexPath.row])
        return CGSize(width: (photo?.size.width)!, height: (photo?.size.height)!)