Skip to content

djshah17/Flutter-Navigation-Routing-Sample

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

5 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Flutter-Navigation-Routing-Sample

A demo app to demonstrate navigation and routing between different screens in flutter app.

Create dynamic RouteGenerator Class

import 'package:flutter/material.dart'; import 'package:flutternavigationsample/first_screen.dart'; import 'package:flutternavigationsample/second_screen.dart'; class RouteGenerator { static Route<dynamic> generateRoute(RouteSettings settings) { switch (settings.name) { case '/FirstScreen': return MaterialPageRoute(builder: (_) => FirstScreen()); case '/SecondScreen': return MaterialPageRoute(builder: (_) => SecondScreen()); default: // If there is no such named route in the switch statement, e.g. /third return _errorRoute(); } } static Route<dynamic> _errorRoute() { return MaterialPageRoute(builder: (_) { return Scaffold( appBar: AppBar( title: Text('Error'), ), body: Center( child: Text('ERROR'), ), ); }); } }

Integrate RouteGenerator Class in main.dart file

import 'package:flutter/material.dart'; import 'package:flutternavigationsample/first_screen.dart'; import 'package:flutternavigationsample/route_generator.dart'; void main() => runApp(MyApp()); class MyApp extends StatelessWidget { // This widget is the root of your application. @override Widget build(BuildContext context) { return MaterialApp( home: FirstScreen(), onGenerateRoute: RouteGenerator.generateRoute, ); } }

Navigate from First Screen to Second Screen

Navigator.pushNamed(context, "/SecondScreen");

Pass arguments Between Screens

Set argumants in first screen

List<String> playerNames = ["Cristiano Ronaldo, Lional Messi"]; Navigator.pushNamed(context, "/SecondScreen", arguments: playerNames);

Pass arguments in RouteGenerator class

static Route<dynamic> generateRoute(RouteSettings settings) { // Getting arguments passed in while calling Navigator.pushNamed final args = settings.arguments; switch (settings.name) { case '/FirstScreen': return MaterialPageRoute(builder: (_) => FirstScreen()); case '/SecondScreen': // Validation of correct data type if (args is List<String>) { return MaterialPageRoute( builder: (_) => SecondScreen( listPlayerNames: args, ), ); } // If args is not of the correct type, return an error page. // You can also throw an exception while in development. return _errorRoute(); default: // If there is no such named route in the switch statement, e.g. /third return _errorRoute(); } }

Get arguments in Second Screen

List<String> listPlayerNames; SecondScreen({this.listPlayerNames});

Return data from Second Screen to First Screen with Pop

Make changes in Second Screen

Navigator.pop(context,playerName);

Make changes in First Screen

displayResult(BuildContext context, List<String> playerNames) async{ final getSelectedPlayerName = await Navigator.pushNamed(context, "/SecondScreen", arguments: playerNames); print(getSelectedPlayerName.toString()); }