Navigating between modals with a custom button in flutter

I have 3 screens. In home page, when either of the button is clicked, it will navigate to the screen defined.

Now, when I click Open Screen 1 and in Screen1 I click Button in Screen 1 it will open Screen2 embedded inside a modal but the problem is in Screen2, I click Button in Screen 2, it will not open Screen1 modal. Please help.

import 'package:flutter/material.dart';    void main() {    return runApp(MyApp());  }    class MyApp extends StatelessWidget {    @override    Widget build(BuildContext context) {      return MaterialApp(        title: 'Flutter Demo',        home: Scaffold(          body: Center(            child: MainScreen(),          ),        ),      );    }  }    class MainScreen extends StatelessWidget {    void _openScreen(BuildContext context, Widget screen) {      showModalBottomSheet(        context: context,        isScrollControlled: true,        builder: (_) => screen,      );    }      @override    Widget build(BuildContext context) {      return Column(        crossAxisAlignment: CrossAxisAlignment.center,        mainAxisAlignment: MainAxisAlignment.center,        children: [          CustomButton(            text: "Open Screen 1",            onPressed: () => _openScreen(context, Screen1(              onNavToScreen2: () {                Navigator.pop(context);                _openScreen(context, Screen2());              },            )),          ),          CustomButton(            text: "Open Screen 2",            onPressed: () => _openScreen(context, Screen2(              onNavToScreen1: () {                Navigator.pop(context);                _openScreen(context, Screen1());              },            )),          ),        ],      );    }  }    class Screen1 extends StatelessWidget {    final VoidCallback onNavToScreen2;      const Screen1({this.onNavToScreen2 = _defaultFunc});      static _defaultFunc() {}      @override    Widget build(BuildContext context) {      return Center(        child: CustomButton(          text: "Button in Screen 1",          onPressed: () {            print("Button pressed in screen 1");            onNavToScreen2();          },        ),      );    }  }    class Screen2 extends StatelessWidget {    final VoidCallback onNavToScreen1;      const Screen2({this.onNavToScreen1 = _defaultFunc});      static _defaultFunc() {}      @override    Widget build(BuildContext context) {      return Center(        child: CustomButton(          text: "Button in Screen 2",          onPressed: () {            print("Button pressed in screen 2");            onNavToScreen1();          },        ),      );    }  }    class CustomButton extends StatelessWidget {    final VoidCallback onPressed;    final String text;      const CustomButton({this.onPressed = _defaultFunc, this.text = "A button"});      static _defaultFunc() {}      @override    Widget build(BuildContext context) {      return GestureDetector(        onTap: () {          onPressed();        },        child: Container(          height: 50,          child: Text(text, style: TextStyle(color: Colors.black)),        ),      );    }  }  

https://stackoverflow.com/questions/65895739/navigating-between-modals-with-a-custom-button-in-flutter January 26, 2021 at 12:04PM