Why Compose is the modern UI toolkit in Android Kotlin - Test Your Understanding

Practice - 5 Tasks

1fill in blank

easy

Complete the code to create a simple Compose text element that says "Hello World".

Android Kotlin

Text(text = [1])

Drag options to blanks, or click blank then click option'

AgetString(R.string.hello)

BHello World

CR.string.hello

D"Hello World"

Attempts:

3 left

💡 Hint

Common Mistakes

Forgetting quotes around the text string.

Using resource IDs directly without context.

In Compose, text content must be a string literal or variable. The text must be in quotes to be a string.

2fill in blank

medium

Complete the code to create a button with a click listener in Compose.

Android Kotlin

Button(onClick = [1]) {
    Text("Click me")
}

Drag options to blanks, or click blank then click option'

AonButtonClick()

BonButtonClick

C{ onButtonClick() }

D() -> onButtonClick()

Attempts:

3 left

💡 Hint

Common Mistakes

Passing a function call instead of a lambda.

Omitting the curly braces around the lambda.

The onClick parameter expects a lambda function. Wrapping the function call inside curly braces creates a lambda.

3fill in blank

hard

Fix the error in the Compose code to display a list of items using LazyColumn.

Android Kotlin

LazyColumn {
    items([1]) { item ->
        Text(text = item)
    }
}

Drag options to blanks, or click blank then click option'

AlistOf("Apple", "Banana", "Cherry")

BitemsList

Citems

DitemList()

Attempts:

3 left

💡 Hint

Common Mistakes

Using a function call instead of a list variable.

Using an undefined variable name.

The items function expects a list variable. Use the variable name that holds the list, not a function call or undefined name.

4fill in blank

hard

Fill both blanks to create a composable function with a parameter and display it.

Android Kotlin

fun Greeting([1]: String) {
    Text(text = "Hello, [2]!")
}

Drag options to blanks, or click blank then click option'

Aname

Busername

Duser

Attempts:

3 left

💡 Hint

Common Mistakes

Using different names for the parameter and inside the text.

Using undefined variables inside the text.

The parameter name and the variable used inside the text must match to display the passed value correctly.

5fill in blank

hard

Fill all three blanks to create a stateful counter button in Compose.

Android Kotlin

var count by remember { mutableStateOf([1]) }

Button(onClick = { count [2] 1 }) {
    Text(text = "Clicked [3] times")
}

Drag options to blanks, or click blank then click option'

A0

B+=

C$count

D1

Attempts:

3 left

💡 Hint

Common Mistakes

Not initializing count to zero.

Using wrong operator for increment.

Not using string interpolation to show count.

Initialize count to 0, increment it with += 1 on click, and display the current count using $count inside the text.