アプリ開発備忘録

PlayStationMobile、Android、UWPの開発備忘録

Listを作成する(deprecate:0.2.0)【Jetpack Compose (Desktop)】

バージョン情報

plugins {
    kotlin("jvm") version "1.4.20"
    id("org.jetbrains.compose") version "0.2.0-build132"
}

0.3.0LazyColumnFor が無くなって、LazyColumnに統合されたようなので、最新情報はコチラを見てください。
https://matsudamper.hatenablog.com/entry/2021/02/07/232036

本文

Flowを使用してみました。
MutableState と違うのはcollectAsStateを使用するとこです。
LazyColumnFor を使用します。Indexが欲しければ LazyColumnForIndexed を使用します。
LazyColumnFor のブロックではレンダリングに必要な要素だけが流れてくるので、それを元にViewをその1つ分だけ生成します。
ちゃんとスクロールできます。
f:id:matsudamper:20210206231701p:plain:w400

fun main() = Window {
    MaterialTheme {
        val listItems = remember { MutableStateFlow(listOf(0)) }
        Column {
            Column {
                Button(
                    onClick = {
                        listItems.value = listItems.value
                            .plus(listItems.value.last() + 1)
                    }
                ) {
                    Text(text = "add list")
                }
            }

            LazyColumnFor(
                modifier = Modifier.fillMaxSize(),
                items = listItems.collectAsState().value
            ) { item: Int ->
                Column(
                    modifier = Modifier.height(100.dp)
                ) {
                    Text(text = item.toString())
                }
                Divider(color = Color.Black)
            }

        }
    }
}