main.dart

import 'package:flutter/material.dart';

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

class TheApp extends StatefulWidget {
  @override
  _TheAppState createState() => _TheAppState();
}

class _TheAppState extends State<TheApp> {
  final pages = <Page>[];
  final _navigatorKey = GlobalKey<NavigatorState>();

  @override
  void initState() {
    super.initState();
    pages.add(
      MyCustomPage(
        builder: (_) => HomePage(
          onAddPage: () {
            pages.add(
              MyCustomPage(
                builder: (_) => DetailsPage(),
                key: const Key('DetailsPage'),
              ),
            );
            setState(() {});
          },
        ),
        key: const Key('HomePage'),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Navigator Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),
      navigatorKey: _navigatorKey,
      onGenerateRoute: (_) => null,
      builder: (context, child) {
        return Navigator(
          key: _navigatorKey,
          pages: List.of(pages),
          onPopPage: _onPopPage,
        );
      },
    );
  }
  bool _onPopPage(Route<dynamic> route, dynamic result) {
    pages.remove(route.settings);
    return route.didPop(result);
  }
}

/// {@template myCustomPage}
/// Custom implementation of [Page]
///
/// To create new page wrap it with [MyCustomPage].
///
/// {@tool snippet}
///
/// Typical usage is as follows:
///
/// ```dart
/// MyCustomPage(
///    builder: (_) => HomePage(),
///    key: const Key('HomePage'),
/// ),
/// ```
/// {@end-tool}
/// {@endtemplate}
class MyCustomPage<T> extends Page<T> {
  /// {@macro myCustomPage}
  const MyCustomPage({
    @required this.builder,
    String name,
    Key key,
  }) : super(key: key, name: name);
  final WidgetBuilder builder;

  @override
  Route<T> createRoute(BuildContext context) {
    return MaterialPageRoute(
      settings: this,
      builder: builder,
    );
  }

  @override
  int get hashCode => key.hashCode;

  @override
  bool operator ==(Object other) {
    if (other is Page) {
      return key == other.key;
    } else {
      return super == other;
    }
  }
}

class HomePage extends StatelessWidget {
  const HomePage({Key key, this.onAddPage}) : super(key: key);

  final VoidCallback onAddPage;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('HomePage'),
      ),
      body: TextButton(
        child: Text('Add page'),
        onPressed: onAddPage,
      ),
    );
  }
}

class DetailsPage extends StatelessWidget {
  const DetailsPage({
    Key key,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Details Page'),
        backgroundColor: Colors.red,
      ),
      body: Center(child: Text('Details Page')),
    );
  }
}