Skip to content

Instantly share code, notes, and snippets.

@KvRae
Created May 24, 2024 14:04
Show Gist options
  • Save KvRae/4f1311858705a2cd4072c49fe0d789c9 to your computer and use it in GitHub Desktop.
Save KvRae/4f1311858705a2cd4072c49fe0d789c9 to your computer and use it in GitHub Desktop.
A vertical dashed divider implementation for jetpack compose
/**
* A vertical dashed divider that can be used to separate content in a composable
* @param modifier the modifier to apply to the divider
* @param thickness the thickness of the divider
* @param color the color of the divider
* @author KvRae
*/
@Composable
fun VerticalDashedDivider(
modifier: Modifier = Modifier,
thickness: Dp = DividerDefaults.Thickness,
color: Color = Color.Gray,
) = Canvas(modifier.fillMaxWidth().width(thickness)) {
val pathEffect = PathEffect.dashPathEffect(
intervals = floatArrayOf(10f, 10f),
phase = 0f
)
drawLine(
color = color,
strokeWidth = thickness.toPx(),
start = Offset(thickness.toPx() / 2, 0f),
end = Offset(thickness.toPx() / 2, size.height),
pathEffect = pathEffect
)
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment