Vertical Text Jetpack Compose

VerticalText.kt

@SuppressLint("WrongConstant")
@Composable
fun FallingVerticalText(modifier: Modifier = Modifier) {
    val text = "「春は、曙。」"
    val textSize = 64.sp

    val infiniteTransition = rememberInfiniteTransition()

    val offsets = text.mapIndexed { index, _ ->
        infiniteTransition.animateFloat(
            initialValue = -200f,
            targetValue = 0f,
            animationSpec = infiniteRepeatable(
                animation = tween(1000 + (index * 300), easing = EaseOutBounce),
                repeatMode = RepeatMode.Reverse
            )
        )
    }

    Box(
        modifier
            .background(Color.White)
            .wrapContentSize()
            .drawWithContent {
                drawIntoCanvas { canvas ->
                    val paint = Paint().apply {
                        this.textSize = textSize.toPx()
                        textAlign = Paint.Align.CENTER
                        flags = flags or VERTICAL_TEXT_FLAG
                        color = android.graphics.Color.BLACK
                    }

                    val xPos = size.width / 2
                    val yStart = (size.height - (textSize.toPx() * text.length)) / 2

                    text.forEachIndexed { index, char ->
                        val yOffset = yStart + (index * textSize.toPx()) + offsets[index].value
                        canvas.nativeCanvas.drawText(
                            char.toString(),
                            xPos,
                            yOffset,
                            paint
                        )
                    }
                }
            }
    )
}

@Composable
@SuppressLint("WrongConstant")
fun VerticalText(modifier: Modifier = Modifier){
    val text = "「春は、曙。」"
    Box(
        modifier.background(Color.White).wrapContentSize().drawWithContent {
            drawIntoCanvas { canvas ->
                val paint = Paint().apply { textSize = 64.sp.toPx() }
                paint.flags = paint.flags or VERTICAL_TEXT_FLAG
                val height = paint.measureText(text)
                canvas.nativeCanvas.drawText(
                    text,
                    0,
                    text.length,
                    size.width / 2,
                    (size.height - height) / 2,
                    paint
                )
            }
        }
    )
}