Nested navigation - observe route changes

Question

My navigation flow includes persistent bottom bar + persistent appbar and some page to replace by navigator.

My code:

class _NavigationFlowWidgetState extends State<NavigationFlowWidget> {
  final _navigatorKey = GlobalKey<NavigatorState>();
  int bottomBarIndex = 0;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      bottomNavigationBar: BottomNavigationBar(
        currentIndex: bottomBarIndex,
        items: const <BottomNavigationBarItem>[
          BottomNavigationBarItem(
            icon: Icon(Icons.home),
            label: 'Home',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.business),
            label: 'Business',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.school),
            label: 'School',
          ),
        ],
        selectedItemColor: Colors.amber[800],
        onTap: (value) {
          setState(() {
            bottomBarIndex = value;
          });
        },
      ),
      appBar: AppBar(title: const Text('Test app')),
      body: WillPopScope(
        onWillPop: () async {
          if (_navigatorKey.currentState!.canPop()) {
            _navigatorKey.currentState!.pop();
            return false;
          }
          return true;
        },
        child: Navigator(
          key: _navigatorKey,
          onGenerateRoute: (settings) {
            final Widget screen;

            switch (settings.name) {
              case routeScreen1:
                screen = FirstPageWidget(navigatorKey: _navigatorKey);
                break;

              case routeScreen2:
                screen = SecondPageWidget(navigatorKey: _navigatorKey);
                break;

              default:
                screen = FirstPageWidget(navigatorKey: _navigatorKey);
            }
            return MaterialPageRoute<dynamic>(builder: (context) => screen, settings: settings);
          },
        ),
      ),
    );
  }

  @override
  void initState() {
    super.initState();
  }
}

It works fine. Bottom navigator bar and appbar are persistent. Next, I need to change appbar title to indicate which page is visible and draw back icon button on appbar it there's any any remaining pages on the stack.

So, how do I refresh appbar to set title corresponding to page currently visible? What is preferred way to do that?