ScrollableOverlayWithAlignmentLines.kt

// Copyright 2026 Google LLC.
// SPDX-License-Identifier: Apache-2.0

val TopSpecialAlignmentLine = HorizontalAlignmentLine(::min)
val BottomSpecialAlignmentLine = HorizontalAlignmentLine(::max)

@Preview
@Composable
fun OverlayExample() {
    Layout(
        contents = listOf(
            {
                Column(Modifier.fillMaxSize().verticalScroll(rememberScrollState())) {
                    repeat(50) {
                        Text("Item $it Before")
                    }
                    Text(
                        "Special Zone Start",
                        modifier = Modifier.layout { measurable, constraints ->
                            val placeable = measurable.measure(constraints)
                            layout(
                                placeable.width,
                                placeable.height,
                                mapOf(TopSpecialAlignmentLine to 0),
                            ) {
                                placeable.placeRelative(0, 0)
                            }
                        }
                    )
                    repeat(50) {
                        Text("Item $it In Middle")
                    }
                    Text(
                        "Special Zone End",
                        modifier = Modifier.layout { measurable, constraints ->
                            val placeable = measurable.measure(constraints)
                            layout(
                                placeable.width,
                                placeable.height,
                                mapOf(BottomSpecialAlignmentLine to placeable.height),
                            ) {
                                placeable.placeRelative(0, 0)
                            }
                        }
                    )
                    repeat(50) {
                        Text("Item $it After")
                    }
                }
            },
            {
                Box(Modifier.border(2.dp, Color.Blue).fillMaxSize()) {
                    // Drag and drop here!
                }
            }
        ),
    ) { measurables, constraints ->
        val scrollingContentPlaceable = measurables[0].first().measure(constraints)
        val topSpecial = scrollingContentPlaceable[TopSpecialAlignmentLine]
        val bottomSpecial = scrollingContentPlaceable[BottomSpecialAlignmentLine]
        val overlayHeight = bottomSpecial - topSpecial
        val overlayPlaceable = measurables[1].first().measure(
            constraints = constraints.copy(
                minHeight = overlayHeight,
                maxHeight = overlayHeight,
            )
        )

        layout(scrollingContentPlaceable.width, scrollingContentPlaceable.height) {
            scrollingContentPlaceable.placeRelative(0, 0)
            overlayPlaceable.placeRelative(0, topSpecial)
        }
    }
}