Snackbars & SnackbarHostState
Show transient messages the Material way.
Snackbars & SnackbarHostState is a free Jetpack Compose Academy lesson on CoddyKit — lesson 4 of 4. You can read the complete lesson below for free — then practise it hands-on in the browser with a built-in code editor and a 24/7 AI tutor. It is part of the Jetpack Compose Academy learning path, one of 4 lessons in the course, and your progress syncs across the web and the CoddyKit app.
What Is a Snackbar?
A Snackbar is a brief message that slides up at the bottom, like Message sent, then fades on its own. It informs without blocking the screen. 💬
Snackbar vs Dialog
A dialog demands a response; a Snackbar does not. Reach for it for quick confirmations, not for choices the user must make.
Meet SnackbarHostState
Showing a snackbar is driven by SnackbarHostState. This object holds the queue and gives you the function that triggers a message.
val hostState = remember { SnackbarHostState() }Remember It
Wrap the state in remember so the same SnackbarHostState survives recomposition. A fresh one each frame would lose any pending message.
The snackbarHost Slot
Tell Scaffold where snackbars appear by filling its snackbarHost slot with a SnackbarHost bound to your state.
snackbarHost = { SnackbarHost(hostState) }showSnackbar Is Suspend
The showSnackbar function suspends, because it waits while the message is visible. So you must call it from a coroutine, not directly in a click.
Launch From a Scope
Grab a rememberCoroutineScope and launch showSnackbar inside it. That bridges a normal onClick to the suspend call safely.
scope.launch {
hostState.showSnackbar("Saved")
}Add an Action
Pass an actionLabel to add a button, such as Undo. The call returns a result telling you whether the user tapped that action.
val result = hostState.showSnackbar(
"Deleted", actionLabel = "Undo"
)React to the Result
Check the returned SnackbarResult. If it equals ActionPerformed, run your undo logic; otherwise the snackbar simply dismissed.
if (result == SnackbarResult.ActionPerformed) {
restoreItem()
}Control the Duration
Set how long it lingers with SnackbarDuration: Short, Long, or Indefinite. Use Indefinite only when the message truly needs the user to act.
One Host, Many Messages
A single SnackbarHostState queues messages, showing them one at a time. So share one host per Scaffold rather than creating several.
Quick Check
Why must you launch showSnackbar inside a coroutine scope?
Recap
Remember a SnackbarHostState, wire it into Scaffold's snackbarHost, then launch showSnackbar from a scope. You can finish a polished app shell now. 🎉
Frequently asked questions
Is the “Snackbars & SnackbarHostState” lesson free?
Yes — the full text of “Snackbars & SnackbarHostState” is free to read here on the web, and the Jetpack Compose Academy course includes 4 lessons in total. To practise it interactively (a built-in code editor and a 24/7 AI tutor) and unlock the rest of the Jetpack Compose Academy course, upgrade to CoddyKit PRO.
What will I learn in “Snackbars & SnackbarHostState”?
Show transient messages the Material way. You practise Jetpack Compose Academy with hands-on code you run directly in the browser, and a 24/7 AI tutor answers your questions as you work through the lesson.
Do I need any experience to start Jetpack Compose Academy?
No prior experience is required. Jetpack Compose Academy on CoddyKit is structured for beginners through advanced learners; this is — lesson 4 of 4, so you can start here or from the beginning and move at your own pace.
How long does the “Snackbars & SnackbarHostState” lesson take?
Most CoddyKit lessons take about 5–10 minutes. Each one is bite-sized and interactive, so you make steady progress and pick up exactly where you left off across the web and the app.
Can I write and run code in this Jetpack Compose Academy lesson?
Yes. Every Jetpack Compose Academy lesson includes a built-in code editor, so you write and run real code right in your browser and get instant AI feedback — no local setup required.
All lessons in this course
- Scaffold: The Screen Skeleton
- TopAppBar & Action Icons
- Bottom Bars & Floating Action Buttons
- Snackbars & SnackbarHostState