هل واجهت يوماً مشاكلاً في تحديث واجهة التطبيق عند تغيّر البيانات؟
كيف يمكنك جعل تطبيقك يتفاعل بسلاسة مع كل حدث، دون أن يتأثر الأداء؟
في هذا المقال، سنتكلم عن إدارة الحالة (State Management) في Flutter، الأداة التي تمنح المطوّرين القدرة على التحكم الكامل في البيانات وتحديث الواجهة تلقائياً، كما تساعد على كتابة كود نظيف وسهل الصيانة، بكل سهولة واحترافية.

حيث تم تقديم محتوى هذا المقال ضمن جلسة من فعاليات Mobile Dev Meetups، التي استضافها مركز “سند – دمشق” بتاريخ 20 أيلول 2025، وقد ألقتها المهندسة لولوة الحلبي، تناولت كيف تجعل إدارة الحالة لتطبيقات Flutter أكثر سلاسة ومرونة.

الفهرس:

1. ما هي الحالة (State) ولماذا نحتاج إلى إدارتها في Flutter؟
2. هل تُدار جميع الحالات بنفس الطريقة؟ أم أن لكل نوع طريقته الخاصة؟
3. ما هي أنواع State Management في Flutter وما مزايا كل منها؟
4. كيف تختار الطريقة الأنسب لإدارة الحالة بكفاءة في تطبيقك؟

محاور الجلسة:

أولاً: ما هي الحالة (State) ولماذا نحتاج إلى إدارتها في Flutter؟

تُعبّر الحالة (State) عن البيانات التي يمكن أن تتغير أثناء استخدام التطبيق وتؤثر مباشرة على ما يُعرض على الشاشة كقيمة عدّاد، أو حالة زر مفعّل/غير مفعّل، أو قائمة مشتريات تتحدّث باستمرار.
لكن مع ازدياد تعقيد التطبيق وتعدّد الشاشات، يصبح من الصعب التحكم بهذه التغيّرات يدوياً ومزامنتها مع الواجهة.
وهنا تظهر أهمية إدارة الحالة (State Management)، التي تتيح للمطور:

• تحديث واجهة المستخدم تلقائياً عند تغيّر البيانات.
• فصل منطق العمل عن واجهة العرض للحفاظ على تنظيم الكود وسهولة صيانته.
• تقليل عمليات إعادة البناء غير الضرورية لتحسين الأداء.
• مشاركة البيانات بسهولة بين مختلف أجزاء التطبيق.

ثانياً: هل تُدار جميع الحالات بنفس الطريقة؟ أم أن لكل نوع طريقته الخاصة؟

تختلف طرق إدارة الحالة في Flutter باختلاف طبيعة البيانات ونطاق تأثيرها داخل التطبيق، فليست كل التغيّرات تُعالج بالطريقة ذاتها، حيث يمكن تصنيف الحالات إلى ثلاث فئات رئيسية:

• الحالة المحلية (Local State): ترتبط بويدجت واحد فقط، مثل إدخال نص أو تبديل زر.
  الأدوات المناسبة : setState – ValueNotifier + ValueListenableBuilder
• الحالة المشتركة (Shared State): تُستخدم لمشاركة البيانات بين أكثر من صفحة أو ويدجيت.
  الأدوات المناسبة : Provider + ChangeNotifier – InheritedWidget
• الحالة البعيدة (Remote State): تمثل بيانات تُجلب من الإنترنت أو من ذاكرة مؤقتة.
  الأدوات المناسبة :Streams + StreamBuilder –FutureProvider/StreamProvider

لكن ماذا يحدث عندما يتعقّد التطبيق، ويصبح منطق العمل متشابكاً ويحتاج إلى اختبار دقيق؟
هل تبقى الأدوات السابقة كافية؟

مع توسع التطبيق وازدياد تعقيده، تظهر محدودية استخدام هذه الأدوات في تلبية متطلبات إدارة الحالة المتقدمة.
هنا تبرز الحاجة لحلول أكثر متانة، كاستخدام مكاتب متقدمة مثل Riverpod وBLoC وGetX..

ثالثاً: ما هي أنواع State Management في Flutter وما مزايا كل منها ؟

توفر Flutter عدة أدوات ومكتبات لإدارة الحالة، تختلف في القوة والتعقيد حسب متطلبات كل مشروع، حيث تتيح إطار عمل متكامل يحافظ على تناسق البيانات، وسهولة تتبعها، مما يجعل الاختبار والصيانة أكثر سهولة.
ومن أبرز هذه المكاتب:

النوع الاول Riverpod:
مكتبة قوية لإدارة الحالة، محسّنة من Provider يسمح بتعريف Providers من أي مكان في المشروع دون ربطهم بشجرة الودجت.

• مزاياه:

1. أمان أعلى: اكتشاف الأخطاء في وقت مبكر بفضل riverpod_generator وriverpod_lint.
2. تشغيل في أي مكان: يمكن استخدامه في CLI أو خوادم أو isolates.
3. اعتماد متبادل بين الحالات: يمكن لأي موفّر (Provider) أن يعتمد على (Providers) آخرين، بحيث إذا تغيّر أحدهم، يُعاد تحديث الحالة تلقائياً في الموفّر الذي يعتمد عليه.
4. التسجيل والمراقبة: متابعة جميع التحديثات والأخطاء عبر ProviderObser.
5. توثيق تلقائي:باستخدام أدوات مثل riverpod_graph وriver_cli.

• مثال:
  يوضح هذا المثال تطبيق عداد بسيط يعرض رقماً على الشاشة باستخدام Riverpod:
  حيث أن الحالة مُدارة خارج واجهة المستخدم و التحديثات تلقائية عند تغيير القيمة.

counterProvider : يُنشئ مكاناً لتخزين قيمة العداد.
ref.watch(counterProvider) : يعرض قيمة العداد ويتابع أي تغييرات عليها.
ref.read(counterProvider.notifier).state++ : يزيد قيمة العداد عند الضغط على الزر.

النوع الثاني Provider :
يسمح بتمرير القيم عبر شجرة الويدجت دون الحاجة لتمريرها يدوياً.

• أنواعه:

النوع الثالث Bloc :
هو نمط معماري يفصل منطق العمل عن واجهة المستخدم، حيث تستقبل الواجهة أحداث (Events)، يقوم الـ BLoC بمعالجتها، ويصدر حالات (States) لتحديث الواجهة.
يوفّر BLoC كوداً منظّماً وسهل الصيانة والاختبار، ويبسّط التعامل مع حالات التحميل والنجاح والفشل.

• أدواته:

1. BlocBuilder: يبني الواجهة بناءً على الحالة الحالية للـ Bloc، ويُعاد البناء تلقائياً عند تغيّر الحالة، ويمكن التحكم بعملية إعادة البناء باستخدام خاصية buildWhen.
2. BlocSelector: يسمح باختيار قيمة محددة من الحالة الحالية للـ Bloc لتحديد ما إذا كان يجب إعادة بناء الودجت. يقلّل من إعادة البناء غير الضرورية.
3. BlocProvider: أداة أساسية توفر الـ Bloc لأي جزء من التطبيق ضمن شجرة الودجتس، مع إمكانية استخدام BlocProvider.value، MultiBlocProvider،BlocListener لتسهيل التفاعل مع الـ Bloc في كل التطبيق.
   بالإضافة لذلك، هناك أدوات مثل listenWhen, MultiBlocListener, BlocConsumer RepositoryProvider.

النوع الرابع cubit :
هو نسخة مبسّطة من BLoC، يعمل بدون Events، حيث يتم تغيير الحالة مباشرة عبر توابع داخل الكلاس.
يعتبر اختياراً ممتاز عندما تحتاج مرونة ال BLoC لكن بدون تعقيده الكامل.¹مناسب للتطبيقات المتوسطة أو الأقسام البسيطة من التطبيقات الكبيرة.

• مزاياه :

1. أبسط من BLoC وأكثر وضوحاً.
2. لا يحتاج إلى تعريف Events.
3. فصل واضح بين الواجهة والمنطق.

النوع الخامس Getx:
تُعد GetX أداة خفيفة وسريعة توحّد إدارة الحالة والتنقّل وحقن التبعية في نظام واحد، وتُعد خياراً رائعاً لتطبيقات تحتاج إلى تطوير سريع وواجهة سلسة.

• يوفر طريقتين رئيسيتين لإدارة الحالة:

• حقن التبعية (Dependency Injection): يتيح GetX إدارة الكائنات داخل التطبيق بسهولة من خلال Get.put(), Get.lazyPut(), Get.putAsync(), Get.find<T>().
• التوجيه والتنقل (Routing/Navigation):Get.to(), Get.off(), Get.offAll(),
• وودجتس جاهزة مثل : Get.snackbar, Get.dialog, Get.bottomSheet

رابعاً: كيف تختار الطريقة الأنسب لإدارة الحالة بكفاءة في تطبيقك؟

تختلف طرق إدارة الحالة في Flutter من حيث التعقيد، الأداء، وسهولة الاستخدام، ويعتمد اختيار الأداة المناسبة على حجم المشروع وطبيعة البيانات وخبرة الفريق.
في التطبيقات الصغيرة تكفي الطرق البسيطة مثل setState،
أما في المشاريع المتوسطة فيُنصح باستخدام حلول منظّمة مثل Provider أو GetX لتحقيق توازن بين البساطة والكفاءة،
بينما تحتاج المشاريع الكبيرة أو المعقّدة إلى أدوات متقدّمة مثلcubit أو BLoC أو Riverpod لضمان المرونة والأداء العالي.

الخاتمة:

في عالم تتزايد فيه تعقيدات التطبيقات، تبرز أهمية اختيار أداة إدارة الحالة المناسبة كعامل حاسم في نجاح المشروع. فكما تختلف المشاريع في حجمها وتعقيدها، تختلف أيضاً أدوات إدارة الحالة في منهجيتها ومميزاتها.
ليس هناك حل واحد يناسب الجميع، بل كل مشروع له احتياجات خاصة. المهم أن تختار الأداة التي تناسب فريقك، وتلبي متطلبات مشروعك، وتضمن استمرارية التطوير.
فالقرار الصحيح في اختيار أداة إدارة الحالة يُترجم مباشرة إلى كفاءة أعلى، وكود أنظف، وتجربة مستخدم أفضل.

ألبوم الصور:

الجلسة الرابعة عشرة 20 أيلول 2025