#3 - Work with lists

BasicStateCodelab/app/src/main/java/jik/compose/basicstatecodelab/MainActivity.kt

@@ -27,4 +27,12 @@ class MainActivity : ComponentActivity() {
             }
         }
     }
+
+    @Preview(showBackground = true, backgroundColor = 0xFFF0EAE2)
+    @Composable
+    fun PreviewWellnessTaskItem() {
+        BasicStateCodelabTheme {
+            WellnessTaskItem("This is a Task",true,{}, {})
+        }
+    }
 }

BasicStateCodelab/app/src/main/java/jik/compose/basicstatecodelab/WellnessScreen.kt

@@ -1,10 +1,16 @@
 package jik.compose.basicstatecodelab
 
+import androidx.compose.foundation.layout.Column
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 
 
 @Composable
 fun WellnessScreen(modifier: Modifier = Modifier) {
-    StatefulCounter(modifier)
+    Column(
+        modifier = modifier
+    ) {
+        StatefulCounter()
+        WellnessTaskList()
+    }
 }

BasicStateCodelab/app/src/main/java/jik/compose/basicstatecodelab/WellnessTask.kt

@@ -0,0 +1,6 @@
+package jik.compose.basicstatecodelab
+
+data class WellnessTask(
+    val id: Int,
+    val label: String,
+)

BasicStateCodelab/app/src/main/java/jik/compose/basicstatecodelab/WellnessTaskItem.kt

@@ -0,0 +1,58 @@
+package jik.compose.basicstatecodelab
+
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.padding
+import androidx.compose.material.Checkbox
+import androidx.compose.material.Icon
+import androidx.compose.material.IconButton
+import androidx.compose.material.Text
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.Close
+import androidx.compose.runtime.*
+import androidx.compose.runtime.saveable.rememberSaveable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.unit.dp
+
+@Composable
+fun WellnessTaskItem(taskName: String, modifier: Modifier = Modifier) {
+    var checkedState by rememberSaveable { mutableStateOf(false) }
+
+    WellnessTaskItem(
+        taskName = taskName,
+        checked = checkedState,
+        onCheckedChange = { newValue -> checkedState = newValue },
+        onClose = { /*TODO*/ },
+        modifier = modifier
+    )
+}
+
+
+@Composable
+fun WellnessTaskItem(
+    taskName: String,
+    checked: Boolean,
+    onCheckedChange: (Boolean) -> Unit,
+    onClose: () -> Unit,
+    modifier: Modifier = Modifier
+) {
+    Row(
+        verticalAlignment = Alignment.CenterVertically,
+        modifier = modifier
+    ) {
+        Text(
+            text = taskName,
+            modifier = Modifier
+                .weight(1f)
+                .padding(start = 16.dp)
+        )
+        Checkbox(checked = checked, onCheckedChange = onCheckedChange)
+        IconButton(onClick = onClose) {
+            Icon(
+                imageVector = Icons.Filled.Close,
+                contentDescription = "Close"
+            )
+        }
+    }
+}
+

BasicStateCodelab/app/src/main/java/jik/compose/basicstatecodelab/WellnessTasksList.kt

@@ -0,0 +1,23 @@
+package jik.compose.basicstatecodelab
+
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.lazy.items
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.remember
+import androidx.compose.ui.Modifier
+
+private fun getWellnessTasks() = List(30) { i -> WellnessTask(i, "Task # $i") }
+
+@Composable
+fun WellnessTaskList(
+    modifier: Modifier = Modifier,
+    list: List<WellnessTask> = remember { getWellnessTasks() }
+) {
+    LazyColumn(
+        modifier = modifier
+    ) {
+        items(list) { task ->
+            WellnessTaskItem(taskName = task.label)
+        }
+    }
+}