Does anyone know of a good way to consume WindowIn...

# compose

[Jonathan]

Does anyone know of a good way to consume WindowInsets as scrollable content (BottomSheetScaffold) is scrolled? Effectively, I would like to apply WindowInset.statusBar insets to the top edge of my bottom sheet as it’s expanded so that it’s always beneath the status bar but when the sheet isn’t close to the status bar I’d like to ignore it. This section of the WindowInsets guide leads me to believe this type of complex content inset/padding interaction is possible. I just don’t know where to start.

[Coty Saxman]

My use case is only similar in that I'm matching some element of the UI layout of one component to another component in realtime, so I'm sorry if this doesn't help, but here's a possible solution.

Create a Channel for sharing the UI info.

val contentBounds = remember {
    Channel<Rect?>(Channel.CONFLATED)
}

Send the UI info of the source component to the channel.

Modifier.onGloballyPositioned { coordinates ->
    val offset = coordinates.positionInWindow()
    val size = coordinates.size
    contentBounds.trySend(Rect(offset = Offset(offset.x, offset.y), size = size.toSize()))
}

In an async block, like LaunchedEffect, subscribe to the channel and apply the UI changes to the other component (in my code, the other component is threeJs)

contentBounds.receiveAsFlow().collect { incomingCoordinates ->
    val coordinates = incomingCoordinates ?: Rect.Zero
    // Get the pixel ratio for correct scaling
    val pixelRatio = window.devicePixelRatio.toFloat()
    // Convert dp measurements to pixels with correct density
    val pixelWidth = coordinates.size.width.toInt()
    val pixelHeight = coordinates.size.height.toInt()

    threeJs.updateSize(pixelWidth, pixelHeight, pixelRatio)
    updateCanvasPosition(incomingCoordinates, density.density)
}

Hope this helps!