example routing using Navigator v1

main.dart

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      initialRoute: "/",
      onGenerateRoute: ((settings) {
        String path = settings.name ?? "";

        if (path == "/") {
          return MaterialPageRoute(
              settings: RouteSettings(name: "/"),builder: (_) => HomeScreen());
        }

        // handle path '/details/:id'
        Uri? uri = Uri.tryParse(path);
        if (uri != null) {
          if (uri.pathSegments.length == 2 &&
              uri.pathSegments[0] == 'details') {
            var id = uri.pathSegments[1];
            return MaterialPageRoute(
                settings: RouteSettings(name: "/details/$id"),
                builder: (context) => DetailScreen(id: id));
          }
        }
        return MaterialPageRoute(builder: (_) => Container());
      }),
    );
  }
}

class HomeScreen extends StatefulWidget {
  HomeScreen({Key? key}) : super(key: key);

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<HomeScreen> {
  @override
  Widget build(BuildContext context) {
    return WillPopScope(
      onWillPop: () async{
        return true;
      },
      child: Scaffold(
          body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(
              'Go to /details/99',
              style: TextStyle(color: Colors.blue[400], fontSize: 22),
            ),
            SizedBox(
              height: 16,
            ),
            GestureDetector(
              onTap: () {
                Navigator.pushNamed(
                  context,
                  '/details/99',
                );
              },
              child: Container(
                padding: EdgeInsets.all(16),
                color: Colors.blue[100],
                child: Text(
                  'Let\'s Go',
                  style: TextStyle(color: Colors.blue[500], fontSize: 18),
                ),
              ),
            )
          ],
        ),
      )),
    );
  }
}

class DetailScreen extends StatefulWidget {
  final String id;

  DetailScreen({required this.id});

  @override
  _DetailScreenState createState() => _DetailScreenState();
}

class _DetailScreenState extends State<DetailScreen> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
          color: Colors.blue[100],
          child: Center(
            child: Column(
              mainAxisSize: MainAxisSize.min,
              children: [
                Text(
                  'ID = ${widget.id}',
                  style: TextStyle(color: Colors.grey[800], fontSize: 28),
                ),
                SizedBox(
                  height: 16,
                ),
                GestureDetector(
                  onTap: () {
                    Navigator.pop(context);
                  },
                  child: Container(
                    padding: EdgeInsets.all(16),
                    color: Colors.grey[200],
                    child: Text(
                      'Back',
                      style: TextStyle(color: Colors.grey[800], fontSize: 18),
                    ),
                  ),
                )
              ],
            ),
          )),
    );
  }
}