Drawn line is not smooth in Jetpack Compose path

130 views Asked by At

I'm trying to draw an scale using Jetpack Compose version 1.5.4. So far so good, but my problem comes when I try to draw the weight indicator, which feels like it has some kind of aliasing.

enter image description here

As you can see, it should be a smooth triangle. What is wrong here?

My code is the following for that specific indicator:

drawPath(
    path = Path().apply {
        reset()
        arcTo(
            rect = Rect(
                center = scaleCenter,
                radius = innerRadius
            ),
            startAngleDegrees = 269.5f,
            sweepAngleDegrees = 1f,
            forceMoveTo = false
        )
        lineTo(
            x = scaleCenter.x + innerRadius * cos((3 * PI.toFloat()) / 2),
            y = scaleCenter.y + innerRadius * sin((3 * PI.toFloat()) / 2) - style.scaleIndicatorLength.toPx()
        )
        close()
    },
    color = style.scaleIndicatorColor
)
1

There are 1 answers

0
Martín On

It seemed that I had the drawPath inside thefor loop that I had to draw the scale lines. Since (I guess) the lines are limited by the pixel size, drawing over an over that path caused it to have that shape.

Now it is much smoother (not perfect thought, but I think it's as good as it can get)

enter image description here