إدارة الحالة والملاحة باستخدام Navigator Flutter

في Flutter ، Navigator هي أداة قوية لإدارة الحالة المركزية والتنقل في الصفحة في تطبيقك. يسمح لك بإنشاء تطبيقات بهندسة واضحة والتنقل السهل بين الشاشات.

تعريف Routes

لبدء الاستخدام Navigator ، عليك أن تحدد routes في تطبيقك. Routes هي شاشات فردية يمكن للمستخدمين الانتقال إليها. يمكنك تحديد routes استخدام MaterialApp وتقديم مجموعة من routes ، حيث route يتم تعيين كل منها إلى ملف Widget.

مثال:

MaterialApp(  
  initialRoute: '/',  
  routes: {  
    '/':(context) => HomePage(),  
    '/second':(context) => SecondPage(),  
  },  
)  

في المثال أعلاه ، حددنا اثنين routes: '/'(home page) و '/second'(second page). يمكنك إضافة أكبر عدد routes ممكن.

التنقل بين الصفحات

للتنقل بين الصفحات ، يمكنك استخدام Navigator طرق. إحدى الطرق الشائعة هي pushNamed ، والتي تسمح لك بالانتقال إلى صفحة أخرى من خلال توفير اسم ذلك route.

مثال:

// Navigate to the second page
Navigator.pushNamed(context, '/second');

بالإضافة إلى ذلك ، يمكنك استخدام طريقة الدفع للتنقل إلى طريقة أخرى route والتبديل بين الصفحات.

تمرير البيانات بين الصفحات

يمكنك تمرير البيانات بين الصفحات باستخدام طريقة pushNamed مع معلمة arguments.

مثال:

Navigator.pushNamed(  
  context,  
  '/second',  
  arguments: 'Data from the home page',  
);  

بعد ذلك ، يمكنك الوصول إلى البيانات من الصفحة الثانية باستخدام ModalRoute.of وكائنات الإعدادات:

class SecondPage extends StatelessWidget {  
  @override  
  Widget build(BuildContext context) {  
    String data = ModalRoute.of(context).settings.arguments;  
    // Use the data here  
  }  
}  

العودة إلى الصفحة السابقة

للرجوع إلى الصفحة السابقة ، يمكنك استخدام طريقة البوب Navigator. سيؤدي هذا إلى إغلاق الصفحة الحالية والعودة إلى الصفحة السابقة في المكدس.

مثال:

// Go back to the previous page
Navigator.pop(context);

 

خاتمة

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