Derived state in Android Kotlin - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ ui_behavior

intermediate

How does derived state update the UI?

Consider a Compose UI with a derivedStateOf that calculates the length of a text input. What happens when the user types a new character?

Android Kotlin

val text = remember { mutableStateOf("") }
val textLength = remember { derivedStateOf { text.value.length } }
TextField(value = text.value, onValueChange = { text.value = it })
Text(text = "Length: ${textLength.value}")

A The length text updates immediately when the input changes.

B The length text updates only when the TextField loses focus.

C The length text never updates after the first render.

D The length text updates only when a button is clicked.

💡 Hint

Derived state recalculates when its dependencies change.

derivedStateOf tracks dependencies like text.value and updates its value immediately when text changes, so the UI shows the new length right away.

❓ lifecycle

intermediate

When is derivedStateOf recomputed?

Given a derivedStateOf that depends on multiple mutable states, when does it recompute its value?

Android Kotlin

val count = remember { mutableStateOf(0) }
val enabled = remember { mutableStateOf(true) }
val derived = remember {
  derivedStateOf {
    if (enabled.value) count.value * 2 else 0
  }
}

A Only when enabled.value changes, ignoring count.value.

B Every time the composable recomposes, regardless of state changes.

C Only when count.value changes, ignoring enabled.value.

D Only when count.value or enabled.value changes.

💡 Hint

Derived state tracks all state reads inside its block.

derivedStateOf recomputes only when any of the states it reads (count.value or enabled.value) change, avoiding unnecessary recomputations.

🔧 Debug

advanced

Why does derivedStateOf not update as expected?

A developer uses derivedStateOf but notices the UI does not update when the base state changes. What is the most likely cause?

Android Kotlin

val baseState = mutableStateOf(0)
val derived = derivedStateOf { baseState.value * 2 }
// UI uses derived.value but does not recompose on baseState changes

A derivedStateOf was not wrapped in remember, so it recreates every recomposition.

B mutableStateOf was not initialized with a value.

C The UI is not reading derived.value, so no recomposition triggers.

D derivedStateOf does not track mutableStateOf values automatically.

💡 Hint

Compose only recomposes when observed state is read in the UI.

If the UI does not read derived.value, Compose does not know to recompose when derived changes, so the UI stays stale.

🧠 Conceptual

advanced

Why use derivedStateOf instead of recomputing directly in UI?

What is the main advantage of using derivedStateOf for computed values in Compose?

A It forces recomposition every frame for smoother UI animations.

B It caches the computed value and recomputes only when dependencies change, improving performance.

C It allows mutableStateOf to be used inside composables without remember.

D It disables recomposition to prevent UI updates.

💡 Hint

Think about avoiding unnecessary work in UI updates.

derivedStateOf caches the computed value and only recalculates when its dependencies change, reducing unnecessary recompositions and improving performance.

📝 Syntax

expert

Identify the correct syntax for derivedStateOf usage

Which option shows the correct way to declare a derivedStateOf that depends on a mutableStateOf in Compose?

A

val count = mutableStateOf(0)
val doubleCount = derivedStateOf { count.value * 2 }

B

val count = mutableStateOf(0)
val doubleCount = derivedStateOf(count.value * 2)

C

val count = mutableStateOf(0)
val doubleCount = derivedStateOf { count * 2 }

D

val count = mutableStateOf(0)
val doubleCount = derivedStateOf { count.value * 2 }()

💡 Hint

derivedStateOf takes a lambda returning the computed value.

derivedStateOf requires a lambda block that returns the computed value. Accessing count.value inside the lambda tracks the dependency.