带有图像数组的 UICollectionView 设置正确

Posted 2023-03-10

【中文标题】带有图像数组的 UICollectionView 设置正确

【英文标题】：UICollectionView with array of images set it right

【发布时间】：2017-08-09 12:56:40

【问题描述】：

我有一个问题。在 UICollectionView 内，我有 UIImage 和 Content Mode - Aspect Fit ... 现在我需要在 UICollectionView 中显示一个靠近另一个的图像。现在他们之间有很大的空间。

extension UserDetailInformationOfAnimalViewController: UICollectionViewDelegate, UICollectionViewDataSource, UICollectionViewDelegateFlowLayout 
func numberOfSections(in collectionView: UICollectionView) -> Int 
    return 1


//MARK: - Collections
func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int 
    let post = postsArray[collectionView.tag]
    //        print("count: ", post.imagesLink.count)
    return post.imageLinks.count


func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell 
    let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "cell", for: indexPath) as! CollectionViewCell

    let post = postsArray[collectionView.tag]
    //        print("postArrayPhotos: ", post.imagesLink.count)
    if post.imageLinks.count != 0 
        //            print("POST = ", post)
        //            print("Look here: ", post.imagesLink[indexPath.row].imageLink)
        //            print("IMAGELINK = ", post.imagesLink[indexPath.row].imageLink)
        let imageLink = post.imageLinks[indexPath.row]

        if imageLink.imageLink != nil 
            let url = URL(string: imageLink.imageLink!)
            print("IMAGELINK = ", imageLink)

            cell.imageOfAnimalInCollectionView.sd_setImage(with: url!, placeholderImage: UIImage(named: "App-Default"),options: SDWebImageOptions(rawValue: 0), completed:  (image, error, cacheType, imageURL) in
            )
        
    

    return cell


func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize 
    let height = self.view.frame.size.height;
    let width  = self.view.frame.size.width;
    // in case you you want the cell to be 40% of your controllers view
    return CGSize(width: width, height: height * 0.35)
  

【问题讨论】：

UICollection horizontally scroll, so reduce the space between cell item的可能重复

没有，我很早就看到了，但是没有用。

我会检查当前的单元格框架，它可能与您设置的一样正确，但图像的宽度比您的单元格小。同样对于带有收藏视图的图片库，我将一个单元格用于一个部分，因此部分数 = 项目数。

【参考方案1】：

使用此方法动态设置单元格宽度

func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize 
    if indexPath.row == whatever you want 
        return CGSize(width: collectionView.frame.size.width/2, height: collectionView.frame.size.width/2)
    

【讨论】：

你能展示你的代码，你用来在你的应用程序中设置图像吗？

另外，如果您不使用任何东西从代码进行设置。尝试使用，约束并保持纵横比和宽度和高度。这绝对适合你

这样试试HomeViewController:UICollectionViewDelegate,UICollectionViewDataSource,UICollectionViewDelegateFlowLayout magin 将由UICollectionViewDelegateFlowLayout 完成

添加我的代码。我认为 func sizeForItemAt 打破了一切。

检查使用方面填充，看看是否相应地填充空间？如果是这样，那么它的不同问题

【参考方案2】：

我了解您的问题。在这里，我给你一个方法。此解决方案可能对您无效，但它会让您知道如何解决它。主要概念是您必须根据图像返回单元格大小。但立即图像不在您的手中。它在服务器上。所以你可以先返回一个演示或占位符图像高度，然后在完成从服务器下载实际图像后告诉集合视图根据实际图像大小重新布局单元格。

 cell.imageOfAnimalInCollectionView.sd_setImage(with: url!, placeholderImage: UIImage(named: "App-Default"),options: SDWebImageOptions(rawValue: 0), completed:  (image, error, cacheType, imageURL) in
           //told the collection view to relayout according to image size
           collectionView.collectionViewLayout.invalidateLayout()          
    )

public func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize 
        let cell = collectionView.cellForItem(at: indexPath) as! CollectionViewCell
        return cell.imageOfAnimalInCollectionView.image.size! // Put your logic here, until actual image download from server you can return a default size.
    

【讨论】：

谢谢！我会尝试弄清楚它是如何工作的并尝试使用它。