How to change state of page builded with Navigator

i tried to change the state of Page2 builded from HomePage with Navigator and MaterialPageRoute but the state didn't change. it seems that i can't change the state of another page, is there any solution to change the state of th Page2 from HomePage?

NB: i changed the page before the delay done.

HomePage :

class MyHomePage extends StatefulWidget {

  const MyHomePage({
    Key? key,
  }) : super(key: key);

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

class _MyHomePageState extends State<MyHomePage> {
  var text = 'pp';
  
    @override
  void initState () {
    super.initState();
    _changeStateAfterDelay();
  }
  
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: const [
            Text("ggg"),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _showPages,
        tooltip: 'Increment',
        child: const Icon(Icons.add),
      ),
    );
  }
  
  void _showPages() {
    Navigator.of(context).push(MaterialPageRoute(
      maintainState: false,
            builder: (context) => Page2(title: text)
        ));
  }
  
  void _changeStateAfterDelay() {
    Future.delayed(const Duration(milliseconds: 10000), () {
      setState(() {
        text += "tt";
      });
    });
  }
}

Page2:

class Page2 extends StatefulWidget {
  final String title;

  const Page2({
    Key? key,
    required this.title,
  }) : super(key: key);

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

class _Page2State extends State<Page2> {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Text(widget.title)
      ),
    );
  }
}