Jetpack Composeでのリスト操作

Jetpack Compose の状態のCodeLab続き

データクラスを作って仮データを入れる

data class WellnessTask(val id: Int, val label: String)
private fun getWellnessTasks() = List(30) { i -> WellnessTask(i, "Task # $i") }

このデータクラスのListをLazyColumnに表示するには以下のようにListを引数で貰うときにremember

@Composable
fun WellnessTaskList(
    modifier: Modifier = Modifier,
    list: List<WellnessTask> = remember { getWellnessTasks() }
) {
    LazyColumn(
        modifier = modifier
    ) {
        items(list) { task ->
            WellnessTaskItem(taskName = task.label)
        }
    }
}

Composeで監視できるリスト

可変オブジェクト（ArrayList や mutableListOf, など）を使用しても機能しない。
Compose で監視できる MutableList のインスタンスを作成する必要がある。
List等既に設定したいCOLLECTIONがある場合はtoMutableStateList()を使用してMutableListを作成できる。
これからListを作るような場合は mutableStateListOfを使って初期値含めてMutableListを作る。

@Composable
fun WellnessScreen(modifier: Modifier = Modifier) {
   Column(modifier = modifier) {
       StatefulCounter()

       val list = remember { getWellnessTasks().toMutableStateList() }
       WellnessTasksList(list = list, onCloseTask = { task -> list.remove(task) })
   }
}

private fun getWellnessTasks() = List(30) { i -> WellnessTask(i, "Task # $i") }

次回はViewModelの状態