How to use skeleton loading with multiple sections in swift? - ios

Question

I want to apply skeleton animation with tableview. To achieve this I am using 'SkeletonView' cocopods and it's working fine with single section but when I am trying with multiple section it's throwing out of bounds error. Even i don't know from where I could find documentation for this cocopods. If anybody has some idea please help me out.
import UIKit
import SkeletonView
class ViewController: UIViewController {
#IBOutlet weak var tableView: UITableView!
var data = [[String: Any]]()
override func viewDidLoad() {
super.viewDidLoad()
tableView.rowHeight = 80
tableView.estimatedRowHeight = 80
DispatchQueue.main.asyncAfter(deadline: .now() + 5, execute: {
self.data.append(["day": "Mon",
"record": [
["name": "Abhya"], ["name": "Anivesh"]
]
])
self.data.append(["day": "Tue",
"record": [
["name": "Vivek"], ["name": "Arun"]
]
])
self.data.append(["day": "Wed",
"record": [
["name": "Bindu"], ["name": "Aliya"]
]
])
self.data.append(["day": "Thi",
"record": [
["name": "Vivek"], ["name": "Arun"]
]
])
print(self.data[0])
self.tableView.stopSkeletonAnimation()
self.view.hideSkeleton()
self.tableView.reloadData()
})
}
override func viewDidAppear(_ animated: Bool) {
super.viewDidAppear(animated)
tableView.isSkeletonable = true
tableView.showAnimatedGradientSkeleton()
tableView.showAnimatedSkeleton(usingColor: .concrete, transition: .crossDissolve(0.25))
}
func getArray(withDictionary array: Any?) -> [Dictionary<String, Any>] {
guard let arr = array as? [Dictionary<String, Any>] else {
return []
}
return arr
}
}
extension ViewController:UITableViewDelegate {
}
extension ViewController: SkeletonTableViewDataSource {
func numberOfSections(in tableView: UITableView) -> Int {
self.data.count
}
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
let dictionary = self.data[section]
let array = getArray(withDictionary: dictionary["record"])
return array.count
}
func collectionSkeletonView(_ skeletonView: UITableView, cellIdentifierForRowAt indexPath: IndexPath) -> ReusableCellIdentifier {
return "TeacherCell"
}
func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
return 60
}
func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
let cell = tableView.dequeueReusableCell(withIdentifier: "HeaderCell") as! HeaderTableViewCell
print("section", section)
let dict = self.data[section]
cell.dayName.text = dict["day"] as! String
return cell
}
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "TeacherCell") as! TeacherTableViewCell
let dictionary = self.data[indexPath.row]
let array = getArray(withDictionary: dictionary["record"])
let dict = array[indexPath.row]
cell.teacherName.text = dictionary["name"] as! String
return cell
}
}

Answer 1

I had the same issue and solved it in the tableView Cell.
In awakeNib() add: someLabel.showAnimatedSkeleton()
After that add a custom function:
func hideSkeleton(){
someLabel.hideSkeleton()
}
Now in Your MainView Controller call this function in cellForItem just before return cell.
Hope this works for you.