ios - 使用下拉刷新将背景 View 向下移动 - swift

Question

我有一个 UICollectionView 和一个 UIRefreshControl 以允许拉动刷新。当没有结果时，我将自定义背景 View 设置为我的 Collection View ，如下所示:

collectionView?.backgroundView = someView(如 here 所述)

但是，当我拉动刷新时，backgroundView 并没有随着 collectionView 向下移动。

我怎样才能在我的 collectionView 中使用 refreshControl 提供的下拉刷新功能来自定义全尺寸 View ？

Answer 1

在我看来，与其将 someView 分配给 collectionView?.backgroundView，不如让 someView 成为一个单元格。当您的 collectionView 数据源为空时，将此单元格显示为 collectionView 上的唯一全尺寸单元格。

import UIKit

class EmptyCell: UICollectionViewCell {
  override init(frame: CGRect) {
    super.init(frame: frame)

    let backgroundImage = UIImageView.init(frame: frame)
    backgroundImage.image = UIImage.init(named: "bg")
    backgroundImage.autoresizingMask = [.flexibleHeight, .flexibleWidth]
    self.contentView.addSubview(backgroundImage)
  }

  required init?(coder aDecoder: NSCoder) {
    fatalError("init(coder:) has not been implemented")
  }
}

class ViewController: UIViewController, UICollectionViewDelegateFlowLayout, UICollectionViewDataSource {

  @IBOutlet weak var collectionView: UICollectionView!

  var shouldShowEmptyCell = false

  let refreshControl: UIRefreshControl = {
    let refreshControl: UIRefreshControl = UIRefreshControl.init()
    refreshControl.addTarget(self, action: #selector(refreshCollectionView(_:)), for: .valueChanged)
    return refreshControl;
  }()

  override func viewDidLoad() {
    super.viewDidLoad()

    collectionView.register(EmptyCell.self, forCellWithReuseIdentifier: "EmptyCell")
    collectionView.register(UICollectionViewCell.self, forCellWithReuseIdentifier: "NormalCell")

    addRefreshControl()
  }

  func addRefreshControl() -> Void {
    if #available(iOS 10.0, *) {
      collectionView.refreshControl = self.refreshControl
    } else {
      collectionView.addSubview(self.refreshControl)
    }
  }

  @objc private func refreshCollectionView(_ sender: Any) {
    DispatchQueue.main.asyncAfter(deadline: .now() + 1.5) {
      self.shouldShowEmptyCell = !self.shouldShowEmptyCell
      self.collectionView.reloadData()
      self.refreshControl.endRefreshing()
    }
  }

  func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
    return shouldShowEmptyCell ? 1 : 20;
  }

  func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
    if shouldShowEmptyCell {
      return collectionView.dequeueReusableCell(withReuseIdentifier: "EmptyCell", for: indexPath)
    }

    let cell: UICollectionViewCell = collectionView.dequeueReusableCell(withReuseIdentifier: "NormalCell", for: indexPath)
    if indexPath.row % 3 == 0 {
      cell.backgroundColor = .red
    } else if indexPath.row % 3 == 1 {
      cell.backgroundColor = .blue
    } else if indexPath.row % 3 == 2 {
      cell.backgroundColor = .green
    }
    cell.layer.cornerRadius = 10
    return cell
  }

  func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAt section: Int) -> CGFloat {
    return 8;
  }

  func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumInteritemSpacingForSectionAt section: Int) -> CGFloat {
    return 8;
  }

  func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
    if shouldShowEmptyCell {
      return collectionView.bounds.size
    }

    return CGSize.init(width: collectionView.bounds.width / 2 - 4, height: collectionView.bounds.width / 2 - 4)
  }
}

更多细节，你可以看看我的示例项目 https://github.com/trungducc/stackoverflow/tree/empty-collection-view-pull-to-refresh