Logic

canvas.kt

val scrollState = rememberScrollState()
val items = listOf(1, 2, 3, 4)

Box {

    Image(
        bitmap = bg.asImageBitmap(),
        contentDescription = "",
        modifier = Modifier.fillMaxWidth()
    )

    Canvas(
        modifier = Modifier
            .horizontalScroll(scrollState)
            .width((items.size * (cardWidthDp + cardMarginDp) + cardMarginDp).dp)
            .height(screenWidthDp.dp)
    ) {
        for (i in items.indices) {
            val path = Path()

            path.addRoundRect(
                RoundRect(
                    Rect(
                        Offset(
                            (i * (cardWidthPx + cardMarginPx) + cardMarginPx).toFloat(),
                            0f
                        ),
                        Size(cardWidthPx.toFloat(), cardHeightPx.toFloat())
                    ),
                    CornerRadius(10.dp.toPx())
                )
            )

            clipPath(path, clipOp = ClipOp.Intersect) {
                drawImage(
                    bgBlurred.asImageBitmap(),
                    Offset(scrollState.value.toFloat(), 0f)
                )
            }
        }
    }

    Row(
        modifier = Modifier
            .horizontalScroll(scrollState)
            .padding(
                start = cardMarginDp.dp,
                end = cardMarginDp.dp
            ),
        horizontalArrangement = Arrangement.spacedBy(cardMarginDp.dp),
    ) {
        items.forEach {
            Box(
                modifier = Modifier
                    .width(cardWidthDp.dp)
                    .padding(15.dp)
            ) {
                Text("Item $it")
            }
        }
    }

}