Какие классы понадобятся при реализации навигации в Flutter?

Классы для реализации навигации в Flutter

Навигация в Flutter — это система управления переходами между экранами и маршрутами приложения. Существует несколько подходов и соответствующих им классов.

1. Navigator и Route (базовая навигация)

Navigator — это главный класс для управления стеком маршрутов:

// Переход на новый экран
Navigator.of(context).push(
  MaterialPageRoute(builder: (context) => SecondScreen())
);

// Возврат с результатом
Navigator.of(context).pop(result);

Route — базовый класс для описания маршрута:

class CustomRoute extends MaterialPageRoute {
  CustomRoute({required WidgetBuilder builder}) : super(builder: builder);
}

2. MaterialPageRoute и CupertinoPageRoute

// Android-style переход с слайдом
MaterialPageRoute(builder: (context) => NextScreen())

// iOS-style переход
CupertinoPageRoute(builder: (context) => NextScreen())

Оба класса наследуют PageRoute и определяют анимацию переходов.

3. GoRouter (рекомендуемый подход)

Это пакет для декларативной навигации с поддержкой deep linking:

final router = GoRouter(
  routes: [
    GoRoute(
      path: '/',
      builder: (context, state) => HomeScreen(),
      routes: [
        GoRoute(
          path: 'detail/:id',
          builder: (context, state) => DetailScreen(
            id: state.pathParameters['id']!,
          ),
        ),
      ],
    ),
  ],
);

// Навигация
context.go('/detail/123');

4. Named Routes (традиционный подход)

MaterialApp(
  routes: {
    '/': (context) => HomeScreen(),
    '/second': (context) => SecondScreen(),
  },
);

// Навигация
Navigator.of(context).pushNamed('/second');

5. PageRoute и его подклассы

• MaterialPageRoute — слайд снизу (Android)
• CupertinoPageRoute — слайд справа (iOS)
• PageRouteBuilder — кастомная анимация

PageRouteBuilder(
  pageBuilder: (context, animation, secondaryAnimation) => NextScreen(),
  transitionsBuilder: (context, animation, secondaryAnimation, child) {
    return FadeTransition(opacity: animation, child: child);
  },
)

6. RouteSettings и навигационные события

RouteSettings(
  name: '/detail',
  arguments: {'id': 123},
)

7. RouteObserver (отслеживание навигации)

class MyRouteObserver extends RouteObserver<Route<dynamic>> {
  @override
  void didPush(Route<dynamic> route, Route<dynamic>? previousRoute) {
    print('Pushed');
  }

  @override
  void didPop(Route<dynamic> route, Route<dynamic>? previousRoute) {
    print('Popped');
  }
}

MaterialApp(
  navigatorObservers: [MyRouteObserver()],
)

Рекомендации по выбору подхода:

GoRouter:

• Для новых проектов
• Если нужен deep linking
• Сложная навигационная логика
• Управление состоянием навигации

Navigator + MaterialPageRoute:

• Простые приложения
• Кастомная анимация переходов
• Полный контроль над логикой

Named Routes:

• Legacy приложения
• Простая структура навигации

Современный подход — использовать GoRouter с Riverpod или Provider для управления состоянием.