Zig-zag Grid Layout Composable

GridItem.kt

@Composable
fun GridItem(
    modifier: Modifier = Modifier
) {
    val interactionSource = remember { MutableInteractionSource() }
    val indication = rememberRipple(bounded = false)
    Box(
        modifier = modifier.size(160.dp)
    ) {
        Image(
            painter = networkImagePainter(url = ""),
            contentDescription = "",
            modifier = Modifier
                .clickable(interactionSource, indication, true) {
                    onClick.invoke()
                }
                .clip(CircleShape)
                .fillMaxSize(),
            contentScale = ContentScale.Crop
        )
    }
}

Preview.kt

@Preview(
    showBackground = true,
)
@Composable
fun PreviewStayCayLayout() {
    ZigZagLayout(
        modifier = Modifier.background(BLUE_LIGHT)
            .padding(20.dp)
    ) {
        GridItem()
        GridItem()
        GridItem()
        GridItem()
        GridItem()
        GridItem()
        GridItem()
    }
}

ZigZagLayout.kt

@Composable
fun ZigZagLayout(
    modifier: Modifier = Modifier,
    content: @Composable () -> Unit = {}
) {
    Layout(
        content = content,
        modifier = modifier.wrapContentHeight()
    ) { measurables, constraints ->

        val columns = 2
        val widthPerColumn = constraints.maxWidth / columns

        val gridConstraint = constraints.copy(
            maxWidth = max(constraints.maxWidth, constraints.minWidth) / columns,
            maxHeight = max(constraints.maxWidth, constraints.minWidth) / columns
        )

        val placeables = measurables.map { measurable ->
            // Measure each children
            measurable.measure(gridConstraint)
        }

        layout(constraints.maxWidth, constraints.maxHeight) {
            var currentVerticalMark = 0
            placeables.forEachIndexed { index, placeable ->
                var xPosition = (constraints.maxWidth / columns) * (index % columns)
                xPosition +=
                    if (index.isEven()) (widthPerColumn * 0.1).toInt()
                    else -(widthPerColumn * 0.1).toInt()

                var yPosition = currentVerticalMark + (index / columns)
                if (index > 0)
                    yPosition -= (widthPerColumn * 0.3).toInt()

                placeable.placeRelative(x = xPosition, y = yPosition)
                currentVerticalMark = yPosition + placeable.height
            }
        }
    }
}

private fun Int.isEven() = (this % 2 == 0)