Navigator 1.0

Page Route Builder

PageRouteBuilder is a utility class that helps create a custom route transition when navigating between screens. While Flutter provides some default transitions out-of-the-box, such as the slide transition on iOS and the fade-through transition on Android, there are times you may want to use a completely different animation or customize the existing ones. That's where PageRouteBuilder comes in.

Navigator.of(context).push(
  PageRouteBuilder(
    pageBuilder: (context, animation, secondaryAnimation) => YourNewScreen(),
    transitionsBuilder: (context, animation, secondaryAnimation, child) {
      const begin = Offset(1.0, 0.0); // Start position (off-screen to the right)
      const end = Offset.zero; // End position (on-screen)
      const curve = Curves.easeInOut;
      var tween = Tween(begin: begin, end: end).chain(CurveTween(curve: curve));
      var offsetAnimation = animation.drive(tween);
      return SlideTransition(position: offsetAnimation, child: child);
    },
  ),
);

Navigator.pushNamed

Navigator.pushNamed is a method used to navigate to a named route. Named routes are predefined string identifiers for routes/screens in your application. Using named routes can help in making your navigation logic more clear and centralized, as opposed to directly passing route widgets around.

MaterialApp(
  // Define the initial route:
  initialRoute: '/',
  routes: {
    '/': (context) => HomeScreen(),
    '/details': (context) => DetailsScreen(),
    // Add more named routes as needed
  },
)

Navigator.of(context).pushNamed("/details");