滚动时collectionView单元格图像更改 - 快速 - 以编程方式答案

【问题标题】：collectionView cell Image change when scrolling - swift - programmatically滚动时collectionView单元格图像更改 - 快速 - 以编程方式
【发布时间】：2021-02-09 18:24:33
【问题描述】：

我需要使用我在初始化期间传递的URL 在UIcollectionViewcell 中加载一个 ImageView：

func configureCellWith(messageModel : MessageModel){
    
    guard let url = URL(string: messageModel.contentUrl!) else { return }
    
    if url.isURLPhoto(){
        likedImageView.sd_setImage(with: url, placeholderImage: nil)
    }
    else if url.isURLVideo(){
        getThumbnailImageFromVideoUrl(url: url) { (image) in
            self.likedImageView.image = image
    }
}

如果 url 是视频我需要使用这种方法以这种方式加载图像：

func getThumbnailImageFromVideoUrl(url: URL, completion: @escaping ((_ image: UIImage?)->Void)) {
    DispatchQueue.global().async {
        let asset = AVAsset(url: url)
        let avAssetImageGenerator = AVAssetImageGenerator(asset: asset)
        avAssetImageGenerator.appliesPreferredTrackTransform = true
        let thumnailTime = CMTimeMake(value: 2, timescale: 1)
        do {
            let cgThumbImage = try avAssetImageGenerator.copyCGImage(at: thumnailTime, actualTime: nil)
            let thumbNailImage = UIImage(cgImage: cgThumbImage)
            DispatchQueue.main.async {
                completion(thumbNailImage)
            }
        } catch {
            print(error.localizedDescription)
            DispatchQueue.main.async {
                completion(nil)
            }
        }
    }
}

可见，我检索了视频的初始帧并将其加载到单元格中，显然由于它是一个异步函数，因此加载图像需要一些时间，这没有问题。

当我滚动浏览集合时出现问题，我看到某些单元格显示的图像与正确的不对应。

在线搜索我发现我需要清除单元格的prepareForReuse中的图像，所以我做了（如果图像是通过sd_setImage加载的，尽管getThumbnailImageFromVideoUrl 函数加载）：

override func prepareForReuse() {
    super.prepareForReuse()
    self.likedImageView.image = UIImage()
    self.likedImageView.image = nil
    self.likedImageView.sd_cancelCurrentImageLoad()
    
}

但是当我滚动到collection view 时，我仍然得到图像不匹配，这可能是什么问题？

【问题讨论】：

标签： swift uicollectionview uiimageview uicollectionviewcell sdwebimage

【解决方案1】：

我认为问题不在于图像，我猜它与视频缩略图有关。您在后台线程上同步生成缩略图，但是在将其设置回 imageView 时，您从不费心去查找单元格是否被重用以及您刚刚创建的图像是否已过时。

所以在你的牢房里

var  currentModel: MessageModel! = nil //declare a instance variable to hold model
... other code

func configureCellWith(messageModel : MessageModel){
    self.currentModel = messageModel //keep a copy of model passed to u as argument

    guard let url = URL(string: messageModel.contentUrl!) else { return }
    
    if url.isURLPhoto(){
        likedImageView.sd_setImage(with: url, placeholderImage: nil)
    }
    else if url.isURLVideo(){
        getThumbnailImageFromVideoUrl(url: url) { (image) in
            self.likedImageView.image = image
    }
}

终于在getThumbnailImageFromVideoUrl

func getThumbnailImageFromVideoUrl(url: URL, completion: @escaping ((_ image: UIImage?)->Void)) {
        DispatchQueue.global().async {
            let asset = AVAsset(url: url)
            let avAssetImageGenerator = AVAssetImageGenerator(asset: asset)
            avAssetImageGenerator.appliesPreferredTrackTransform = true
            let thumnailTime = CMTimeMake(value: 2, timescale: 1)
            do {
                let cgThumbImage = try avAssetImageGenerator.copyCGImage(at: thumnailTime, actualTime: nil)
                let thumbNailImage = UIImage(cgImage: cgThumbImage)
                if url.absoluteString == currentModel.contentUrl { //check if image you generated is still valid or its no longer needed
                    DispatchQueue.main.async {
                        completion(thumbNailImage)
                    }
                }
            } catch {
                print(error.localizedDescription)
                DispatchQueue.main.async {
                    completion(nil)
                }
            }
        }

【讨论】：