PinnableItem in Compose 1.4.0

PinnableSample.kt

@Composable
fun PinnableItemSample(modifier: Modifier = Modifier) {
    LazyColumn(
        modifier = modifier
            .background(color = Color.LightGray)
    ) {
        items(5, key = { it + 1 }) {
            ListItem(
                modifier = Modifier.fillMaxWidth().padding(all = 16.dp),
                item = it + 1
            )
        }

        item(key = 0) {
            PinnedItem(
                modifier = Modifier.fillMaxWidth().padding(all = 16.dp)
            )
        }

        items(10, key = { it + 6 }) {
            ListItem(
                modifier = Modifier.fillMaxWidth().padding(all = 16.dp),
                item = it + 6
            )
        }
    }
}

@Composable
private fun PinnedItem(modifier: Modifier = Modifier) {
    var time by remember { mutableStateOf(0) }

    // uncomment to check the PinnableItem's effect
    /*
    val pinnableContainer = LocalPinnableContainer.current
    DisposableEffect(pinnableContainer) {
        val pinnedHandle = pinnableContainer?.pin()
        onDispose {
            pinnedHandle?.release()
        }
    }
    */

    LaunchedEffect(Unit) {
        while(true) {
            time++
            delay(1_000)
        }
    }

    Row(
        modifier
            .background(color = Color.DarkGray, shape = RoundedCornerShape(8.dp))
            .padding(16.dp)
    ) {
        BasicText(
            text = "${time}秒 経過しました！",
            style = TextStyle(
                fontSize = 20.sp,
                fontWeight = FontWeight.Bold,
                color = Color.LightGray
            )
        )
    }
}

@Composable
private fun ListItem(
    modifier: Modifier = Modifier,
    item: Int
) {
    Row(
        modifier = modifier
            .background(color = Color.White, shape = RoundedCornerShape(8.dp))
            .padding(16.dp)
    ) {
        Box(modifier = Modifier
            .size(48.dp)
            .background(color = Color.Gray, shape = CircleShape)
        )

        Spacer(modifier = Modifier.width(16.dp))

        Column(modifier = Modifier.weight(1f)) {
            BasicText(
                text = "タイトル $item",
                style = TextStyle(
                    fontSize = 16.sp,
                    fontWeight = FontWeight.Bold
                )
            )

            BasicText(
                text = "#$item アイテムの説明文章はこちらです。",
                style = TextStyle(
                    fontSize = 14.sp,
                    fontWeight = FontWeight.Normal
                )
            )
        }
    }
}

@Preview(showBackground = true)
@Composable
fun PreviewPinnableItemSample() {
    PinnableItemSample()
}