Draw Points With Canvas In Jetpack Compose.

Photo by Katie McNabb on Unsplash

In this article we will see how to draw points with Canvas in Jetpack Compose.

I have already written few articles on canvas.

• Draw Line With Canvas
• Draw Circle With Canvas
• Draw Rectangle With Canvas
• Draw an arc With Canvas
• Draw an oval with Canvas

To draw points, you need two things ,

• Canvas Composable function
• drawPoints() function

@Composable
fun DrawPoints() {

    Canvas(
        modifier = Modifier
            .padding(30.dp)
            .fillMaxWidth()
            .height(300.dp)
    ) {
        val width = size.width
        val height = size.height
        drawPoints(
            points = listOf(
                Offset(width / 2, 0f),
                Offset(width / 2, height / 2),
                Offset(width / 2, height)
            ),
            pointMode = PointMode.Points,
            color = Color.Red,
            strokeWidth = 50f,
            cap = StrokeCap.Round
        )
    }
}

As you can see above , we called Canvas Composable function and also provide width and height.

First it will take list of point’s positions in points parameter . Also provided the color and…