UITableViewセルの追加/削除と、セル高さ伸縮のアニメーションを共存させる

要は、こういうものが作りたい。
output-ffmpeg-normal_goal

ただ tableView.reloadData() するだけだと、下画像の結果となり、うまくいかなかった。
output-ffmpeg-normal_case1

tableView.reloadSections(sections:withRowAnimation:) を使ってもダメ。(結果は下画像)
output-ffmpeg-normal_case2
reloadSections(sections:withRowAnimation:)の場合は特に、セルオブジェクトが作り直されるようで、シームレスなアニメーションは期待できなさそう。
この辺、メソッドによる挙動の違いについては、綿密に確認していないが。。

試行錯誤の末、行き着いた実装は以下。
かいつまんで説明すると、

  • 追加及び削除が必要なセルは insertordeleteRowsAtIndexPathsする
  • シームレスにアニメーションさせたいセルは、
    • セル高さの伸縮は、beginUpdates(), endUpdates() によりtableView:heightForRowAtIndexPath:の値にアニメーションしながら更新される
    • 部分的に描画更新したい箇所は、セルオブジェクトのプロパティを直接触る
      セルオブジェクトは引き継がれるため、UIView.animateWith~によるアニメーションも期待通りに効く
      (例ではバツ画像部分)

何言っているか分からないよ、という方は、実際のソースコードをどうぞ。👉 GitHub

そもそもこの例の実現方法としては、ヘッダビューをタップでセクション開閉、という作りの方がベターな気がする。。

コメントを残す