Jetpack Compose：TopAppBarとPullToRefreshContainerがうまく連動しない

課題

androidx.compose.material3:material3 を 1.2.0 にしたところ、TopAppBarとPullRefreshがうまく連動して動作しなくなった（TopAppBarDefaults.exitUntilCollapsedScrollBehaviorの場合に下にスクロールしてもTopAppBarが降りてこない）。どうすればよいか。

対応

1.2.0 よりmaterial3にpulltorefreshパッケージが追加された。その影響か挙動が変わってしまったようだ。

実装方法が色々とあると思うのでポイントのみ。nestedScrollConnection を2つ使うことになるが、順番が影響する。pullToRefreshState.nestedScrollConnection をscrollBehavior.nestedScrollConnectionよりも先に記述するのがポイント。

// TopAppBar向け
val scrollBehavior = TopAppBarDefaults.exitUntilCollapsedScrollBehavior()
// PullToRefresh向け
val pullToRefreshState = rememberPullToRefreshState()

Scaffold(
modifier = Modifier
            .nestedScroll(pullToRefreshState.nestedScrollConnection)
            .nestedScroll(scrollBehavior.nestedScrollConnection)
)

Scaffold じゃなくても PullToRefreshを囲んでいるBoxのModifierに書いても動作した。何かしら違いはあるかも。

感想

nestedScrollをチェインして書けるの知らなかったし、順番も気にしたことなかったな。気づけて良かった。