LazyColumn with items in Android Kotlin - Cheat Sheet & Quick Revision

Recall & Review

beginner

What is a LazyColumn in Jetpack Compose?

LazyColumn is a vertically scrolling list that only composes and lays out the visible items, improving performance for long lists.

beginner

How do you provide a list of data to a LazyColumn?

You use the items function inside LazyColumn to pass a list and define how each item should be displayed.

intermediate

What is the benefit of using items inside LazyColumn instead of a simple Column?

Using items inside LazyColumn loads only visible items, saving memory and CPU, unlike Column which renders all children at once.

beginner

Write a simple Kotlin snippet to display a list of strings in a LazyColumn.

LazyColumn { items(listOf("Apple", "Banana", "Cherry")) { item -> Text(text = item) } }

intermediate

Can you customize each item in LazyColumn? How?

Yes, inside the items block you can define any composable UI for each item, like Text, Image, Row, or custom layouts.

What does LazyColumn do differently compared to a regular Column?

A Automatically sorts the list items

B Displays items horizontally

C Preloads all items before displaying

D Only composes visible items to improve performance

LazyColumn composes only the visible items on screen, which saves resources compared to Column that composes all children at once.

Which function is used inside LazyColumn to display a list of data?

A items

B listOf

C forEach

D map

The items function inside LazyColumn takes a list and defines how each item is displayed.

What type of parameter does the items function take?

A A single string

B A list of data items

C A boolean flag

D An integer count

The items function takes a list of data items to display each one in the LazyColumn.

How do you access the current item inside the items block?

A Using a global variable

B Using an index variable only

C Using a lambda parameter, e.g., { item -> ... }

D You cannot access individual items

You access each item by defining a lambda parameter inside items, like { item -> ... }.

Which of these is NOT a benefit of LazyColumn?

A Preloading all items for faster display

B Automatic vertical scrolling

C Easy integration with lists of data

D Improved performance by lazy loading

LazyColumn does not preload all items; it loads only visible items to save resources.

Explain how LazyColumn improves performance when displaying long lists.

Think about how scrolling a long list feels smooth.

Describe how to use the items function inside LazyColumn with a list of strings.

Imagine showing a list of fruits on screen.

Practice

1. What is the main purpose of using LazyColumn in Android Jetpack Compose?

easy

A. To display a vertically scrolling list efficiently by loading only visible items

B. To create a horizontal scrolling list

C. To display a static grid layout

D. To handle user input events

Solution

1. Step 1: Understand LazyColumn's role

   LazyColumn is designed to show vertical lists efficiently by loading only the items visible on screen.

2. Step 2: Compare options

   Options A, B, and C are incorrect: A handles input events, B creates horizontal lists, C is for grids.

3. Final Answer:

   To display a vertically scrolling list efficiently by loading only visible items -> Option A

4. Quick Check:

   LazyColumn = Efficient vertical list [OK]

Hint: LazyColumn loads only visible items for smooth scrolling [OK]

Common Mistakes:

• Confusing LazyColumn with LazyRow (horizontal list)
• Thinking LazyColumn creates grids
• Assuming it handles input events

2. Which of the following is the correct syntax to display a list of strings named names inside a LazyColumn using items?

easy

A. LazyColumn { item(names) { name -> Text(name) } }

B. LazyColumn { items(names) { name -> Text(name) } }

C. LazyColumn { itemsOf(names) { name -> Text(name) } }

D. LazyColumn { itemsList(names) { name -> Text(name) } }

Solution

1. Step 1: Recall correct function name

   The function to display each element in a list inside LazyColumn is items, not item, itemsOf, or itemsList.

2. Step 2: Check lambda syntax

   The lambda receives each element (here name) and displays it with Text(name).

3. Final Answer:

   LazyColumn { items(names) { name -> Text(name) } } -> Option B

4. Quick Check:

   Use items() with list and lambda [OK]

Hint: Use items() to iterate list inside LazyColumn [OK]

Common Mistakes:

• Using item() instead of items() for lists
• Wrong function names like itemsOf or itemsList
• Incorrect lambda parameter usage

3. What will be displayed by this code snippet?

val fruits = listOf("Apple", "Banana", "Cherry")
LazyColumn {
  items(fruits) { fruit ->
    Text(text = fruit)
  }
}

medium

A. No output because of syntax error

B. A horizontal list showing Apple, Banana, Cherry

C. Only the first fruit 'Apple' is shown

D. A vertical list showing Apple, Banana, Cherry each on its own line

Solution

1. Step 1: Understand items usage

   The items function iterates over the fruits list and displays each element inside the LazyColumn.

2. Step 2: Check UI behavior

   LazyColumn shows a vertical scrolling list, so each fruit appears on its own line vertically.

3. Final Answer:

   A vertical list showing Apple, Banana, Cherry each on its own line -> Option D

4. Quick Check:

   items() + LazyColumn = vertical list [OK]

Hint: LazyColumn with items shows vertical list of all elements [OK]

Common Mistakes:

• Thinking LazyColumn creates horizontal lists
• Assuming only first item shows
• Confusing syntax causing no output

4. Identify the error in this LazyColumn code:

val numbers = listOf(1, 2, 3)
LazyColumn {
  items(numbers) { number ->
    Text(number)
  }
}

medium

A. Text() expects a String, but number is Int causing a type mismatch

B. items() cannot accept a list of integers

C. LazyColumn must use item() not items() for lists

D. No error, code works fine

Solution

1. Step 1: Check Text() parameter type

   The Text composable expects a String, but number is an Int, causing a type mismatch error.

2. Step 2: Confirm correct usage of items()

   The items function accepts lists of any type, so no error there.

3. Final Answer:

   Text() expects a String, but number is Int causing a type mismatch -> Option A

4. Quick Check:

   Text() needs String, not Int [OK]

Hint: Convert Int to String inside Text() to fix [OK]

Common Mistakes:

• Assuming items() rejects Int lists
• Using item() instead of items() for lists
• Ignoring type mismatch in Text()

5. You want to display a list of user names with their index number in a LazyColumn. Which code correctly shows the index and name together?

hard

A. LazyColumn { items(users) { index, user -> Text("$index: $user") } }

B. LazyColumn { items(users) { user -> Text("$index: $user") } }

C. LazyColumn { itemsIndexed(users) { index, user -> Text("$index: $user") } }

D. LazyColumn { itemsIndexed(users) { user -> Text(user) } }

Solution

1. Step 1: Identify function for index and item

   To get both index and item, use itemsIndexed which provides both parameters in the lambda.

2. Step 2: Check lambda parameters and usage

   LazyColumn { itemsIndexed(users) { index, user -> Text("$index: $user") } } correctly uses index, user and displays them with string interpolation.

3. Final Answer:

   LazyColumn { itemsIndexed(users) { index, user -> Text("$index: $user") } } -> Option C

4. Quick Check:

   Use itemsIndexed() for index + item [OK]

Hint: Use itemsIndexed() to get index and item in LazyColumn [OK]

Common Mistakes:

• Using items() when index is needed
• Wrong lambda parameters count
• Trying to access index without itemsIndexed()