Riccardo
Riccardo

Reputation: 299

How do I add am image in a TableView from URL

I am confused about how I can take the DownloadURL which is a link and turn it into an image and add it in my tableview cell? I have an imageview in my storyboard and dont know how to connect it to the tableview cell either. Thanks!

override func viewDidLoad() { super.viewDidLoad()

    let ref = FIRDatabase.database().reference().child("Posts")

    ref.observeSingleEvent(of: .value, with: { snapshot in

        print(snapshot.childrenCount)

        for rest in snapshot.children.allObjects as! [FIRDataSnapshot] {

            guard let value = rest.value as? Dictionary<String,Any> else { continue }

            guard let  downloadURL = value["DownloadURL"] as? String else { continue }

            let post = postStruct(title: title, date: date, author: author, article: article, downloadURL: downloadURL)

            self.posts.append(post)

        }

        self.posts = self.posts.reversed(); self.tableView.reloadData()

    })

}

override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {

    return posts.count
}

override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {

    let cell = tableView.dequeueReusableCell(withIdentifier: "cell")

    let label1 = cell?.viewWithTag(1) as! UILabel
    label1.text = posts[indexPath.row].title
    return cell!
}

Upvotes: 0

Views: 1142

Answers (3)

Kingsley Mitchell
Kingsley Mitchell

Reputation: 2589

Google this cocoapod: SDWebImage

use this, it is incredible

Swift:

import SDWebImage

imageView.sd_setImage(with: URL(string: "url"), placeholderImage: UIImage(named: "placeholder.png"))

In regards to your second question connection your image view, you will need to create a custom cell

Upvotes: 2

Vlad Pulichev
Vlad Pulichev

Reputation: 3272

1) You need to create custom cell class with image, like this:

class MyCustomCell: UITableViewCell {
    //...some vars?
    @IBOutlet myImageView: UIImageView!
    //...some vars?
}

2) Set it for you table view. You can find a lot of tutorials for points 1 and 2 in google, SO etc. Example: Add custom cells for tableView

3) Install KingFisher for caching images. Kingfisher. It will let your tableview to have smooth scrolling. (note: you can use any analog like SDWebImage)

To install:

1) pod 'Kingfisher', '~> 3.0' in your pod file

2) pod install in terminal

3) import Kingfisher in your swift-code file

4) Use it in your table view:

override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {

    let cell = tableView.dequeueReusableCell(withIdentifier: "myCustomCell", for: indexPath) as! MyCustomCell
    let row = indexPath.row

    // ...other vars?

    let imageURL = URL(string: self.posts[row].downloadURL)
    cell.myImageView.kf.setImage(with: imageURL) // Using kingfisher for caching and viewing. 
     // next time, when you will use image with this URL, it will be taken from cache.

    // ...other vars?

    return cell
}

Hope it helps

Upvotes: 1

tuandapen
tuandapen

Reputation: 284

I think you do wrong way to download image from firebase

  1. To download image url from firebase storage. You need define an imageView inside tableCell

`

let imagesRef = FIRStorage.storage().reference()
let imageRef = self.imagesRef.child("imageName.jpg")
imageRef.downloadURL { url, error in
    if let error = error {
    } else {
        DispatchQueue.main.async {
            cell.imageView.kf.setImage(with: url)
        }
    }
}

`

  1. Your code have problem, idk why you try using firebase database to download image, because you can't.

Upvotes: 0

Related Questions