Android Compose – Display List of Items

To display a List of items in Android Compose from a Kotlin List, we may use a Column composable. Inside Column we iterate over items of the list, and return a composable for each item.

The following code snippet shows how to achieve the above solution.

Column {
    myList.forEach { item ->


In this example, we display a list of students along with their credits.

  • To store the details of each student, we use the data class Student. And initialized the students list object with some dummy values.
  • Inside the composable StudentList, we have a Column in which we iterate over the students list using List.forEach{}. The Column is set to scroll vertically using modifier.
  • For each student, we return a StudentRow composable. Inside StudentRow we are using a Card to display the student details.

Create a Project in Android Studio with Empty Compose Activity template, and modify MainActivity.kt file as shown in the following.


package com.example.myapplication

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.material.Card
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Surface
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import com.example.myapplication.ui.theme.MyApplicationTheme

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        setContent {
            MyApplicationTheme {
                Surface(color = MaterialTheme.colors.background) {

data class Student(val name: String, val credits: Int)
val students = listOf(
    Student("Student 1", 125),
    Student("Student 2", 75),
    Student("Student 3", 15),
    Student("Student 4", 87),
    Student("Student 5", 22),
    Student("Student 6", 96),

fun StudentList(students: List<Student>) {
    Column(modifier = Modifier.verticalScroll(rememberScrollState())) {
        students.forEach { student ->

fun StudentRow(student: Student) {
    Card(modifier = Modifier
        .padding(all = 10.dp)
        .fillMaxWidth()) {
        Column(modifier = Modifier.padding(all = 10.dp)) {
            Text(, fontSize = 25.sp, fontWeight = FontWeight.W700, modifier = Modifier.padding(10.dp))
            Text(student.credits.toString(), color = Color.Gray, modifier = Modifier.padding(10.dp))


Android Compose - Display List of Items


In this Android Jetpack Compose Tutorial, we learned how to display items from a Kotlin List as a list of items in Android UI.