Jetpack compose LazyList(RecyclerView) parallax scroll effect

lazyListParallaxScrolling.kt

@Composable
fun ParallaxScrollingContent(lazyListState: LazyListState) {
    val firstItemTranslationY by remember {
        derivedStateOf {
            if (lazyListState.layoutInfo.visibleItemsInfo.isNotEmpty() && lazyListState.firstVisibleItemIndex == 0) {
                lazyListState.firstVisibleItemScrollOffset * 0.0f
            } else {
                0f
            }
        }
    }
    val firstItemVisibility by remember {
        derivedStateOf {
            if (lazyListState.layoutInfo.visibleItemsInfo.isNotEmpty() && lazyListState.firstVisibleItemIndex == 0) {
                1 - lazyListState.firstVisibleItemScrollOffset.toFloat() / lazyListState.layoutInfo.visibleItemsInfo[0].size
            } else {
                1f
            }
        }
    }

    LazyColumn(state = lazyListState) {
        item {
            Image(
                painter = painterResource(R.drawable.team_discussing),
                contentDescription = "team discussing",
                modifier = Modifier
                    .aspectRatio(16 / 9f)
                    .graphicsLayer {
                        alpha = firstItemVisibility
                        translationY = firstItemTranslationY
                    },
                contentScale = ContentScale.Crop
            )
        }
        items(
            items = List(50) { index -> "Item number ${index + 1}" },
            key = { item -> item }
        ) { item ->
            Column(
                modifier = Modifier
                    .fillMaxWidth()
                    .background(MaterialTheme.colors.surface)
                    .padding(horizontal = 16.dp)
            ) {
                Text(
                    text = item,
                    modifier = Modifier.padding(vertical = 8.dp),
                    style = MaterialTheme.typography.body1
                )
                Divider()
            }
        }
    }
}