Özet - Flutter iç yapı
- Flutter kursu
- Uzman seviye
- Ders 5/39
- 4 dk
Üç ağacı birleştirerek bir widget'ın yaşamını izlersin.
Özet - Flutter iç yapı
Bir widget oluşturulduğunda üç ağaç birlikte çalışır: widget_tree tanımı taşır, Element widget'ı render'a bağlar, RenderObject layout ve paint yapar. Widget rebuild edilince Element güncellenir, RenderObject yalnızca gerektiğinde yenilenir.
// Widget → Element → RenderObject
MaterialApp → _RawViewElement → RenderView
Scaffold → _ScaffoldElement → RenderFlex
Text → _TextElement → RenderParagraphUygulama Üç ağacı yazdır
main içinde üç ayrı print ile sırayla 'widget_tree', 'Element', 'RenderObject' yazdır.
Başlangıç kodu
void main() {
// 'widget_tree', 'Element', 'RenderObject' üç ayrı print ile yazdır
}Örnek çözüm
void main() {
print('widget_tree');
print('Element');
print('RenderObject');
}Beklenen çıktı
widget_tree Element RenderObject
Soru ve cevaplar
Dersin sorularını cevaplarıyla birlikte inceleyebilirsin. Kendini denemek istersen dersi interaktif olarak çöz.
1 Bir widget rebuild edilince ne olur?
- Tüm ağaçlar sıfırdan oluşturulur
- Sadece RenderObject güncellenir
- Element güncellenir, RenderObject yalnızca gerektiğinde yenilenir Doğru cevap
- Uygulama yeniden başlatılır
Açıklama: Widget rebuild edilince yeni widget nesnesi eski Element ile karşılaştırılır ve Element update edilir; RenderObject yalnızca layout veya paint değiştiğinde yenilenir.
2 Üç ağacın sırası
final trees = ['widget_tree', '____', 'RenderObject'];final trees = ['widget_tree', 'Element', 'RenderObject'];Açıklama: Yaşam döngüsü sırası widget_tree → Element → RenderObject'tir; BuildContext Element'in kendisidir, State ise StatefulWidget'a özeldir.
3 Üç ağaç eşleşmeleri
| Kavram | Anlamı |
|---|---|
widget_tree |
Widget tanımı taşır |
Element |
Widget ve render arasında |
RenderObject |
Layout/paint nesnesi |
rebuild |
State değişince tetiklenir |