مسیریابی و جا به جایی بین صفحات در Flutter

مسیریابی بخش ضروری در هر اپلیکیشنی میباشد.

در هر برنامه و اپلیکیشنی ما نیاز داریم که بتونیم بین صفحات جا به جا شویم و کاربر و به مکان های مختلف منتقل کنیم به دلیل اینکه هر برنامه از صفحات مختلف تشکیل شده که هرکدام اطلاعات متفاوتی و نمایش می دهند.

در Flutter به صفحات route میگوییم که در اندروید اکتیویتی نام دارد و در برنامه نویسی iOS هم ViewController

حالا برای اینکه بتوانیم مسیر خودمون و ایجاد کنیم و بین دو صفحه جا به جا شویم باید از کلاس Navigator استفاده کنیم. این کلاس وظیفه مسیریابی در اپلیکیشن را انجام میدهد.

این کلاس یک ساختمان داده پشته در اختیارمون قرار میده که صفحات برنامه و داخل خودش ذخیره میکنه با دستور push و برای برگشتن به صفحه قبلی هم از دستور pop استفاده خواهیم کرد.

برای این که بهتر متوجه بشید اجازه بدید با یک مثال جلو بریم.

در مثال زیر ما دوتا صفجه مختلف ایجاد کردیم با نام های FirstRoute و SecondRoute

 class FirstRoute extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('First Route'),
      ),
      body: Center(
        child: RaisedButton(
          child: Text('Open route'),
          onPressed: () {
            // Navigate to second route when tapped.
          },
        ),
      ),
    );
  }
}

class SecondRoute extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Second Route"),
      ),
      body: Center(
        child: RaisedButton(
          onPressed: () {
            // Navigate back to first route when tapped.
          },
          child: Text('Go back!'),
        ),
      ),
    );
  }
}

برای وارد شدن به یک صفجه جدید از دستور Navigator.push() استفاده می کنیم.

دستور پوش یک route را به پشته اضافه می کند.

onPressed: () {
  Navigator.push(
    context,
    MaterialPageRoute(builder: (context) => SecondRoute()),
  );
}

در دستور بالا با کلیک کردن روی دکمه در صفحه اول وارد صفحه دوم می شویم برای اینکار از MaterialPageRoute استفاده کردیم.

همین کد و برای دکمه صفحه دوم نیز میتونیم بنویسیم. اما چون مقدار صفحه اول ما در پشته ذخیره شده نیازی نیست که اینکار و کنیم و خیلی راحت مقدار صفحه اول و از پشته خارج میکنیم و به صفحه قبلی بازمیگردیم. این کار با استفاده از متد pop انجام میشود.

onPressed: () {
  Navigator.pop(context);
}

برای ارسال مقادیر مختلف از یک صفحه به صفحه دیگر کافیست ویجت فلاتر مورد نظر شامل پارامترهای موردنیاز در متد سازنده خود باشد که هنگام استفاده از آن در کلاس MaterialPageRoute پارامترهای مورد نیاز برای ارسال به صفحه جدید را نیز مشخص کنید.

نوع دیگری از مسیریابی در فریمورک فلاتر وجود دارد که به آن مسیریابی با نام میگوید که در اپلیکیشن هایی با تعداد صفحات زیاد کاربرد بسیار بهتری نسبت به این روش دارد. مزیت این روش سادگی آن می باشد.