테이블 뷰의 Fiverr에서 이미지로드

Question

안녕하세요, 저는 Xcode에서 애플리케이션을 만들고 있습니다. Firebase에서 이미지를 다운로드하고 테이블보기로 보여줍니다. 거기에 몇 가지 문제가 있습니다. 하지만 먼저 코드를 보여 드리겠습니다.

override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { 
    let cell = tableView.dequeueReusableCell(withIdentifier: "customCell", for: indexPath) as! FrontViewCell 

    cell.contentView.backgroundColor = UIColor.clear 

    //let whiteRoundedView : UIView = UIView(frame: CGRect(10, 8, self.view.frame.size.width - 20, 149)) 
    let whiteRoundedView: UIView = UIView(frame: CGRect(x: 10, y: 8, width: self.view.frame.width - 20, height: 200)) 
    whiteRoundedView.layer.backgroundColor = CGColor(colorSpace: CGColorSpaceCreateDeviceRGB(), components: [1.0, 1.0, 1.0, 0.8]) 
    whiteRoundedView.layer.masksToBounds = false 
    whiteRoundedView.layer.cornerRadius = 2.0 
    whiteRoundedView.layer.shadowOffset = CGSize(width: -1, height: 1) 
    whiteRoundedView.layer.shadowOpacity = 0.2 

    cell.contentView.addSubview(whiteRoundedView) 
    cell.contentView.sendSubview(toBack: whiteRoundedView) 

    //cell.categoryImageView.image = catImages[indexPath.row] 
    //print("Product \(allCats[indexPath.row].name)") 

    cell.categoryLabel.text = allCats[indexPath.row].name 

    if let n = allCats[indexPath.row].name{ 
     con?.storage?.reference(withPath: "categories/\(n).png").data(withMaxSize: 10 * 1024 * 1024, completion: { 
      data, error in 
      if error == nil{ 
       let im = UIImage(data: data!) 
       cell.categoryImageView.image = im 
       cell.layoutSubviews() 
      } 
      else{ 
       print("Error Downloading Image \(error?.localizedDescription)") 
      } 
     }) 
    } 
    return cell 
} 

위의 코드는 이미지를 셀의 imageView로 설정하는 코드입니다. 문제

1. 을 난 스크롤하고 다시 스크롤 이미지가 동일한 셀에서 다르다.
2. 테이블 뷰 스크롤이 매우 느립니다.

다음은 이러한 문제입니다. 이 문제를 어떻게 해결할 수 있는지 알려주세요. 라이브러리를 알고 있습니다. SDWebImage하지만 해당 라이브러리와 함께 Firebase 이미지를 다운로드하는 방법을 모르겠습니다. 이 문제를 도와주세요. 나는이 문제로 매우 지쳐있다. 나는 수면없이 지난 20 시간 동안 그것을 풀려고했지만 그렇게 할 수 없었다. 내가 뭘 잘못하고 어떻게 해결해야하는지 알려주세요. 감사.

Answer 1

항상 이미지를 다시 다운로드하기 때문에 TableView가 뒤떨어져 있습니다.

이것은 캐싱 문제입니다. 동일한 셀에서 이미지가 다르면 셀을 다시 사용하고 새 이미지를 다운로드하는 동안 이전 이미지를 사용하기 때문에 이미지를 nil로 재설정하면이 이미지를 변경할 수 있습니다.

그러나 캐싱 프레임 워크를 사용하려면이 두 가지 문제가 모두 수정되어야합니다. 예를 들어, 아마도 가장 좋은 방법은 SDWebImage입니다.

라이브러리를 사용하고 싶지 않은 경우 다음은 캐싱 이미지의 가장 기본적인 구현입니다.

let imageCache = NSCache<AnyObject, AnyObject>() 

extension UIImageView { 

    func loadImageUsingCacheWithUrlString(_ urlString: String) { 

     self.image = nil 

     //check cache for image 
     if let cachedImage = imageCache.object(forKey: urlString as AnyObject) as? UIImage { 
      self.image = cachedImage 
      return 
     } 

     //otherwise start the download 
     let url = URL(string: urlString) 
     URLSession.shared.dataTask(with: url!, completionHandler: { (data, response, error) in 

      //there was an error with the download 
      if error != nil { 
       print(error ?? "") 
       return 
      } 

      DispatchQueue.main.async(execute: { 

       if let downloadedImage = UIImage(data: data!) { 
        imageCache.setObject(downloadedImage, forKey: urlString as AnyObject) 

        self.image = downloadedImage 
       } 
      }) 

     }).resume() 
    } 

} 

사용법 :

cell.categoryImageView.loadImageUsingCacheWithUrlString("your firebase url string") 

편집 : 예, 중포 기지에 저장된 이미지를 다운로드하려면이 옵션을 사용할 수 있습니다.

편집 :이 코드는 문제를 해결할 것이지만 메모리 관리는 여기서는 고려하지 않습니다. 심각한 제작 앱의 경우 이미지 캐싱 전용 라이브러리를 살펴 보는 것이 좋습니다.

편집 : Firebase 설명서에서 SDWebImage와 함께 작동하는 방법을 보여주는 적절한 정보가 있다는 것을 눈치 챘습니다. 체크 아웃 : SDWebImage + Firebase