Flutter Navigator - Complete Guide (All Common Methods)

Flutter-এ এক Screen থেকে অন্য Screen-এ যাওয়া, Back আসা, Route Replace করা ইত্যাদির জন্য Navigator ব্যবহার করা হয়।

---

🔹 Navigator.push()

নতুন Screen Open করবে।

Navigator.push(

  context,

  MaterialPageRoute(

    builder: (context) {

      return SecondPage();
    },
  ),
);

Short Form

Navigator.push(
  context,
  MaterialPageRoute(
    builder: (_) => SecondPage(),
  ),
);

---

🔹 Navigator.pop()

বর্তমান Screen Close করবে।

Navigator.pop(context);

---

🔹 Data Return Using pop()

Navigator.pop(
  context,
  "Success",
);

---

🔹 Receive Returned Data

final result =
    await Navigator.push(

  context,

  MaterialPageRoute(
    builder: (_) => SecondPage(),
  ),
);

print(result);

---

🔹 Navigator.pushReplacement()

বর্তমান Screen Remove করে নতুন Screen Open করবে।

Navigator.pushReplacement(

  context,

  MaterialPageRoute(

    builder: (_) {

      return HomePage();
    },
  ),
);

Use Case

Login Page
     ↓
Home Page

Back করলে Login এ যাবে না

---

🔹 Navigator.pushAndRemoveUntil()

সব Previous Screen Remove করবে।

Navigator.pushAndRemoveUntil(

  context,

  MaterialPageRoute(
    builder: (_) => HomePage(),
  ),

  (route) => false,
);

Use Case

Splash
 ↓
Login
 ↓
Home

সব Route Remove
শুধু Home থাকবে

---

🔹 Navigator.popUntil()

নির্দিষ্ট Route পর্যন্ত Back যাবে।

Navigator.popUntil(

  context,

  ModalRoute.withName(
    "/home",
  ),
);

---

🔹 Navigator.canPop()

Back যাওয়া সম্ভব কিনা।

if (
  Navigator.canPop(context)
) {

  Navigator.pop(context);
}

---

🔹 Navigator.maybePop()

Back সম্ভব হলে Pop করবে।

Navigator.maybePop(
  context,
);

---

🔹 Named Routes

Route Define

MaterialApp(

  routes: {

    "/home": (context) {

      return HomePage();
    },

    "/profile": (context) {

      return ProfilePage();
    },
  },
)

---

Navigate

Navigator.pushNamed(

  context,

  "/profile",
);

---

Replace Route

Navigator.pushReplacementNamed(

  context,

  "/home",
);

---

Remove All Routes

Navigator.pushNamedAndRemoveUntil(

  context,

  "/home",

  (route) => false,
);

---

🔹 Send Data

Navigator.push(

  context,

  MaterialPageRoute(

    builder: (_) {

      return ProfilePage(

        name: "Shakil",
      );
    },
  ),
);

---

🔹 Receive Data

class ProfilePage
    extends StatelessWidget {

  final String name;

  const ProfilePage({

    super.key,

    required this.name,
  });

  @override
  Widget build(
      BuildContext context) {

    return Scaffold(

      body: Center(

        child: Text(name),
      ),
    );
  }
}

---

🔹 Pass Arguments (Named Route)

Send

Navigator.pushNamed(

  context,

  "/profile",

  arguments: "Shakil",
);

---

Receive

final name =
    ModalRoute.of(context)!
        .settings
        .arguments as String;

---

🔹 Custom Page Transition

Navigator.push(

  context,

  PageRouteBuilder(

    pageBuilder: (

      context,

      animation,

      secondaryAnimation,

    ) {

      return SecondPage();
    },

    transitionsBuilder: (

      context,

      animation,

      secondaryAnimation,

      child,

    ) {

      return FadeTransition(

        opacity: animation,

        child: child,
      );
    },
  ),
);

---

🔹 Fade Transition

FadeTransition(
  opacity: animation,
  child: child,
)

---

🔹 Scale Transition

ScaleTransition(
  scale: animation,
  child: child,
)

---

🔹 Rotation Transition

RotationTransition(
  turns: animation,
  child: child,
)

---

🔹 Slide Transition

SlideTransition(

  position: Tween<Offset>(

    begin: Offset(1, 0),

    end: Offset.zero,

  ).animate(animation),

  child: child,
)

---

🔹 Navigation Drawer Example

ListTile(

  title: Text("Profile"),

  onTap: () {

    Navigator.push(

      context,

      MaterialPageRoute(

        builder: (_) {

          return ProfilePage();
        },
      ),
    );
  },
)

---

📌 Navigator Summary

Method	কাজ
push()	New Screen Open
pop()	Back
pushReplacement()	Replace Current Screen
pushAndRemoveUntil()	Remove All Previous Screens
popUntil()	Specific Screen পর্যন্ত Back
canPop()	Back সম্ভব কিনা
maybePop()	Safe Back
pushNamed()	Named Route Open
pushReplacementNamed()	Replace Named Route
pushNamedAndRemoveUntil()	Remove All Named Routes

---

📌 Most Used Navigator Methods

Navigator.push()

Navigator.pop()

Navigator.pushReplacement()

Navigator.pushAndRemoveUntil()

Navigator.pushNamed()

Navigator.pushNamedAndRemoveUntil()

---

📌 Navigation Flow

Splash Screen
      ↓
Login Screen
      ↓
Home Screen
      ↓
Profile Screen
      ↓
Settings Screen

Back Flow

Settings
   ↑
Profile
   ↑
Home
   ↑
Login

Flutter অ্যাপে push(), pop(), pushReplacement() এবং pushAndRemoveUntil() জানলেই Navigation-এর ৯৫% কাজ করা যায়।