كما تعلمنا سابقاً أن ساعي البريد وظيفته ارسالة واستقبال الطلبات والرسائل بين الواجهة الأمامية والخلفية , أو كما تدعى كذلك بقسم الواجهة وقسم الخادم.

هذه الرسائل لها صيغٌ عدّة أشهرها وأكثرها استخداماً هي صيغة JSON , وهي أشبه ما تكون بالخارطة Map وذلك أن لكل عنصرٍ منها مفتاحٌ يوصل إلى قيمتها.

ولكن ..
إذا أخذنا هذه العناصر وأردنا الوصول لها من داخل تطبيقنا سنواجه مشكلة, كيف سنصل للعناصر التي تكون داخل عناصر ؟

لنضرب مثالاً حتى يتضح ما نقصد.

لنفترض أن لديك عنصراً يدعى الإسم , ثم بداخل الاسم هناك عنصران , الاسم الأول والثاني. على المثال التالي:

لنفترض الآن انك تريد الوصول للاسم الثاني فأنت مضطرٌ لكتابة السطر هذا كاملاً:

تخيل الآن لو كان لديك عنصر داخل العنصر الثاني ! , ستجد أن الوصول للبيانات يصعب أكثر فأكثر , لذلك نستخدم النماذج Models.

النماذج : وهي عبارة عن كلاسٍ عادي يأخي البيانات القادمة من ساعي البريد ويقوم بتخزينها في داخله بشكل أسهل للوصول.

لنعد خطوتين قليلاً..

لو تتذكر في درس طبقة الشبكة قلنا بأنك تحتاج لتجربة ساعي البريد أولاً على برامجٍ مثل postman للاطلاع على المخرجات المتوقعة من ساعي البريد.

حسناً , اطلعت على المخرجات وأنواعها , ماذا تفعل بعد ذلك؟
بإمكانك كتابة النموذج يدوياً أو الاستعانة بأدواتٍ تؤتمت هذه العملية , شخصياً استخدم هذا الموقع “اضغط هنا للوصول إليه” , وسأشرح كيفية استخدامه.

1- انسخ المخرجات من postman ثم الصقها في الموقع

2- اعطي اسماً للنموذج

3- اضغط على زر Generate Dart ومبارك أصبح النموذج جاهزاً للاستخدام!

يفضّل أن تراجع النموذج والخواص التي بداخلها بعد أخذها من الموقع , أحياناً تكون بعض القيم فارغة فلا يتعرف الموقع على نوعها.

الآن عد إلى المشروع ثم اتجه إلى 

features —> home —> models

انشئ ملفاً باسم post_model.dart

الصق بداخله النموذج.

بامكانك أن تلحظ أن النموذج عبارة عن كلاسٍ عادي وفيه دالتان.

الأولى fromJson وهذه التي تعنى بترجمة البيانات القادمة من الخادم واسناد القيم التي بداخلها الى القيم التي بداخل الكلاس.

والأخرى toJson وهذه تستخدم لتحويل البيانات الموجودة في النموذج إلى رسالة json مرة أخرى لارسالها إلى الخادم.

الأمر لا يبعد عن أن يكون عمل ساعي البريد.

بعد أن جهزنا النموذج لاستقبال البيانات القادمة من ساعي البريد , نحتاج الآن أن نجهّز الحالة التي تخزّن المتغيرات وتحدثها , ومن ثمّ نحتاج أن نجهّز المتحكم الذي سيضيف هذه البيانات.

نتجّه أولاً الى

features —> home —> domain

ثم ننشئ ملفاً باسم state.dart

ننشئ كلاساً عادياً وسيكون فيه 4 خطوات لتعريف أي متغيرٍ جديدٍ في الحالة state.

الخطوة الأولى والثانية وهي خطواتٌ بسيطة فقط لتعريف الحالة وما تحوي من متغيرات.

الخطوة الثالثة وهي لتحديد قيمٍ افتراضية بينما تأتي البيانات من ساعي البريد , ونعرف في فلَتر أن القيم العدمية null غير مرغوبٍ بها بتاتاً , لذلك نعرّف داخل هذه الخطوة نماذج وهمية Dummy Models , والتي بدورها تعنى باظهارٍ قيمٍ افتراضية فارغة بينما تأتي القيم الحقيقية.

الخطوة الرابعة وهي دالةٌ تعنى بتحديث الحالة , بامكانك معرفة طريقة عملها من النظرة الاولى وهي أنها تأخذ مدخلاتٍ قد تكون غير موجودة , فإن كان هناك مدخلٌ موجود تستبدله بالحالي وتحدث الحالة.

بعد أن وضعنا الحالة نحتاج الآن أن نضع متحكماً ومزوداً , في نفس المجلد ننشئ ملفاً باسم controller.dart ونضع فيه أولاً متحكماً من نوع state notifire وهو كلاسٌ مخصص داخل ريفربود بإمكانك الإطلاع عليه من خلال وثائقها, كما أننا سنشرح لاحقاً طريقة عمله المفصّلة في مقال آخر.

أما عن طريقة تعريفه فهي ببساطة: 

بعد أن أصبح لديناً متحكمٌ جاهز أصبحنا جاهزين لاستخدامه مع الحالة , هنا نحتاجُ إلى استخدام مزوّد Provider لتزويد المتحكم والحالة إلى الصفحات المستهلكة المنشأة مسبقاً.

لفعل ذلك سنعرف مزوداً من نوع StateNotifierProvider والذي سيأخذ متحكماً وحالةً ونعطيه اسماً وهو homeProivder على الشكل التالي: