UITableViewのスクロール位置を戻したい！

はじめに

UITableView で reloadData() をしたときにトップへスクロールしたいときがたまにあります。でもこれが結構めんどくさい。。。

色々方法を試したので備忘録として記載します。

やりたいことは「ボタン押下したときにリロード＋スクロール位置をトップに戻したい」ということ！

こんな感じ（before が最下部表示で after が before の状態からリロード+トップへスクロールした状態です)

before	after

テーブルは前回の記事で書いたヘッダーが消えたり出たりする grouped スタイルのテーブルでやります！
（before はヘッダー非表示、after はヘッダー表示です）

方法

テーブルをトップにスクロールする方法として setContetnOffset と scrollToRow があり、 reloadData の前にスクロールさせるのか後にスクロールさせるのかで４パターンできると思います。

実行結果１

実装はこんな感じ

// パターン１（setContetnOffset先スクロール）
tableView.setContentOffset(.zero, animated: false)
tableView.reloadData()

// パターン２（scrollToRow先スクロール）
tableView.scrollToRow(at: .init(row: 0, section: 0), at: .top, animated: false)
tableView.reloadData()

// パターン３（setContetnOffset後スクロール）
tableView.reloadData()
tableView.setContentOffset(.zero, animated: false)

// パターン４（scrollToRow後スクロール）
tableView.reloadData()
tableView.scrollToRow(at: .init(row: 0, section: 0), at: .top, animated: false)

結果はこんな感じ

パターン１	パターン２	パターン３	パターン４

パターン１とパターン４（でも row 設定なのでヘッダーまではスクロールしてない）はいけてそうだけどパターン２、３が中途半端な位置になっている。。。

実行結果２

なんかわからんけどとりあえずコンテンツサイズが確定してない=レイアウトが中途半端な状態だから上のような結果になるんだろうと思い layoutIfNeeded() 呼べばいいんじゃね？ということで下記のように実装してみた。

// パターン１（setContetnOffset先スクロール）
tableView.setContentOffset(.zero, animated: false)
tableView.layoutIfNeeded()
tableView.reloadData()

// パターン２（scrollToRow先スクロール）
tableView.scrollToRow(at: .init(row: 0, section: 0), at: .top, animated: false)
tableView.layoutIfNeeded()
tableView.reloadData()

// パターン３（setContetnOffset後スクロール）
tableView.reloadData()
tableView.layoutIfNeeded()
tableView.setContentOffset(.zero, animated: false)

// パターン４（scrollToRow後スクロール）
tableView.reloadData()
tableView.layoutIfNeeded()
tableView.scrollToRow(at: .init(row: 0, section: 0), at: .top, animated: false)

結果はこんな感じ

パターン１	パターン２	パターン３	パターン４

全パターンいい感じにいけてそう

実行結果３

layoutIfNeeded() を呼ぶことでそれぞれ思った通りの動作になってますがあまいです！セルの高さが固定なら問題ないのですがセルの高さが可変の場合はちょっと。。。

下記のような２パターンのセルを用意します。

実行結果２の処理を試してみると結果はこんな感じ（ちなみに layoutIfNeeded ないパターンだとパターン４以外は中途半端なスクロールになりました）

パターン１	パターン２	パターン３	パターン４

パターン３以外はいけてそうですおそらく tableView(_ :estimatedHeightForRowAt:) で適切な値を返してやるとパターン３でもうまくいくと思います。２パターンとかならいいですがここにオートレイアウトとか関与してくると色々高さ計算がめんどくさくなります。。。

セルの高さに関しては下記の記事に色々丁寧に記載されていたので参考に（私はあんまりわかってない。。。）

UITableViewのrowHeightやestimatedRowHeightに何を設定すると良いのか

結論

今回は計算とかいろいろめんどくさいのとヘッダーまでスクロールしたかったので下記を採用しました。（たぶんいけてそう）

// パターン１（setContetnOffset先スクロール）
tableView.setContentOffset(.zero, animated: false)
tableView.layoutIfNeeded()
tableView.reloadData()

動作はこんな感じ

20201024追記

コメントでいただきましたが下記のようにスクロール位置を .top から .bottom に変更するといけそうです

tableView.reloadData()
tableView.scrollToRow(at: .init(row: 0, section: 0), at: .bottom, animated: false)

layoutIfNeeded も必要ないですしこれが一番いいんじゃないかなと思います

おわりに

reloadData とトップへスクロールの組み合わせはわりとやることあるんですが結局どういう方法がいいのかな？といつも悩んでしまいます。。。

下記のようなやり方もあるみたいです。

iOS TableView reload and scroll top

他なにかいい方法ご存知であればぜひご教授ください