Lists (LazyColumn, LazyRow)

Relax. We'll talk through this in plain words — no textbook voice.

What you'll walk away with

Understand Lists (LazyColumn, LazyRow) without any of the intimidation
Be able to run Android Studio/Compose code yourself
Apply this concept immediately in a real project

Let's think about it for a second

`Column` renders all of its child composables at once — if you have 1000 items, it renders all 990 items that aren't even visible on screen yet, which hurts performance. `LazyColumn` does 'lazy loading' like RecyclerView (Android's traditional list component) — it renders only the items currently visible on screen, and renders new items on demand as you scroll — this lets you scroll smoothly even with large numbers of items.

Let's connect this to a real-world scenario

In a todo list app, writing `LazyColumn { items(todoList) { todo -> TodoRow(todo) } }` means that even with 100 todo items, only the 5-6 that are visible on screen at any moment get rendered, with new items rendered on demand as you scroll — much better performance.

LazyColumn = a vertically scrollable list that renders only visible items (lazy loading)
Column = renders all children at once (performance can suffer with many items)
items(list) { item -> ... } = iterate over a data list inside a LazyColumn

Let's look at an example together

kotlin

@Composable
fun TodoListScreen(todos: List<TodoItem>) {
    LazyColumn(
        modifier = Modifier.fillMaxSize(),
        contentPadding = PaddingValues(16.dp)
    ) {
        items(todos) { todo ->
            Row(
                modifier = Modifier.fillMaxWidth().padding(vertical = 8.dp)
            ) {
                Checkbox(checked = todo.isDone, onCheckedChange = {})
                Text(todo.title)
            }
        }
    }
}

You should see

You should see a list of 5-10 todo items on the emulator that scrolls smoothly.

Try it in 5 minutes

Create a list of `TodoItem` (the data class from the Basics chapter) with 10 sample items, and run `TodoListScreen` — scroll through it and confirm it's smooth.

A quick word of caution

Adding a child composable with `Modifier.fillMaxHeight()` inside `LazyColumn` can cause a crash (infinite height constraint) — children of a LazyColumn should define their own height.

Easy traps

Defaulting to `LazyColumn` even for a short list with just 5-6 items — `Column` is simpler and more appropriate when there are only a few items
Rendering reorderable data in `items()` without a `key` parameter — item animations/state can get messy

Now try it yourself

Create a list of `TodoItem` (the data class from the Basics chapter) with 10 sample items, and run `TodoListScreen` — scroll through it and confirm it's smooth.

You'll know it worked when: You should see a list of 5-10 todo items on the emulator that scrolls smoothly.