Slot APIs

Jetpack Compose Mid-level Kotlin 2.0+ API 24+ Reviewed By Best Latest Apps

Spot the bug

The list's first item hides under the top bar. Which line is the bug?

  1. @OptIn(ExperimentalMaterial3Api::class)
  2. @Composable
  3. fun NotesScreen(notes: List<String>) {
  4. Scaffold(topBar = { TopAppBar(title = { Text("Notes") }) }) { padding ->
  5. LazyColumn {
  6. items(notes) { Text(it) }
  7. }
  8. }
  9. }
Hint 1 of 1

What does Scaffold pass to its content?

Choose an answer, then open Show answer below to check it.

Show answer
  • Answer: line 5 LazyColumn {

The content ignores the padding that Scaffold provides. Use LazyColumn(contentPadding = padding) or Modifier.padding(padding).

30-second answer

A slot API takes composable lambdas as parameters, like TopAppBar(title = { }, actions = { }) or Scaffold(topBar = { }) { padding -> }. The component owns layout and behaviour, while the caller decides what goes in each slot. That's more flexible than dozens of parameters for text, icon and colour.

Practise saying it · 25 s. No recording, just a timer

Explain slot APIs.

Say your answer out loud, then check which of these points you covered:

  • Composable lambdas as parameters
  • Component owns layout, caller fills slots
  • Use scope receivers where needed
  • Respect Scaffold padding

Deep dive

Slots are typed as @Composable () -> Unit, sometimes with a receiver like RowScope so the caller can use Modifier.weight.

Make optional slots nullable (icon: (@Composable () -> Unit)? = null) so the component can lay out differently when missing.

Scaffold passes PaddingValues into its content slot; ignoring them puts content under the app bars.

Slots keep design-system components small and reusable.

Common mistakes

  • Ignoring Scaffold's padding parameter.
  • Adding a parameter for every visual variation instead of a slot.
  • Calling slot lambdas more than once by accident.

Senior take & follow-ups

Give a design-system example: a card with header and actions slots.

Follow-up questions

Think of your answer first, then open the hint.

  1. Why does Scaffold give you PaddingValues?

    Show hint

    So content can avoid the top and bottom bars and system insets.

  2. When would you use a RowScope receiver?

    Show hint

    When slot content should use Row modifiers like weight.

Related questions

Suggest a fix if something here is wrong or out of date.