How to retrieve images from Firebase and display them in tableView? - ios

Question

I am making an iOS app using Xcode 8, Swift 3, and Firebase. I want to retrieve all my users from Firebase and display their name and profile picture in a tableViewCell.
Controller
import UIKit
import FirebaseAuth
import FirebaseDatabase
import FirebaseStorage
import Firebase
class HomeViewController: UIViewController, UITableViewDelegate, UITableViewDataSource {
#IBOutlet weak var tableView: UITableView!
#IBOutlet weak var activityIndicatorView: UIActivityIndicatorView!
var posts = NSMutableArray()
override func viewDidLoad() {
super.viewDidLoad()
self.tableView.delegate = self
self.tableView.dataSource = self
loadData()
}
func loadData() {
activityIndicatorView.startAnimating()
Database.database().reference().child("users").observeSingleEvent(of: .value, with: { (snapshot) in
if let postsDictionary = snapshot.value as? [String : AnyObject] {
for post in postsDictionary {
self.posts.add(post.value)
}
self.tableView.reloadData()
}
})
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
func numberOfSections(in tableView: UITableView) -> Int {
// #warning Incomplete implementation, return the number of sections
return 1
}
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
// #warning Incomplete implementation, return the number of rows
return self.posts.count
}
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "HomeTableViewCell", for: indexPath) as! HomeTableViewCell
// Configure the cell...
let user = self.posts[indexPath.row] as! [String : AnyObject]
cell.nameLabel.text = user["username"] as? String
if let imageName = user["profile_image"] as? String {
let imageRef = Storage.storage().reference().child("profile_image/\(imageName)")
imageRef.getData(maxSize: 25 * 1024 * 1024, completion: { (data, error) -> Void in
if error == nil {
// successful
let image = UIImage(data: data!)
cell.profileImageView.image = image
cell.profileImageView.alpha = 1
cell.nameLabel.alpha = 1
} else {
// error
print(error!.localizedDescription)
}
})
}
activityIndicatorView.stopAnimating()
return cell
}
}
TableViewCell
import UIKit
import FirebaseDatabase
import FirebaseAuth
import SDWebImage
class HomeTableViewCell: UITableViewCell {
#IBOutlet weak var nameLabel: UILabel!
#IBOutlet weak var profileImageView: UIImageView!
override func awakeFromNib() {
super.awakeFromNib()
self.nameLabel.alpha = 1
self.profileImageView.alpha = 1
}
override func setSelected(_ selected: Bool, animated: Bool) {
super.setSelected(selected, animated: animated)
}
}
When I run it the name shows up but the user's profile picture does not show up. This is my Firebase Storage:
And my Firebase Database looks like this: