90 per cent of the stack overflow responses on `@Composable invocations can only happen from the con...

# compose

[ivano]

90 per cent of the stack overflow responses on @Composable invocations can only happen from the context of a @Composable function refer to onClick() , instead i get this error every time i try to extract some long code from a composable function for instance a Canvas I cannot find IN GENERAL what this error means and so I am not able to solve my case

[ephemient]

you can't call composable functions from inside Canvas onDraw either

[vide]

In general, you can't call any composable functions from callbacks

[ephemient]

is the error not clear?

[ivano]

mmh can i paste some code?

[ivano]

not really

[ivano]

Here it is i reproduced the issue cutting a lot of code: give you version 1 not refactored that works, and version 2 that does not work

[ivano]

version 1 (not refactored)

[ivano]

Canvas(modifier = modifier) {
    val spacePerHour = (size.width - spacing) / infos.size
    (0 until infos.size - 1 step 2).forEach { i ->
        val info = infos[i]
        val hour = info.date.hour
        drawContext.canvas.nativeCanvas.apply {
            drawText(
                hour.toString(),
                spacing + i * spacePerHour,
                size.height - 5,
                textPaint
            )
        }
    }
}

[CLOVIS]

You can press CTRL Q on the opening bracket of any lambda to print its signature, if it doesn't say @Composable, then you can't call composable functions

[ivano]

version 2(gives @Composable invocations error):

Canvas(modifier = modifier) {
        val spacePerHour = (size.width - spacing) / infos.size
        (0 until infos.size - 1 step 2).forEach { i ->
            val info = infos[i]
            val hour = info.date.hour
            drawContext.canvas.nativeCanvas.apply {
                BuildXAxis(this, hour, spacing, i, spacePerHour, this, textPaint)
            }
        }
    }


@Composable
private fun BuildXAxis(
    canvas: NativeCanvas,
    hour: Int,
    spacing: Float,
    i: Int,
    spacePerHour: Float,
    drawScope: DrawScope,
    textPaint: Paint
) {
    canvas.drawText(
        hour.toString(),
        spacing + i * spacePerHour,
        drawScope.size.height - 5,
        textPaint
    )
}

[ivano]

where i extracted BuildXAxis method to make it the long function more readable

[ephemient]

remove @Composable from the function if you want to use it in that position

[ivano]

@ephemient it works, thanks, now i understand where the error is! @CLOVIS thank you for your tip of using ctrl+Q and also @vide for the simple english explanation about callbacks!

[ivano]

have a pleasant week end guys!