檢索並顯示來自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的多個圖像

回答

相關問題