ScaffoldMessenger
- Flutter course
- Intermediate
- Lesson 93/99
- 4 min
Show a SnackBar with ScaffoldMessenger.
What is ScaffoldMessenger?
ScaffoldMessenger is the structure used to show a SnackBar. With ScaffoldMessenger.of(context).showSnackBar(...) you display a brief info message. The SnackBar appears at the bottom of the screen and disappears on its own after a few seconds.
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(content: Text('Kaydedildi')),
);Unlike a modal dialog, this approach does not interrupt the user's flow.
SnackBar content
The content parameter of SnackBar takes the widget to display; usually a Text. The duration parameter sets how long the message stays visible; the default is about four seconds.
SnackBar(
content: const Text('İşlem başarılı'),
duration: const Duration(seconds: 2),
)This widget is shown in the bottom bar managed by ScaffoldMessenger.
Practice Show a SnackBar
Define a StatelessWidget named BildirimButon. Its build should return an ElevatedButton whose onPressed calls ScaffoldMessenger.of(context).showSnackBar(...). The SnackBar's content should be Text('Kaydedildi'). Print 'hazir' in main.
Starter code
import 'package:flutter/material.dart';
// BildirimButon StatelessWidget tanımla
// build ElevatedButton döndürsün
// onPressed alt bilgi mesajı göstersin
void main() {
// 'hazir' yazdır
}Sample solution
import 'package:flutter/material.dart';
class BildirimButon extends StatelessWidget {
const BildirimButon({super.key});
@override
Widget build(BuildContext context) {
return ElevatedButton(
onPressed: () {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(content: Text('Kaydedildi')),
);
},
child: const Text('Kaydet'),
);
}
}
void main() {
print('hazir');
}Expected output
hazir
Questions and answers
Review the lesson questions together with their answers. To test yourself, solve the lesson interactively.
1 What does ScaffoldMessenger.of(context).showSnackBar display?
- A SnackBar Correct answer
- An AlertDialog
- A ModalBottomSheet
- A Drawer
Explanation: showSnackBar displays a SnackBar; a brief bottom info message. AlertDialog is for dialogs, ModalBottomSheet is for bottom sheets, and Drawer is for side menus; showSnackBar does not display these.
2 ScaffoldMessenger access
____.of(context).showSnackBar(
SnackBar(content: Text('Kaydedildi')),
);ScaffoldMessenger.of(context).showSnackBar(
SnackBar(content: Text('Kaydedildi')),
);Explanation: ScaffoldMessenger.of(context) is used to show a SnackBar. Navigator is for routing, Scaffold is a screen skeleton, and MaterialApp is the root widget; none of these have showSnackBar.
3 ScaffoldMessenger parts
| Term | Meaning |
|---|---|
ScaffoldMessenger |
Message manager |
showSnackBar |
Method to show a message |
SnackBar |
Bottom info bar |
content |
Message content |