Thuta Learning
ရှာဖွေရန်
AdvancedMobile Developmentbeginner

Basic Navigation

စိတ်လျှော့ပါ။ ဒီခန်းကို စာအုပ်လိုမဟုတ်ဘဲ စကားပြောသလိုပဲ၊ နားလည်လွယ်အောင် ရှင်းပါမယ်။

Mobile app တစ်ခုမှာ screen တစ်ခုတည်းနဲ့မပြီးပါ။ Home, Detail, Profile, Settings စတဲ့ page တွေကြားသွားလာရပါတယ်။ Flutter မှာ Navigator ကိုသုံးပြီး screen stack ကိုစီမံပါတယ်။ push က screen အသစ်တင်တာ၊ pop က လက်ရှိ screen ကိုဖယ်ပြီးနောက်ပြန်တာပါ။

dart
// First screen မှာ
ElevatedButton(
  child: const Text('Go to Details'),
  onPressed: () {
    Navigator.push(
      context,
      MaterialPageRoute(
        builder: (context) => const DetailScreen(),
      ),
    );
  },
)

// Detail screen မှာ
ElevatedButton(
  child: const Text('Go Back'),
  onPressed: () {
    Navigator.pop(context);
  },
)
You should see
Go to Details နှိပ်ရင် DetailScreen သို့သွားပြီး Go Back နှိပ်ရင် Home screen သို့ပြန်လာပါမယ်။

နောက်တစ်ဆင့်

Page များလာရင် route name နဲ့စီမံဖို့ Named Routes ကိုဆက်သင်ပါ။

ဒီနေရာမှာ လူအများမှားတတ်တယ်

  • Navigator.push() ကို MaterialApp မရှိတဲ့ context မှာခေါ်ရင် route ဆိုင်ရာ error ဖြစ်နိုင်ပါတယ်။ App root မှာ MaterialApp ထားပါ။
Basic Navigation | Thuta Learning