How to populate a TableView with data from Firebase Firestore? - ios

Question

I am very new to iOS development (with emphasis on very). I think I have grasped simple table views in Xcode without calling on a database, and I also think I understand the basics of how to call data from Firestore, but I cannot for the life of me figure out how to populate my TableView with data from Firestore.
The Firestore collection I want to populate with is called "articles", where each doc represents an article I want to display in a cell. Each doc has this structure of data:
imageURL: https://someurl.com
title: 5 places you don't want to miss
I have created a UITableView with a UITableViewCell inside it in Storyboard, where the TableViewCell's ContentView contains an ImageView for the 'imageURL' data in Firestore and a Label for the 'title' data in Firetore.
The UITableView in Storyboard is linked to ArtiklerTableViewController.swift.
Likewise is the UITableViewCell linked to ArtiklerCell.swift.
The two Swift files look like this now:
ArtiklerTableViewController.swift
class ArtiklerTableViewController: UITableViewController {
#IBOutlet var artiklerTableView: UITableView!
var artiklerArray: [String] = []
var documents: [DocumentSnapshot] = []
var db: Firestore!
override func viewDidLoad() {
super.viewDidLoad()
db = Firestore.firestore()
configureTableView()
loadData()
func configureTableView() {
tableView.delegate = self
tableView.dataSource = self
tableView.register(ArtiklerCell.self, forCellReuseIdentifier: "ArtiklerCell")
// remove separators for empty cells
tableView.tableFooterView = UIView()
// remove separators from cells
tableView.separatorStyle = .none
}
func loadData() {
db.collection("articles").getDocuments() { (QuerySnapshot, err) in
if let err = err {
print("Error getting documents : \(err)")
}
else {
for document in QuerySnapshot!.documents {
let documentID = document.documentID
let artiklerImageView = document.get("imageURL") as! URL
let artiklerTitleLabel = document.get("title") as! String
print(artiklerImageView, artiklerTitleLabel, documentID)
}
self.tableView.reloadData()
}
}
}
override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
print("Tableview setup \(artiklerArray.count)")
return artiklerArray.count
}
override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "ArtiklerCell", for: indexPath) as! ArtiklerCell
let artikler = artiklerArray[indexPath.row]
print("Array is populated \(artiklerArray)")
return cell
}
}
ArtiklerCell.swift
import UIKit
import Firebase
class ArtiklerCell: UITableViewCell {
#IBOutlet weak var artiklerImageView: UIImageView!
#IBOutlet weak var artiklerTitleLabel: UILabel!
var db: Firestore!
override func awakeFromNib() {
super.awakeFromNib()
// Initialization code
db = Firestore.firestore()
addSubview(artiklerImageView)
addSubview(artiklerTitleLabel)
configureImageView()
}
required init?(coder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
func configureImageView() {
artiklerImageView.layer.cornerRadius = 20
artiklerImageView.clipsToBounds = true
}
}
When I try to run the app, I get an error message from the ArtiklerTableViewController.swift regarding the line let artikler = artiklerArray[indexPath.row] in the cellForRowAt function, saying 'Initialization of immutable value 'artikler' was never used; consider replacing with assignment to '_' or removing it'.
I see that this error message makes sense, but I have absolutely no idea what I should do instead.
Pardon my extreme lack of knowledge! I have spent many days now trying to look for the answers I need online without finding a solution. I think I am too inexperienced to correctly search for and absorb the necessary knowledge for this problem.
Any answer will be immensely appreciated!
Thanks in advance from a desperate girl who doesn't want to give up on learning iOS dev as I go through building an app.

Answer 1

You already have the strings in an array and got the artikler corresponding to the row of the cell, now you just need to set the title and the image. Also, you need to append each element to the array before reloading.
func loadData() {
db.collection("articles").getDocuments() { (QuerySnapshot, err) in
if let err = err {
print("Error getting documents : \(err)")
}
else {
for document in QuerySnapshot!.documents {
let documentID = document.documentID
let artiklerImageView = document.get("imageURL") as! URL
let artiklerTitleLabel = document.get("title") as! String
self.artiklerArray.append(artiklerTitleLabel)
}
self.tableView.reloadData()
}
}
}
...
override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "ArtiklerCell", for: indexPath) as! ArtiklerCell
let artikler = artiklerArray[indexPath.row]
cell.artiklerTitleLabel.text = artikler
return cell
}