Search packages, repositories and app categories

GitHub repositorymono0926/route_observer_mixin

route_observer_mixin

RouteObserveMixin provides easy access to didPush/didPop/didPushNext/didPopNext.

route_observer_mixin project cover
Stars
26
Forks
5
Last push (UTC)
Sep 9, 2026
Project status
Active

Original README

English project snapshot. Visit GitHub for the latest content.

route_observer_mixin

Gif

RouteObserveMixin provides easy access to didPush/didPop/didPushNext/didPopNext.

Usage

1. Wrap MaterialApp with RouteObserverProvider.
void main() {
  runApp(
    MultiProvider(
      providers: [
        // 1. Wrap MaterialApp with RouteObserverProvider.
        RouteObserverProvider(),
        ChangeNotifierProvider(create: (context) => Logger())
      ],
      child: const App(),
    ),
  );

  // Of course, this is also ok.
  // I demonstrated that [MultiProvider] can be used for RouteObserverProvider👍

  /*
  runApp(
    RouteObserverProvider(
      child: App(),
    ),
  );
  */
}
2. Pass RouteObserverProvider.of(context) to navigatorObservers.
class App extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      // 2. Pass RouteObserverProvider.of(context) to navigatorObservers.
      navigatorObservers: [RouteObserverProvider.of(context)],
      home: const APage(),
    );
  }
}
3. Add with RouteAware, RouteObserverMixin to State and override RouteAware methods.
class APage extends StatefulWidget {
  const APage({Key key}) : super(key: key);

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

// 3. Add `with RouteAware, RouteObserverMixin` to State and override RouteAware methods.
class _APageState extends State<APage> with RouteAware, RouteObserverMixin {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('A Page'),
      ),
      body: Center(
        child: RaisedButton(
          onPressed: () {
            Navigator.of(context).push<void>(
              MaterialPageRoute(
                builder: (context) => const BPage(),
              ),
            );
          },
          child: const Text('B Page'),
        ),
      ),
    );
  }

  /// Called when the top route has been popped off, and the current route
  /// shows up.
  @override
  void didPopNext() { }

  /// Called when the current route has been pushed.
  @override
  void didPush() { }

  /// Called when the current route has been popped off.
  @override
  void didPop() { }

  /// Called when a new route has been pushed, and the current route is no
  /// longer visible.
  @override
  void didPushNext() { }
}

Example

  • https://github.com/mono0926/route_observer_mixin/tree/master/example
mono — Masayuki Ono GitHub avatar
GitHub author

mono — Masayuki Ono ↗

Software Engineer (Flutter/Dart, Firebase/GCP, iOS/Swift, TypeScript)

FreelanceTokyo, JapanOfficial website ↗
LanguagesC++DartCMakeHTMLSwiftCKotlinObjective-C

Categories

Packages published by this repository

Dependencies used

Dependency list 7 items

How do I choose a repository?

Start with your use case, compare repository activity, and check the original project before adopting it.

  1. Search by repository name, owner or description, then narrow the results by topic.
  2. Compare stars, forks and recent pushes. Stars show community interest, not a guarantee of quality.
  3. Read the README, license and issues on GitHub before using a project.

Sources and maintenance

“A repository is the most basic element of GitHub.”

GitHub Docs — About repositories ↗