如何从URL加载图像并将其显示在tableView单元格中(Swift 3)

时间:2017-01-09 23:05:15

标签: ios swift alamofire

我有图像URL,我想在UIImageView中显示该图像,该图像位于tableView单元格中。 我创建了一个自定义单元格并为imageView添加了一个插座。 由于我正在加载新闻,因此URL会相应更改。 注意:我正在使用Alamofire处理我的HTTP请求。

struct News {
    let title: String
    let text: String
    let link: String
    let imgUrl: String

    init(dictionary: [String:String]) {
        self.title = dictionary["title"] ?? ""
        self.text = dictionary["text"] ?? ""
        self.link = dictionary["link"] ?? ""
        self.imgUrl = dictionary["imgUrl"] ?? ""
    }
}

将信息加载到我的自定义单元格

override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath) as? newsCellTableViewCell
    let news = newsData[indexPath.row]
    cell?.headline.text = news.title
    cell?.excerpt.text = news.text
    cell?.thumbnailImage.text = news.imgUrl
    return cell!
 }

4 个答案:

答案 0 :(得分:1)

这很容易,因为你正在使用Alamofire。与@Mochi的例子不同,这不会阻止界面。

以下是一个例子:

Alamofire.request(news.imgUrl).response { response in
    if let data = response.data {
        let image = UIImage(data: data)
        cell?.thumbnailImage.image = image
    } else {
        print("Data is nil. I don't know what to do :(")
    }
}

*请注意我在回答之前无法对此进行测试。您可能需要稍微调整一下这段代码。

答案 1 :(得分:1)

我使用了Kingfisher
Here是使用该库的一些简单步骤。


import Kingfisher

tableViewCell类:

class MyCell: UITableViewCell {
    
    @IBOutlet weak var cellImg: UIImageView!
    
    @IBOutlet weak var cellLbl: UILabel!
    
}

Assign this class to your cell in storyboard

最后,在CellForRowAt

中执行此操作
override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: "MyCell")! as! MyCell
        let url = URL(string: "https://files.pitchbook.com/website/files/jpg/food_delivery_800.jpg")
        cell.cellImg.kf.setImage(with: url)
        return cell
    }

就是这样

答案 2 :(得分:0)

  

请使用SDWebImage。它是一个imageview类别,可以在后台下载图像而不会冻结UI,也可以提供缓存。您也可以设置占位符图像。占位符显示,直到您的实际图像下载。下载后,单元格Imageview中的实际图像会自动更新,您无需使用任何完成处理程序。

override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath) as? newsCellTableViewCell
    let news = newsData[indexPath.row]
    cell?.headline.text = news.title
    cell?.excerpt.text = news.text
    cell?.thumbnailImage.sd_setImageWithURL(NSURL(string: news.imgUrl), placeholderImage:UIImage(imageNamed:"placeholder.png"))
    return cell!
}

答案 3 :(得分:0)

您可以使用此代码从网址获取图片,也可以设置占位符图片。例如: -

cell.imageView?.imageFromURL(urlString:  "urlString", PlaceHolderImage: UIImage.init(named: "imagename")!)

extension UIImageView {

 public func imageFromServerURL(urlString: String, PlaceHolderImage:UIImage) {

        if self.image == nil{
              self.image = PlaceHolderImage
        }

        URLSession.shared.dataTask(with: NSURL(string: urlString)! as URL, completionHandler: { (data, response, error) -> Void in

            if error != nil {
                print(error ?? "No Error")
                return
            }
            DispatchQueue.main.async(execute: { () -> Void in
                let image = UIImage(data: data!)
                self.image = image
            })

        }).resume()
    }}