IssueTracker

Jetpack Compose version: 1.7.5
Jetpack Compose component used: GraphicsLayer

I'm using GraphicsLayer for recording a composable and drawing it in another location. When the destination exists in a different node in the hierarchy -- such that it does not share a root node -- the drawing does not work.

If you run the following code, you'll notice that the counter starts at 0, but never updates. I was able to fix this by manually invalidating my draw scope, but should this be supported out of the box?

@Composable
fun Foo(modifier: Modifier = Modifier) {
  val graphicsLayer = rememberGraphicsLayer()
  var drawTrigger by remember { mutableIntStateOf(0) }

  Box(
    modifier
      .fillMaxSize()
      .systemBarsPadding()
      .padding(24.dp)
  ) {
    Box(
      Modifier
        .align(Alignment.TopStart)
        .size(200.dp)
        .drawWithContent {
          graphicsLayer.record {
            this@drawWithContent.drawContent()
            drawTrigger++
          }
        }
        .background(Color.Yellow)
    ) {
      val counter by produceState(initialValue = 0) {
        while (isActive) {
          delay(500)
          this.value += 1
        }
      }
      BasicText(
        modifier = Modifier.padding(16.dp),
        text = "counter = $counter",
        color = { Color.Black },
      )
    }

    Popup(alignment = Alignment.BottomEnd) {
      Canvas(
        Modifier.fillMaxSize(0.5f)
      ) {
        // TODO: uncomment this line to make the code work.
        //drawTrigger

        drawLayer(graphicsLayer)
      }
    }
  }
}