IssueTracker

Can you share your setup (specifically the anchors) with us?

Sure thing: Here's the file I was using it in:

@Immutable
@JvmInline
value class CollapsingHeaderState internal constructor(
    internal val packedValue: Long,
)

private fun CollapsingHeaderState(
    translation: Float,
    progress: Float,
) = CollapsingHeaderState(
    packFloats(
        val1 = translation,
        val2 = progress,
    ),
)

val CollapsingHeaderState.translation
    get() = unpackFloat1(packedValue)


val CollapsingHeaderState.progress
    get() = unpackFloat2(packedValue)

private enum class CollapsingHeaderStatus {
    Collapsed, Expanded
}

@Composable
@OptIn(ExperimentalFoundationApi::class)
fun CollapsingHeader(
    collapsedHeight: Float,
    onOffsetChanged: (CollapsingHeaderState) -> Unit = { },
    headerContent: @Composable () -> Unit,
    body: @Composable () -> Unit,
) {
    var headerHeight by remember { mutableFloatStateOf(0f) }
    val density = LocalDensity.current
    val state = remember {
        AnchoredDraggableState(
            initialValue = CollapsingHeaderStatus.Collapsed,
            positionalThreshold = { distance: Float -> distance * 0.5f },
            velocityThreshold = { 100f },
            animationSpec = tween(),
            anchors = DraggableAnchors {
                CollapsingHeaderStatus.Collapsed at with(density) { 500.dp.toPx() }
                CollapsingHeaderStatus.Expanded at collapsedHeight
            }
        )
    }
    val connection = remember {
        object : NestedScrollConnection {
            override fun onPreScroll(
                available: Offset,
                source: NestedScrollSource
            ): Offset = when (val delta = available.y) {
                in -Float.MAX_VALUE..-Float.MIN_VALUE -> state.dispatchRawDelta(delta).toOffset()
                else -> Offset.Zero
            }

            override fun onPostScroll(
                consumed: Offset,
                available: Offset,
                source: NestedScrollSource
            ): Offset = state.dispatchRawDelta(
                delta = available.y
            ).toOffset()

            override suspend fun onPostFling(
                consumed: Velocity,
                available: Velocity
            ): Velocity {
                state.settle(velocity = available.y)
                return super.onPostFling(consumed, available)
            }
        }
    }

    Box {
        Box(
            modifier = Modifier
                .pointerInput(Unit) {
                    detectVerticalDragGestures { _, dragAmount ->
                        state.dispatchRawDelta(dragAmount)
                    }
                }
                .onSizeChanged { headerHeight = it.height.toFloat() }
        ) {
            headerContent()
        }
        Box(
            modifier = Modifier
                .offset {
                    IntOffset(
                        x = 0,
                        y = state.offset.roundToInt()
                    )
                }
                .anchoredDraggable(
                    state = state,
                    orientation = Orientation.Vertical
                )
                .nestedScroll(connection)
        ) {
            body()
        }
    }

    LaunchedEffect(headerHeight) {
        state.updateAnchors(
            DraggableAnchors {
                CollapsingHeaderStatus.Collapsed at headerHeight
                CollapsingHeaderStatus.Expanded at collapsedHeight
            }
        )
    }

    LaunchedEffect(state.offset, headerHeight, collapsedHeight) {
        val translation = headerHeight - state.requireOffset()
        val progress = translation / (headerHeight - collapsedHeight)
        onOffsetChanged(
            CollapsingHeaderState(
                translation = translation,
                progress = progress
            )
        )
    }
}

private fun Float.toOffset() = Offset(0f, this)

Note for progress I had to calculate it as val progress = translation / (headerHeight - collapsedHeight). Reading state.progress in the effect would not update till after re-anchoring.

This is essentially WAI. The progress API is a bit odd, as it exposes the progress between currentValue and targetValue. What's happening here is that

• currentValue hasn't changed yet
• targetValue is equal to currentValue

This highlights overall awkwardness in the API, so we're exposing a fun progress(from, to) API instead.