Flutter में navigation कैसे काम करता है?

Question

Accepted Answer

Flutter में **navigation** screens (pages/routes) के बीच ले जाता है — मूल navigation के लिए **Navigator** (routes का एक stack) का उपयोग करते हुए, या अधिक जटिल apps के लिए declarative routing packages। navigation को समझना multi-screen apps बनाने के लिए आवश्यक है।

## Navigator के साथ मूल navigation (एक stack)

```dart
// the Navigator manages a STACK of routes (screens)
// PUSH a new screen onto the stack (navigate to it)
Navigator.push(
  context,
  MaterialPageRoute(builder: (context) => SecondScreen()),
);

// POP — go back (remove the top screen, return to the previous)
Navigator.pop(context);
```

```text
Think of navigation as a STACK of screens:
  → PUSH adds a screen on top (navigate forward)
  → POP removes the top screen (go back)
  → the back button / gesture also pops
```

## screens के बीच data पास करना

```dart
// pass data forward (via the constructor)
Navigator.push(context, MaterialPageRoute(
  builder: (context) => DetailScreen(itemId: 42),
));

// return data back when popping
Navigator.pop(context, result);          // return a result
final result = await Navigator.push(...); // receive it (push returns a Future)
```

## Named routes और आधुनिक routing

```dart
// NAMED routes — define routes by name (cleaner for many screens)
Navigator.pushNamed(context, '/details');
// configured in MaterialApp(routes: {...})

// MODERN: declarative routing packages (go_router) for complex apps:
//   → URL-based routing, deep linking, web support, nested navigation
//   → go_router is the recommended approach for non-trivial apps
```

## यह क्यों महत्वपूर्ण है

navigation को समझना आवश्यक है क्योंकि **अधिकांश apps में कई screens होते हैं**, और उनके बीच आना-जाना app कार्यक्षमता के लिए मूलभूत है, इसलिए यह जानना-जरूरी Flutter ज्ञान है।

मूल अवधारणा — Flutter का **Navigator routes (screens) के एक stack का प्रबंधन करता है**, जहां आप आगे navigate करने के लिए **push** करते हैं (ऊपर एक screen जोड़ना) और पीछे जाने के लिए **pop** करते हैं (शीर्ष screen को हटाना) — navigation के लिए मूलभूत मानसिक model है, और stack रूपक (यह कैसे मेल खाता है कि users किसी app में आगे और पीछे navigate करते हैं) इसे सहज बनाता है।

**मूल navigation** (push/pop) को समझना किसी भी multi-screen app के लिए आवश्यक है।

**screens के बीच data पास करना** (constructors के माध्यम से data आगे भेजना और pop करते समय results लौटाना, चूंकि push एक Future लौटाता है) को समझना आवश्यक है क्योंकि screens को आमतौर पर data साझा करने की आवश्यकता होती है (एक item को detail screen पर पास करना, एक selection लौटाना)।

**named routes** (कई screens के साथ स्वच्छ संगठन के लिए नाम से routes परिभाषित करना) और विशेष रूप से **आधुनिक declarative routing** (**go_router** जैसे packages, जो non-trivial apps के लिए अनुशंसित है, URL-based routing, deep linking, web support, और nested navigation प्रदान करते हैं) को समझना वर्तमान सर्वोत्तम प्रथाओं को दर्शाता है — जैसे-जैसे apps बढ़ते हैं, declarative routing imperative push/pop की तुलना में जटिलता को बेहतर ढंग से संभालता है।

चूंकि वस्तुतः सभी apps में कई screens होते हैं और उनके बीच navigate करना (data passing के साथ) app कार्यक्षमता के लिए मूलभूत है, और चूंकि Navigator stack model, data passing, और आधुनिक routing (go_router) को समझना multi-screen apps बनाने के लिए आवश्यक है, Flutter में navigation को समझना आवश्यक, मूलभूत ज्ञान है — लगभग हर Flutter app में आवश्यक एक मूल क्षमता और वास्तविक applications के लिए आवश्यक multi-screen अनुभव बनाने के लिए जरूरी।