Meydan okuma 3
- Flutter kursu
- İleri seviye
- Ders 68/69
- 3 dk
Firestore ile gerçek zamanlı sohbet ekranı yaparsın.
Meydan okuma 3 - Firestore sohbet
Bu meydan okumada Firestore koleksiyonundan mesajları snapshots() ile dinleyip StreamBuilder ile ekranda göstereceksin. Her mesaj eklenişinde stream yeni veri yayınlar.
StreamBuilder<QuerySnapshot>(
stream: FirebaseFirestore.instance
.collection('messages')
.snapshots(),
builder: (context, snapshot) {
if (!snapshot.hasData) return Text('yukleniyor');
return Text('${snapshot.data!.docs.length} mesaj');
},
)Uygulama StreamController ile ilk veri
main içinde List<String> tutan bir StreamController oluştur (streamCtrl). İçine üç elemanlı bir liste ekle. streamCtrl.stream.first ile ilk veriyi bekle ve length'ini yazdır. Sonra streamCtrl.close() çağır.
Başlangıç kodu
import 'dart:async';
void main() async {
// List<String> tutan bir StreamController oluştur (streamCtrl)
// içine üç elemanlı bir liste ekle
// stream'in ilk verisini bekle ve length'ini yazdır
}Örnek çözüm
import 'dart:async';
void main() async {
final streamCtrl = StreamController<List<String>>();
streamCtrl.add(['a', 'b', 'c']);
final data = await streamCtrl.stream.first;
print(data.length);
streamCtrl.close();
}Beklenen çıktı
3
Uygulama StreamBuilder widget'ı oluştur
main içinde List<String> tutan bir StreamController oluştur (streamCtrl). StreamBuilder<List<String>> widget'ı oluştur: stream olarak streamCtrl.stream ver, builder snapshot.hasData ise Text(snapshot.data!.length.toString()), değilse Text('yok') dönsün. Widget'ın runtimeType'ını print ile yazdır ve streamCtrl.close() çağır.
Başlangıç kodu
import 'dart:async';
import 'package:flutter/material.dart';
void main() {
// List<String> tutan bir StreamController oluştur (streamCtrl)
// StreamBuilder oluştur: stream olarak streamCtrl.stream ver
// builder snapshot hasData ise data length string, değilse 'yok'
// widget'ın runtimeType'ını yazdır
}Örnek çözüm
import 'dart:async';
import 'package:flutter/material.dart';
void main() {
final streamCtrl = StreamController<List<String>>();
final widget = StreamBuilder<List<String>>(
stream: streamCtrl.stream,
builder: (context, snapshot) {
if (snapshot.hasData) {
return Text(snapshot.data!.length.toString());
}
return const Text('yok');
},
);
print(widget.runtimeType);
streamCtrl.close();
}Beklenen çıktı
StreamBuilder<List<String>>
Soru ve cevaplar
Dersin sorularını cevaplarıyla birlikte inceleyebilirsin. Kendini denemek istersen dersi interaktif olarak çöz.
1 snapshots() metodu ne tür bir nesne döner?
- Stream<QuerySnapshot> Doğru cevap
- Future<QuerySnapshot>
- QuerySnapshot
- List<DocumentSnapshot>
Açıklama: snapshots() bir Stream<QuerySnapshot> döndürür; her veri değişiminde yeni snapshot yayınlanır.
2 StreamBuilder'a stream ver
StreamBuilder<QuerySnapshot>(
stream: FirebaseFirestore.instance
.collection('messages')
.____(),
builder: (context, snapshot) { ... },
)StreamBuilder<QuerySnapshot>(
stream: FirebaseFirestore.instance
.collection('messages')
.snapshots(),
builder: (context, snapshot) { ... },
)Açıklama: Koleksiyon üzerinde snapshots() çağrısı gerçek zamanlı Stream<QuerySnapshot> döndürür; get ise tek seferlik Future verir.
3 Firestore sohbet eşleşmeleri
| Kavram | Anlamı |
|---|---|
Firestore |
Veritabanı |
snapshots |
Gerçek zamanlı akış |
StreamBuilder |
Stream'i widget'a bağlar |
QuerySnapshot |
Sorgu sonucu |