How can I draw text on a path in Jetpack Compose?

We use nativeCanvas to draw a text using Path in Compose, like how we do normally in Custom Views.

Ex:

@Composable
fun ArcTextExample() {
    val paint = Paint().asFrameworkPaint()
    Canvas(modifier = Modifier.fillMaxSize()) {
        paint.apply {
            isAntiAlias = true
            textSize = 24f
            typeface = Typeface.create(Typeface.DEFAULT, Typeface.BOLD)
        }

        drawIntoCanvas {
            val path = Path()
            path.addArc(RectF(0f, 100f, 200f, 300f), 270f, 180f)
            it.nativeCanvas.drawTextOnPath("Hello World Example", path, 0f, 0f, paint)
        }
    }
}

Note: we should use android.graphics.Path

And the result will be like:

enter image description here

CLICK HERE to find out more related problems solutions.

Leave a Comment

Your email address will not be published.

Scroll to Top