AlertDialog
- Flutter kursu
- Orta seviye
- Ders 92/99
- 4 dk
AlertDialog ile başlık, içerik ve aksiyon yapmayı öğrenirsin.
AlertDialog nedir?
AlertDialog, başlık, içerik ve aksiyon butonları içeren bir Material penceresidir. title başlığı, content gövde metnini, actions ise kullanıcı seçeneklerini (örneğin 'Tamam', 'İptal') barındırır.
AlertDialog(
title: Text('Silinsin mi?'),
content: Text('Bu işlem geri alınamaz.'),
actions: [
TextButton(child: Text('İptal'), onPressed: () {}),
TextButton(child: Text('Sil'), onPressed: () {}),
],
)AlertDialog genellikle showDialog'ın builder'ı içinde döndürülür.
title ve content
AlertDialog'ın title parametresi başlık widget'ını, content parametresi ise gövde widget'ını alır. Her ikisi de genellikle bir Text olur ama başka widget'lar da kullanılabilir. content tek widget alır; birden fazla öğe göstermek için Column gibi bir sarmalayıcı kullanırsın.
AlertDialog(
title: const Text('Bilgi'),
content: const Column(
mainAxisSize: MainAxisSize.min,
children: [Text('Satır 1'), Text('Satır 2')],
),
)Uygulama AlertDialog kur
PencereButon 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?'), actions içinde bir TextButton bulunsun ve yazısı 'Tamam' olsun. main içinde 'hazir' yazdır.
Başlangıç kodu
import 'package:flutter/material.dart';
// PencereButon StatelessWidget tanımla
// build ElevatedButton döndürsün
// onPressed showDialog çağırsın
// AlertDialog title ve actions içersin
void main() {
// 'hazir' yazdır
}Örnek çözüm
import 'package:flutter/material.dart';
class PencereButon extends StatelessWidget {
const PencereButon({super.key});
@override
Widget build(BuildContext context) {
return ElevatedButton(
onPressed: () {
showDialog(
context: context,
builder: (_) => AlertDialog(
title: const Text('Silinsin mi?'),
actions: [
TextButton(
onPressed: () {},
child: const Text('Tamam'),
),
],
),
);
},
child: const Text('Aç'),
);
}
}
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 AlertDialog'ın hangi parametresi butonları barındırır?
- padding
- title
- actions Doğru cevap
- content
Açıklama: actions bir Widget listesi alır; burada TextButton gibi butonlar gösterilir. title başlık, content gövde, padding iç boşluktur; butonları içermez.
2 actions parametresi
AlertDialog(
title: Text('Sil'),
____: [
TextButton(child: Text('Tamam'), onPressed: () {}),
],
)AlertDialog(
title: Text('Sil'),
actions: [
TextButton(child: Text('Tamam'), onPressed: () {}),
],
)Açıklama: AlertDialog'ın butonları actions parametresiyle verilir. buttons, options ve items AlertDialog'un parametre adları değildir.
3 AlertDialog parçaları
| Kavram | Anlamı |
|---|---|
title |
başlık widget'ı |
content |
gövde widget'ı |
actions |
buton listesi |
TextButton |
yaygın aksiyon butonu |