检索并显示来自URL的多个图像

试用Swift3，Alamofire和AlamofireImage。我试图在桌面视图中显示一些Instagram图像。我有一个data.json文件的地方使用检索Alamofire其看起来像这样：检索并显示来自URL的多个图像

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

我有安装PlaceTableViewCell与UIImageView并将其附接至在相应的控制器的出口。

我也有一个PlaceTableViewController，其中包括：

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

在viewDidLoad()方法我称之为私有函数：

loadJson()

和功能如下：

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（我已经包含在我的项目中）下载每个图像，但是我可以在某种循环中执行此操作吗？我还想将每个图像显示在新的表格行中。任何建议和代码示例将不胜感激。

来源

2017-04-18 tommyd456

在该行的每个单元格中，使用AlamofireImage加载图像。如果你在'loadJSON（）'中执行它，你将预取所有的图像，这是真的，但如果用户不滚动查看它们中的每一个，你将预取任何东西。 – Larme

我建议您不要在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 
    } 
    } 
}

来源

2017-04-18 12:55:43 Rahul

谢谢。试图设置numberOfRowInSection时'places.count'给我0。任何想法如何确保在设置行数之前获取JSON数据？ – tommyd456

正在考虑在'loadJson（）'函数的末尾放置'self.tableView.reloadData（）'？ – tommyd456

在这种情况下，如果您要更新mainQueue上的图像，则不需要重新加载数据。 – Rahul

你可以在你的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! 
}

另外请注意，您将不得不重新加载tableview一旦你从API获得响应。

来源

2017-04-18 12:49:52

谢谢你。我没有真正使用xib文件。我应该在我的问题中提到。 – tommyd456

检索并显示来自URL的多个图像

回答

相关问题