collapsing-parallax-toolbar
Installation
SKILL.md
Collapsing parallax toolbar
Five siblings in one Box. Four read the same ScrollState and none of them owns it; the fifth
reads no scroll state at all, riding a boolean the toolbar reports back up:
val scroll: ScrollState = rememberScrollState(0)
Box(modifier) {
Header(scroll, headerHeightPx, imageUrl, backgroundColor, /* … */) // artwork, parallax + fade
Body(scroll, headerHeight) { content(color) } // the only scrollable
Toolbar(scroll, headerHeightPx, toolbarHeightPx, onShow = { … }) // pinned bar, appears late
Title(scroll, title, headerHeight, toolbarHeight) // travels between the two
AnimatedVisibility(showBackButton) { /* floating back button */ }
}
Only Body scrolls, and it reserves the header's space with a spacer rather than containing it: