Swift-骨架屏SkeletonView使用

UITableView 使用SkeletonView

Xcode 12, simulator iPhone12 pro iOS 14.5

SkeletonViewGit地址

Demo地址

image

1.以SkeletonTableViewDataSource代替UITableViewDataSource,并实现额外的代理方法

    //skelentonView
    func numSections(in collectionSkeletonView: UITableView) -> Int {
        return 1
    }
    
    func collectionSkeletonView(_ skeletonView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return 3
    }
    
    func collectionSkeletonView(_ skeletonView: UITableView, cellIdentifierForRowAt indexPath: IndexPath) -> ReusableCellIdentifier {
        return "secondCell"
    }

2.所有view设置isSkeletonable = true

//tableiview
tableView.isSkeletonable = true
//cell内控控件
func initSkeletonEnable() {
    isSkeletonable = true
    iconImageView.isSkeletonable = true
    firstLabel.isSkeletonable = true
    secondLabel.isSkeletonable = true
    bottomTool.isSkeletonable = true
}

3.显示及隐藏SkeletonView

tableiview.showAnimatedSkeleton()
DispatchQueue.main.asyncAfter(deadline: DispatchTime.now() + 1) {
    self.tableiview.hideSkeleton()
}

UICollectionView使用SkeletonView

image

1.以SkeletonCollectionViewDataSource代替UICollectionViewDataSource,并实现额外的代理方法

    //skeleton
    func collectionSkeletonView(_ skeletonView: UICollectionView, cellIdentifierForItemAt indexPath: IndexPath) -> ReusableCellIdentifier {
        return "secondCell"
    }
    
    func collectionSkeletonView(_ skeletonView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        return 20
    }

2.所有view设置isSkeletonable = true

collectionView.isSkeletonable = true
//collectionCell
func initSkeletonEnable() {
    isSkeletonable = true
    firstLabel.isSkeletonable = true
    secondLabel.isSkeletonable = true
}

3.显示及隐藏SkeletonView

collectionView.showAnimatedSkeleton()
DispatchQueue.main.asyncAfter(deadline: DispatchTime.now() + 1) {
    self.collectionView.hideSkeleton()
}
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容