在 UITableView 中使用动画在顶部插入行答案

【问题标题】：Inserting rows at the top with animation inside UITableView在 UITableView 中使用动画在顶部插入行
【发布时间】：2016-11-24 10:58:59
【问题描述】：

我有带有自定义 UITableViewCell 的标准 UITableView。我想要实现的是：

每一行在出现在 TableView 上时应一次淡入一个。
但是，需要注意的是，每个新行都应始终插入顶部，从而将先前存在的行向下推 1 个单元格 - 以获得“推入堆栈”动画。

这是我到目前为止所拥有的，带有香草的单个插入淡入但在底部：

func tableView(tableView: UITableView, willDisplayCell cell: UITableViewCell, forRowAtIndexPath indexPath: NSIndexPath) {
  cell.alpha = 0
  let delayBetweenRowInserts = 0.5 + Double(indexPath.row) * 1.0; //calculate delay
  UIView.animateWithDuration(1, delay: delayBetweenRowInserts, options: .TransitionCurlUp, animations: {
     cell.alpha = 1.0
     }, completion: nil
  )
}

func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
  if let cell = leaderboardTableView.dequeueReusableCellWithIdentifier(CUSTOM_CELL) as? CustomTableViewCell {
      let playerName = Array(Games.leaderboard[indexPath.row].keys)[0]
      let playerScore = Array(Games.leaderboard[indexPath.row].values)[0]
      cell.configureCell(playerName, score: "\(playerScore)")
      return cell
   } else {
       return UITableViewCell()
   }   
}

动机：我基本上必须一次性耗尽我的 dataSource 数组中的所有数据，即 Games.leaderboard 不依赖于用户向下滚动，以防他的屏幕尺寸太小而无法容纳一切。这构成了我的应用程序用户体验的一个非常关键的部分。

非常感谢任何帮助！谢谢

P.S 作为替代方案，我尝试将 beginUpdates() 与 .Top 一起使用：我尝试过使用 beginUpdates()。在我看来，它不会改变动画行的索引。我在dataSource准备好后打电话给startInsertingRows()：

func startInsertingRows() {
    var indexPaths = [NSIndexPath]()
    for index in 0...Games.leaderboard.count-1 {
        indexPaths.append(NSIndexPath(forItem: Games.leaderboard.count-1-index, inSection: 0))
    }
    leaderboardTableView.beginUpdates()
    leaderboardTableView.insertRowsAtIndexPaths((indexPaths), withRowAnimation: .Top)
    leaderboardTableView.endUpdates()
}

【问题讨论】：

不太了解你的需求，但如果你想要推送动画，你可以使用let sections = NSIndexSet(indexesInRange: NSMakeRange(0, self.tableView.numberOfSections)) 然后self.tableView.reloadSections(sections, withRowAnimation: .Automatic) 而不是tableView.reloadData
@Tj3n 根据我当前的代码： -row 插入动画的发生方式是，表格上出现的第一行保持在顶部，随后的行被添加到底部。 - 但是，我希望最新的行，即当前的 indexPath.row 始终插入顶部，旧的行被推下 - 有点像 facebook/twitter 提要更新，但带有单独的动画
这很简单是不是，你试过beginUpdate，将对象添加到你的数据源，然后调用insertRowAtIndexPath，然后调用endUpdate
我认为您可以摆脱 willDisplayCell 而是使用 2 个数组，一个保存完整数据，一个用于更新表，制作一个 NSTimer 延迟并插入最后一个单独的单元格并在填充所有数据后删除该计时器

标签： ios swift uitableview row insertion

【解决方案1】：

我将通过操纵numberOfRowsInSection 和操纵该值的NSTimer 返回的值来解决这个问题。为简单起见，我的版本使用固定时间间隔，但您可以使用非重复计时器并在tableTick 中再次安排。另外，我在viewDidAppear 中启动动画，但如果尚未加载数据，这可能不适合您的情况，但您可以根据需要进行调整。

var tableTimer: NSTimer?
var cellPointer = 0

override func viewDidAppear(animated: Bool) {
    super.viewDidAppear(animated)
    cellPointer = Games.leaderboard.count
    self.tableTimer = NSTimer.scheduledTimerWithTimeInterval(0.5, target: self, selector: #selector(ViewController.tableTick), userInfo: nil, repeats: true)
}

func tableTick() {
    if cellPointer > 0 {
        cellPointer -= 1
        self.tableView.insertRowsAtIndexPaths([NSIndexPath(forRow: 0, inSection: 0)], withRowAnimation: .Fade)
    } else {
        self.tableTimer!.invalidate()
        self.tableTimer = nil
    }
}

override func viewWillDisappear(animated: Bool) {
    super.viewWillDisappear(animated)
    if let timer = self.tableTimer {
        timer.invalidate()
        self.tableTimer = nil
    }
}

func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
    return Games.leaderboard.count-self.cellPointer
}

func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
    if let cell = leaderboardTableView.dequeueReusableCellWithIdentifier(CUSTOM_CELL) as? CustomTableViewCell {
        let index = cellPointer + indexPath.row
        let playerName = Array(Games.leaderboard[index].keys)[0]
        let playerScore = Array(Games.leaderboard[index].values)[0]
        cell.configureCell(playerName, score: "\(playerScore)")
        return cell
    } else {
        return UITableViewCell()
    }
}

【讨论】：