Özet - Dialoglar
- Flutter kursu
- Orta seviye
- Ders 95/99
- 4 dk
showDialog ve SnackBar'ı birleştirerek geri bildirim yaparsın.
Geri bildirim akışı
showDialog ve SnackBar'ı birleştirerek tutarlı bir geri bildirim akışı kurarsın. Kullanıcı bir aksiyon onayladığında showDialog ile soru sorar, 'Tamam' butonunda Navigator.pop(context) ile pencereyi kapatır ve hemen ardından ScaffoldMessenger.of(context).showSnackBar ile kısa bir onay mesajı gösterirsin.
showDialog(
context: context,
builder: (_) => AlertDialog(
title: const Text('Silinsin mi?'),
actions: [
TextButton(
onPressed: () {
Navigator.pop(context);
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(content: Text('Silindi')),
);
},
child: const Text('Tamam'),
),
],
),
);Uygulama Onay akışını yaz
SilButon adında StatelessWidget tanımla. build bir ElevatedButton döndürsün; onPressed içinde showDialog çağrısı yapsın. builder bir AlertDialog döndürsün; title Text('Silinsin mi?') olsun ve actions içinde bir TextButton bulunsun. Butonun onPressed'ında önce Navigator.pop(context) sonra ScaffoldMessenger.of(context).showSnackBar(SnackBar(content: Text('Silindi'))) çağrısı yapsın. main içinde 'hazir' yazdır.
Başlangıç kodu
import 'package:flutter/material.dart';
// SilButon StatelessWidget tanımla
// build ElevatedButton döndürsün
// onPressed showDialog çağırsın
// AlertDialog title ve actions içersin
// TextButton önce pencereyi kapatsın, sonra mesaj göstersin
void main() {
// 'hazir' yazdır
}Örnek çözüm
import 'package:flutter/material.dart';
class SilButon extends StatelessWidget {
const SilButon({super.key});
@override
Widget build(BuildContext context) {
return ElevatedButton(
onPressed: () {
showDialog(
context: context,
builder: (_) => AlertDialog(
title: const Text('Silinsin mi?'),
actions: [
TextButton(
onPressed: () {
Navigator.pop(context);
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(content: Text('Silindi')),
);
},
child: const Text('Tamam'),
),
],
),
);
},
child: const Text('Sil'),
);
}
}
void main() {
print('hazir');
}Beklenen çıktı
hazir
Soru ve cevaplar
Dersin sorularını cevaplarıyla birlikte inceleyebilirsin. Kendini denemek istersen dersi interaktif olarak çöz.
1 Geri bildirim akışında 'Tamam' butonuna basıldığında hangi sıra izlenir?
- showDialog → Navigator.pop → showSnackBar
- Navigator.pop → showSnackBar Doğru cevap
- showSnackBar → showDialog → Navigator.pop
- Navigator.pop → showDialog → showSnackBar
Açıklama: Akışta önce Navigator.pop ile pencere kapatılır, sonra ScaffoldMessenger.showSnackBar ile onay mesajı gösterilir. showDialog pencere açma fonksiyonudur, akışın ortasında tekrar çağrılmaz.
2 Pencereyi kapat
TextButton(
onPressed: () {
____(context);
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(content: Text('Silindi')),
);
},
child: const Text('Tamam'),
)TextButton(
onPressed: () {
Navigator.pop(context);
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(content: Text('Silindi')),
);
},
child: const Text('Tamam'),
)Açıklama: Pencereyi kapatmak için Navigator.pop(context) kullanılır. push yeni ekran açar, context.go GoRouter metodudur, showDialog pencere açar kapatmaz.
3 Özet parçaları
| Kavram | Anlamı |
|---|---|
showDialog |
pencere açma |
AlertDialog |
içerik widget'ı |
Navigator.pop |
pencere kapatma |
ScaffoldMessenger.showSnackBar |
onay mesajı |