AutomaticKeepAliveClientMixin - حل لمشكلة إعادة تحميل البيانات في Flutter

AutomaticKeepAliveClientMixin - حل لمشكلة إعادة تحميل البيانات في Flutter

أودّ مشاركة حلّ رائع لمشكلة إعادة تحميل بيانات المستخدم في شاشة ملف التعريف (profile screen) باستخدام Firebase.

المشكلة:

عند التنقل بين الشاشات باستخدام PageView مع BottomNavigationBar، يتمّ تدمير حالة (state) شاشة ملف التعريف، مما يتسبب في إعادة تحميل بيانات المستخدم من Firebase في كل مرة يتمّ فيها عرض الشاشة.

الحل:

يأتي الحلّ من خلال استخدام AutomaticKeepAliveClientMixin، وهو مزيج (mixin) مفيد يُتيح لنا الحفاظ على حالة شاشة معينة قيد التشغيل حتى لو تمّ إغلاقها أو إزالتها من شجرة واجهة المستخدم (UI tree).

خطوات الاستخدام:

إضافة المزيج:

أضف AutomaticKeepAliveClientMixin إلى شاشة ملف التعريف (profile screen) الخاصة بك.

تعديل wantKeepAlive

قمّ بتعديل wantKeepAlive ليكون true.

استدعاء super.build

في طريقة build، استدعِ super.build(context) بعد بناء الويدجت (widget) للحفاظ على الحالة بشكل صحيح.

ملاحظات هامة:

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

الحفاظ على البيانات: تُساعد هذه الطريقة على تحسين تجربة المستخدم من خلال عرض البيانات المُخزّنة دون الحاجة إلى إعادة تحميلها في كل مرة.

فوائد استخدام AutomaticKeepAliveClientMixin:

تحسين تجربة المستخدم: عرض البيانات بسرعة دون تأخير.

تقليل استهلاك البيانات: تجنّب إعادة تحميل البيانات من Firebase بشكل متكرر.

تحسين أداء التطبيق: تقليل استهلاك الموارد من خلال الحفاظ على حالة الشاشة قيد التشغيل.

مثال على ذلك

class ProfileScreen extends StatefulWidget {
  @override
  _ProfileScreenState createState() => _ProfileScreenState();
}

class _ProfileScreenState extends State<ProfileScreen> with AutomaticKeepAliveClientMixin<ProfileScreen> {
  @override
  bool get wantKeepAlive => true;

  @override
  Widget build(BuildContext context) {
    super.build(context);
    // ... build your profile screen here
  }
}