Navigator nedir?
- Flutter kursu
- Başlangıç
- Ders 86/99
- 4 dk
Navigator ile ekran yığınını yönetmeyi öğrenirsin.
Navigator nedir?
Navigator, Flutter'da ekran yığınını (stack) yöneten sınıftır. Her ekran bir route olarak temsil edilir ve yığına eklenir. Navigator.push ile yeni ekran eklenir, Navigator.pop ile üstteki ekran çıkarılır. En üstteki route, kullanıcıya görünür olan güncel ekrandır.
Navigator.push(context, route);
Navigator.pop(context);Stack ve route kavramları
Navigator'ın yığı LIFO (son giren ilk çıkar) prensibiyle çalışır. En son eklenen route en üsttedir ve kullanıcıya görünür. Navigator.pop çağrıldığında en üstteki route çıkarılır ve bir alttaki ekran tekrar görünür hale gelir. Yeni açılan ekran her zaman yığın tepesine konur.
Uygulama Navigator.push çağrısı ekle
baslat adında bir fonksiyon yaz; çağrılınca Navigator hazir yazdırsın. main içinde baslat'ı çağır. Bir ElevatedButton ekle ve onPressed'ında Navigator.push çağrısı yapsın.
Başlangıç kodu
import 'package:flutter/material.dart';
// baslat fonksiyonu yaz: "Navigator hazir" yazdirsin
void main() {
// baslat'i cagir
runApp(const Uygulama());
}
class Uygulama extends StatelessWidget {
const Uygulama({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: Center(
// ElevatedButton ekle
child: SizedBox(),
),
),
);
}
}Örnek çözüm
import 'package:flutter/material.dart';
void baslat() {
print('Navigator hazir');
}
void main() {
baslat();
runApp(const Uygulama());
}
class Uygulama extends StatelessWidget {
const Uygulama({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: Center(
child: ElevatedButton(
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(builder: (_) => Scaffold()),
);
},
child: Text('Ac'),
),
),
),
);
}
}Beklenen çıktı
Navigator hazir
Soru ve cevaplar
Dersin sorularını cevaplarıyla birlikte inceleyebilirsin. Kendini denemek istersen dersi interaktif olarak çöz.
1 Navigator neyi yönetir?
- Ekran yığınını (stack) yönetir Doğru cevap
- Yalnızca renkleri yönetir
- Yalnızca metinleri yönetir
- Yalnızca ikonları yönetir
Açıklama: Navigator, ekranların yığın şeklinde tutulduğu rotaları yönetir; renk, metin veya ikon yönetimi ile ilgili değildir.
2 Navigator sınıfını ekle
// Yeni ekran aç
____.push(context, route);// Yeni ekran aç
Navigator.push(context, route);Açıklama: Ekran yığınını yöneten sınıfın adı Navigator'dır; Scaffold, MaterialApp ve Container bu amaca yönelik değildir.
3 Navigator bileşenleri
| Kavram | Anlamı |
|---|---|
Navigator |
Ekran yığınını yönetir |
stack |
Ekranların sıralı dizisi |
route |
Bir ekranı temsil eder |
push |
Yeni ekran ekler |