StreamBuilder

عرض تدفّق بيانات مستمر StreamBuilder

StreamBuilder مثل FutureBuilder لكن لتدفّق بيانات مستمر يصدر أكثر من قيمة بمرور الوقت — بيانات حيّة من Firestore أو WebSocket.

يعيد بناء الواجهة تلقائيًا كل مرة يصدر فيها الـ Stream قيمة جديدة، بلا حاجة لـ setState يدوي أو الاشتراك/إلغاء الاشتراك بنفسك.

الصياغة

StreamBuilder<T>(
  stream: Stream<T>,
  builder: (context, AsyncSnapshot<T> snapshot) => Widget,
)

📄 مثال

StreamBuilder<int>(
  stream: counterStream(),
  builder: (context, snapshot) {
    if (!snapshot.hasData) {
      return const CircularProgressIndicator();
    }
    return Text('العدّاد: ${snapshot.data}');
  },
)

أهم المعاملات

المعامل	الوظيفة
stream	تدفّق البيانات الذي تُبنى الواجهة حسب آخر قيمة صادرة منه
builder	دالة تُستدعى تلقائيًا بكل قيمة جديدة يصدرها الـ Stream
initialData	قيمة تُعرض قبل وصول أول قيمة فعلية من الـ Stream (اختياري)

💡 نصائح عملية

استخدمه مع Streams من Firestore (snapshots()) لعرض بيانات تتحدّث لحظيًا بلا أي كود إضافي لإعادة الجلب

⚠️ أخطاء شائعة

إضافة StreamSubscription يدوي فوقه — StreamBuilder يتولّى الاشتراك وإلغاءه تلقائيًا بنفسه، الازدواجية تكرار غير ضروري وقد يسبب تسريبًا

خصائص ذات صلة

FutureBuilder عرض نتيجة Future تلقائيًا

🎓 تريد فهم الصورة الكاملة خطوة بخطوة؟ ابدأ من مسار FLUTTER الكامل بالعربي.