简体   繁体   中英

How to use skeleton loading with multiple sections in swift?

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
        
    }
    
    
    
}

在此处输入图像描述

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.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM