Multi Dashed Line

Lines.kt

@Composable
fun MultiDashedLine(color: Color, modifier: Modifier = Modifier) {
  val density = LocalDensity.current
  with(density) {
    val dashOnInterval1 = (LINE_WIDTH * 4).toPx()
    val dashOffInterval1 = (LINE_WIDTH * 2).toPx()
    val dashOnInterval2 = (LINE_WIDTH / 4).toPx()
    val dashOffInterval2 = (LINE_WIDTH * 2).toPx()

    val pathEffect =
      PathEffect.dashPathEffect(
        intervals = floatArrayOf(dashOnInterval1, dashOffInterval1, dashOnInterval2, dashOffInterval2),
        phase = 0f
      )
    Canvas(modifier) {
      drawLine(
        color = color,
        start = Offset(0f, 0f),
        end = Offset(size.width, 0f),
        strokeWidth = LINE_WIDTH.toPx(),
        cap = StrokeCap.Round,
        pathEffect = pathEffect,
      )
    }
  }
}