Swift 从URL检索和显示多个图像

使用Swift3、阿拉莫菲尔和阿拉莫菲尔图像进行实验。我试图在tableview中显示一些Instagram图像。我有一个

data.json

文件，其中包含位置，使用Alamofire检索，如下所示：

{
  "places" : [
    { "name" : "place1", "url" : "http://instagramImage1.jpg" },
    { "name" : "place2", "url" : "http://instagramImage2.jpg" },
    { "name" : "place3", "url" : "http://instagramImage3.jpg" },
  ]
}

private func loadJson() {
    Alamofire.request("https://example.com/data.json").responseJSON { response in
        if let JSON = response.result.value as? [String : Any],
            let places = JSON["places"] as? [[String : String]] {
            for place in places {
                //should I call loadImage() function here?
            }
        }
    }
}

我用

UIImageView

设置了

PlaceTableViewCell

，并将其连接到相应控制器中的一个插座上

我还有一个

PlaceTableViewController

，其中包括：

var places = [Place]() //empty array to store places

在

viewDidLoad（）

方法中，我调用一个私有函数：

loadJson()

函数如下所示：

{
  "places" : [
    { "name" : "place1", "url" : "http://instagramImage1.jpg" },
    { "name" : "place2", "url" : "http://instagramImage2.jpg" },
    { "name" : "place3", "url" : "http://instagramImage3.jpg" },
  ]
}

private func loadJson() {
    Alamofire.request("https://example.com/data.json").responseJSON { response in
        if let JSON = response.result.value as? [String : Any],
            let places = JSON["places"] as? [[String : String]] {
            for place in places {
                //should I call loadImage() function here?
            }
        }
    }
}

对于JSON文件中的每个位置，我都有一个模型：

import UIKit

class Place {

    var name: String
    var url: String

    init?(name: String, url: String) {
        self.name = name
        self.url = url     
    }

}

问题

---

我不知道接下来该怎么办。我想使用AlamofireImage（我已经包含在我的项目中）来下载每个图像，但是我可以在某种循环中这样做吗？我还想在一个新的表行中显示每个图像。任何建议和代码示例都将不胜感激。

您可以在tableview控制器中使用以下代码来填充单元格中的图像。为此，您还需要在tableview中创建一个单元格或使用xib创建自定义单元格。我的代码是用于从xib加载自定义单元格的。请看

 //MARK:- TableView Delegate and DataSource
func tableView(_ tableView: UITableView, numberOfRowsInSection sectionIndex: Int) -> Int {
    return places.count
}

func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
    return 200//or cell height you want
}

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
     var cell  = tableView.dequeueReusableCell(withIdentifier: "PlaceCell") as? PlaceCell
    if cell == nil {
        cell = (loadFromNibNamed(viewClass: PlaceCell.self) as! PlaceCell)
    }

    cell?.ivCategory.af_setImage(withURL: URL(string: places[indexPath.row].url)) 
    return cell!
}

---

还请注意，一旦从api获得响应，就必须重新加载tableview。

我建议不要在

loadJSON

中获取图像

为什么？

• 在最初的请求中可能会有大量照片返回，用户甚至可能永远不会在应用程序中向下滚动到足以看到其中一些照片的程度

• 最重要的是，如果同时初始化了太多的请求，则在等待其他请求完成时，某些请求可能会超时。所以这可能不是最好的解决方案

那么，现在来看解决方案。只下载用户试图查看的单元格的图像数据是有意义的

TableView

只有一个用于此目的的委托方法

optional func tableView(_ tableView: UITableView, 
        willDisplay cell: UITableViewCell, 
           forRowAt indexPath: IndexPath)

使用此方法加载图像

extension ViewController: UITableViewDelegate {
   func tableView(_ tableView: UITableView, 
        willDisplay cell: UITableViewCell, 
           forRowAt indexPath: IndexPath) {

    let photoURL = places[indexPath.row].url

    // fetch this photo from web using URL

    // get the table view cell and update the image
     if let cell = self.tableView.cellForRow(at: indexPath) as UITableViewCell {
         cell.imageView.image = //fetchPhoto
     }   
    }
}

---

在行的每个单元格中，使用AlamofireImage加载图像。如果您在

loadJSON（）

中执行此操作，您将预取所有图像，这是真的，但是如果用户不滚动查看每一个图像，您将免费预取。谢谢。我实际上并没有使用xib文件。我应该在我的问题中提到。谢谢<代码>位置。尝试设置NumberOfRowInstition时，count给了我0。知道我如何确保在设置行数之前提取JSON数据吗？我正在考虑将

self.tableView.reloadData（）

放在

loadJson（）

函数的末尾？在这种情况下，如果在mainQueue上更新图像，则不需要重新加载数据。要首先获取位置结果，将其放入viewDidLoad并获取mainQueue上的数据，然后重新加载tableView数据源。现在只需尝试扩展。这是用Swift3写的吗？