使用 AlamofireImage 进行图片缓存

2025年3月17日 | 阅读 3 分钟

在本教程的前面部分，我们构建了一个应用程序，在该应用程序中，我们需要从 URL (由 API 发送) 下载图像并将其设置在图像视图上。然而，我们使用以下代码在 tableview DataSource 方法中实时下载了所有图像。

cell.artistImgView.image = try UIImage(data: Data(contentsOf: URL(string: artistData.artworkUrl60!) ?? URL(string: "http://www.google.com")!))

如果我们观察该应用程序，在 tableview 中滚动是一项非常繁琐的任务，因为图像是在主线程上下载的。然而，如果我们在运行时继续从图像 URL 下载和设置图像，该问题将持续存在。

为了解决这个问题，我们可以使用 AlamofireImage，它简化了图像下载任务。在这里，我们可以使用它来下载图像，同时我们可以使用 NSCache 将图像添加到缓存中。

设置

AlamofireImage 在 Alamofire 的基础上工作，这意味着我们需要安装这两个库才能使用 AlamofireImage。我们可以使用 Podfile 安装 AlamofireImage，在其中我们将添加以下行。

AlamofireImage 的 Pod 安装完成后，我们可以使用 swift 中的 import 语句导入它。

import Alamofire
import AlamofireImage

要使用 AlamofireImage 下载图像，首先，我们需要使用以下代码设置缓存。

let imageCache = AutoPurgingImageCache( memoryCapacity: 111_111_111, preferredMemoryUsageAfterPurge: 90_000_000)

现在，我们需要请求下载图像。为此，我们使用 Alamofire 的请求方法。

Alamofire.request(self.nameUrl[i]).responseImage { response in                    
if response.result.value != nil {                        
let image = UIImage(data: response.data!, scale: 1.0)!                        imageCache.add(image, withIdentifier: self.nameUrl[i])                    }    }

由于我们已将图像添加到图像缓存中，因此在将其填充到图像视图时，我们需要从缓存中检索它。

if let image = imageCache.image(withIdentifier: self.nameUrl[self.a]){   
         self.localImageView.image = image        
}

示例

在这里，我们将继续使用我们在本教程的前面部分创建的 ArtistProject。但是，这次我们将存储要加载到 tableview 中的所有图像，在图像缓存中，并在加载图像时使用该图像缓存。

但是，我们将对 ViewController.swift 文件进行一些更改。项目的所有其他文件将保持不变。

ViewController.swift

import UIKit
import Alamofire
import AlamofireImage


class ViewController: UIViewController {


    @IBOutlet weak var tableView: UITableView!
    
    var artist = Array<Results>()
    let imageCache = AutoPurgingImageCache(memoryCapacity: 111_111_111, preferredMemoryUsageAfterPurge: 90_000_000)
    
    
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
        loadJsonData()
        tableView.delegate = self
        tableView.dataSource = self
        //tableView.rowHeight = UITableView.automaticDimension
    }
    func loadJsonData()
    {
       Alamofire.request("https://itunes.apple.com/search?media=music&term=bollywood").responseJSON { (response) in
            //print("Response value \(response)")
        do{
            if(response.result.isSuccess){
                let result: ArtistResponseModel = try JSONDecoder().decode(ArtistResponseModel.self, from: response.data!)
                debugPrint(result)
                self.artist = result.results ?? []
                for i in result.results ?? []{
                    Alamofire.request(i.artworkUrl60!).responseImage { (response) in
                        if response.result.value != nil{
                            let image = UIImage(data: response.data!, scale: 1.0)
                            self.imageCache.add(image!, withIdentifier: i.artworkUrl60! )
                        }
                    }
                }
                self.tableView.reloadData()
        }
            
        }catch{
            
        }
        }
        
    }
    
    
}


extension ViewController : UITableViewDataSource{
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return artist.count
    }
    
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: "MainTableViewCell") as! MainTableViewCell
        if(artist.count > 0){
             let artistData = artist[indexPath.row]
                cell.artistImgView.image = imageCache.image(withIdentifier: artistData.artworkUrl60!)
                cell.trackName.text = artistData.trackName
                cell.artisName.text = artistData.artistName
                cell.artistCountry.text = artistData.country


        }
        return cell
        
    }
    
    
}
extension ViewController : UITableViewDelegate{
    func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
        return 220
    }
    
}

现在，如果我们运行该项目，在滚动时我们将不会遇到任何问题，因为这次我们没有在运行时下载图像；但是，我们正在从缓存中检索图像。

单击此处下载项目

下一主题下拉刷新功能