StreamBuilder nedir?
- Flutter kursu
- Orta seviye
- Ders 26/99
- 4 dk
StreamBuilder ile sürekli veri akışını arayüze bağlamayı öğrenirsin.
StreamBuilder nedir?
StreamBuilder, bir Stream'i arayüze bağlayan widget'tır. stream parametresi izlenecek Stream'i, builder ise her yeni değerde çağrılan fonksiyonu alır.
StreamBuilder<String>(
stream: veriAkisi(),
builder: (context, snapshot) {
return Text(snapshot.data ?? 'boş');
},
)Stream'den her yeni değer geldiğinde builder yeniden çağrılır.
snapshot ile veriye erişim
builder fonksiyonu bir AsyncSnapshot alır. Stream'den gelen her yeni değerde snapshot.data güncellenir ve builder yeniden çağrılır.
builder: (context, snapshot) {
return Text(snapshot.data ?? 'boş');
}Stream kapanana kadar her değer için build yenilenir.
Uygulama StreamBuilder ile veri göster
veriAkisi async* metodu 'Merhaba Stream' değerini yield etsin. Ekrani stateless widget'ında StreamBuilder<String> ile snapshot.data ?? '0' değerini göster. main'de print('ekran açıldı') çağır.
Başlangıç kodu
import 'package:flutter/material.dart';
Stream<String> veriAkisi() async* {
yield 'Merhaba Stream';
}
void main() {
print('ekran açıldı');
runApp(MaterialApp(home: Ekrani()));
}
class Ekrani extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
// akış dinleyici widget ekle
child: Text('bekle'),
),
);
}
}Örnek çözüm
import 'package:flutter/material.dart';
Stream<String> veriAkisi() async* {
yield 'Merhaba Stream';
}
void main() {
print('ekran açıldı');
runApp(MaterialApp(home: Ekrani()));
}
class Ekrani extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: StreamBuilder<String>(
stream: veriAkisi(),
builder: (context, snapshot) {
return Text(snapshot.data ?? '0');
},
),
),
);
}
}Beklenen çıktı
ekran açıldı
Soru ve cevaplar
Dersin sorularını cevaplarıyla birlikte inceleyebilirsin. Kendini denemek istersen dersi interaktif olarak çöz.
1 StreamBuilder hangi parametreyle izlenecek Stream'i alır?
- stream Doğru cevap
- child
- future
- builder
Açıklama: StreamBuilder'ın stream parametresi izlenecek Stream'i alır; builder ise her yeni değerde widget üretir.
2 StreamBuilder'ın stream parametresini bağla
StreamBuilder<String>(
____: sayacStream,
builder: (context, snapshot) {
return Text(snapshot.data ?? '0');
},
)
StreamBuilder<String>(
stream: sayacStream,
builder: (context, snapshot) {
return Text(snapshot.data ?? '0');
},
)
Açıklama: StreamBuilder'ın stream parametresi izlenecek Stream'i alır; builder ise her yeni değerde widget üretir.
3 StreamBuilder parçaları
| Kavram | Anlamı |
|---|---|
StreamBuilder |
Stream'i arayüze bağlayan widget |
stream |
İzlenecek Stream'i alan parametre |
builder |
Her değerde widget üreten fonksiyon |
snapshot |
Stream'in o anki durumunu taşıyan nesne |