时间戳

首页 > 解决方案 > 如何在 UIElements 上正确使用占位符 API

ios - 如何在 UIElements 上正确使用占位符 API

问题描述

我在我的 Xcode 项目中实现了一个名为Skeleton View的 API。有时当应用程序第一次加载时，加载 UI 元素需要更长的时间，因为数据来自 JSON，如果用户使用的是 4G 甚至是糟糕的互联网，将保持一个空白字段。此外，使用此 API，它在每个未接收数据的 UIElement 上显示为灰色视图动画占位符。

但是，我不知道如何检查 UIImage 何时收到能够移除骨架效果并呈现图像的值。我会在下面发布一些图片。

     func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
            let cell = tableView.dequeueReusableCell(withIdentifier: "cellID") as! TableViewCell

            let model = arrCerveja[indexPath.row]

            cell.labelName.text = model.name
            cell.labelDetail.text = "Teor alcoólico: \(model.abv)"
            let resource = ImageResource(downloadURL: URL(string: "\(model.image_url)")!, cacheKey: model.image_url)

            if cell.imageViewCell.image != nil {
                cell.imageViewCell.kf.setImage(with: resource)
                cell.imageViewCell.hideSkeleton()
            }else{
               cell.imageViewCell.showAnimatedGradientSkeleton()

//The placeholder still there even when the images already got downloaded
//What I wanted was, while the UIImageView has no value, the placeholder 
//persists, but when receive the image the placeholder should be dismissed.
            }

            return cell
        }

这就是我在 UIImages 上得到的（它有一个模糊动画经过）：

在此处输入图像描述

我面临的问题是如何在每个图像加载后消除这种效果？

标签： iosswiftxcodeplaceholder

解决方案

在开始下载时（通常在获取数据的函数之前），您需要启动动画：

view.startSkeletonAnimation()

这里的 view 属性是您的视图控制器之一，SkeletonView 是递归的，它将为其中的所有视图设置动画。

然后在下载完成后（通常在您重新加载表格视图之前关闭，我假设您的所有图像都已下载并准备好显示）停止动画：

self.view.stopSkeletonAnimation()

骨架视图还为您提供 UITableView 的委托：

public protocol SkeletonTableViewDataSource: UITableViewDataSource {
    func numSections(in collectionSkeletonView: UITableView) -> Int
    func collectionSkeletonView(_ skeletonView: UITableView, numberOfRowsInSection section: Int) -> Int
    func collectionSkeletonView(_ skeletonView: UITableView, cellIdenfierForRowAt indexPath: IndexPath) -> ReusableCellIdentifier
}

正如文档所说（阅读关于集合的部分以了解它是如何工作的）：

该协议继承自 UITableViewDataSource，因此您可以将该协议替换为骨架协议。

您需要在 viewDidLoad() 函数中使您的 tableView 骨架可运行：

tableView.isSkeletonable = true

推荐阅读