1. 何为骨架屏

是一种在页面内容尚未加载完成时，先展示一个“轮廓式”的界面占位图的用户体验优化手段。
用于在数据加载时显示骨架屏（Skeleton Screen），以提升用户体验。其核心原理主要基于视图的层级管理和动画效果的实现

2. SkeletonView 三方库

SkeletonView 是一个流行的 iOS 开发库，用于在数据加载时显示骨架屏（Skeleton Screen），以提升用户体验。其核心原理主要基于视图的层级管理和动画效果的实现

3. 原理：

• 视图层级管理：当需要显示骨架屏时，SkeletonView 会在目标视图（如 UIView, UITableView, UICollectionView 等）上覆盖一层或多层自定义的“骨架”视图。这些骨架视图通常由简单的形状（如矩形、圆形等）组成，用来模仿实际内容的布局。
• 可配置性：SkeletonView 提供了丰富的配置选项，允许开发者自定义骨架视图的颜色、动画类型、持续时间等属性。这使得骨架屏可以根据应用的整体风格进行调整。
• 自动布局支持：为了确保骨架屏能够正确地适应不同的屏幕尺寸和方向变化，SkeletonView 充分利用了 Auto Layout 系统。这意味着骨架视图会随着父视图的变化而自动调整大小和位置。
• 动画效果：为了使骨架屏看起来更加生动，SkeletonView 支持多种动画效果，默认提供了渐变动画（Gradient Animation）。这种动画通过改变颜色渐变的位置来模拟数据正在加载的效果。

实现细节

• 显示骨架屏：当你调用 showAnimatedGradientSkeleton() 方法时，SkeletonView 会根据视图的结构创建相应的骨架视图，并将其添加到视图层级的顶部。同时启动指定的动画效果（如渐变动画）。
• 隐藏骨架屏：当数据加载完成并调用 hideSkeleton() 方法时，SkeletonView 会停止任何正在进行的动画，并从视图层级中移除骨架视图，恢复原始视图的内容。
• 协议与扩展：SkeletonView 通过协议扩展（Protocol Extensions）的方式为常见的 UIKit 组件（如 UILabel, UIImageView, UITableView, UICollectionView 等）提供了默认的骨架样式。开发者也可以通过实现特定的协议方法来自定义这些组件的骨架表现形式。
  结合 TabelView 使用

tableView.isSkeletonable = true

extension ViewController:  SkeletonTableViewDataSource {
    func showSkeleton()  {
        tableView.showAnimatedSkeleton()
    }
    
    func hideSkeleton()  {
        self.tableView.hideSkeleton()
    }
    
    func collectionSkeletonView(_ skeletonView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return   8
    }
    
    func collectionSkeletonView(_ skeletonView: UITableView, cellIdentifierForRowAt indexPath: IndexPath) -> ReusableCellIdentifier {
        return "trackCell"
    }
    
    
}

cell 骨架

需要再 cell 中 
awakeFromNib、或者 init中设置骨架样式

 private func setSkeletonable() {
        isSkeletonable = true
        contentView.isSkeletonable = true
        self.headImg.isSkeletonable = true
        self.nickLabel.isSkeletonable = true
        self.deductLabel.isSkeletonable = true

    }

在 webview 中 使用骨架

由于 WKWebView 加载网页内容的方式不同于本地视图（如 UITableView 或 UICollectionView），因此需要一些额外的步骤来实现加载时的占位效果。以下是一个基本的方法，使用自定义的 UIView 作为骨架屏覆盖在 WKWebView 上，直到网页完全加载完成。

自定义通用骨架视图

private var skeletonView:GeneralSkeletonView!

        skeletonView = GeneralSkeletonView(frame: CGRect(x: 0, y: StatusBarHeight, width: ScreenWidth, height: ScreenHeight))
        skeletonView.isSkeletonable = true
        self.view.addSubview(skeletonView)
        self.view.bringSubviewToFront(skeletonView)
        skeletonView.showAnimatedSkeleton()

  /// 加载成功
    func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {
        self.skeletonView.hideSkeleton()
        skeletonView.removeFromSuperview()
    }

骨架屏目前很流行，加上的话逼格瞬间起来了，这是在应用骨架屏的过程中的一点总结，赠人玫瑰，手有余香，一点心得与诸位共勉！！！