Flutter 3.10: Keep BottomNavigationBar when push to child screen

Question

My problem is simple and complex at the same time, I have 4 screens, A,B,C and D, in screen A I have a TextButton that redirects me to Screen2, the situation is that the BottomNavigationBar is no longer displayed, and in this case is an example, but in case apart from screen A, the others also have a similar situation...how would be the best way to do it, I would not want to install packages if the problem can be solved formally locally. I attach my code below:

class HomeScreen extends StatefulWidget {
  const HomeScreen({super.key});

  @override
  State<HomeScreen> createState() => _HomeScreen();
}

class _HomeScreen extends State<HomeScreen> {
  int _currentIndex = 0;

  final List<Widget> _screens = [
    HomePage(),
    Text('2'),
    Text('3'),
    Text('4'),
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      bottomNavigationBar: BottomNavigationBarHomePage(callback: _onTabTapped),
      appBar: AppBar(
        elevation: 0,
        title: const Text('Player', style: TextStyle(color: Colors.black)),
        backgroundColor: Colors.white,
        actions: const [
          SizedBox(
            width: 20,
          ),
          Padding(
            padding: EdgeInsets.only(right: 10),
            child: Icon(
              Icons.notifications,
              color: Colors.black,
            ),
          )
        ],
      ),
      body: _screens[_currentIndex],
      floatingActionButton: FloatingActionButton(
        onPressed: () {},
        backgroundColor: Colors.black,
        child: const Icon(Icons.add),
      ),
      floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
    );
  }

  void _onTabTapped(int index) {
    setState(() {
      _currentIndex = index;
    });
  }
}

class BottomNavigationBarHomePage extends StatefulWidget {
  final Function(int) callback;

  const BottomNavigationBarHomePage({
    super.key,
    required this.callback,
  });

  @override
  State<BottomNavigationBarHomePage> createState() =>
      _BottomNavigationBarHomePageState();
}

class _BottomNavigationBarHomePageState
    extends State<BottomNavigationBarHomePage> {
  @override
  Widget build(BuildContext context) {
    return BottomAppBar(
      height: 50,
      elevation: 10,
      shape: const CircularNotchedRectangle(),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceAround,
        children: <Widget>[
          IconButton(
            icon: const Icon(Icons.home),
            onPressed: () {
              widget.callback(0);
            },
          ),
          IconButton(
            icon: const Icon(Icons.search),
            onPressed: () {
              widget.callback(1);
            },
          ),
          IconButton(
            icon: const Icon(Icons.video_camera_front),
            onPressed: () {
              widget.callback(2);
            },
          ),
          IconButton(
            icon: const Icon(Icons.person),
            onPressed: () {
              widget.callback(3);
            },
          ),
        ],
      ),
    );
  }
}

class HomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      color: Colors.lightBlueAccent,
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        crossAxisAlignment: CrossAxisAlignment.stretch,
        children: <Widget>[
          Container(
            margin: const EdgeInsets.all(16),
            child: const Center(
              child: Text(
                'Screen 1',
                style: TextStyle(color: Colors.white, fontSize: 20),
              ),
            ),
          ),
          TextButton(
            onPressed: () {
              Navigator.push(
                  context, MaterialPageRoute(builder: (context) => Screen2()));
            },
            child: const Text('Go to next screen'),
          ),
        ],
      ),
    );
  }
}

class Screen2 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        color: Colors.lightBlueAccent,
        alignment: Alignment.center,
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Container(
              margin: const EdgeInsets.all(16),
              child: const Text(
                'Screen 2',
                style: TextStyle(color: Colors.white, fontSize: 20),
              ),
            ),
            TextButton(
              onPressed: () {
                Navigator.pop(context);
              },
              child: const Text('Go back'),
            ),
          ],
        ),
      ),
    );
  }
}

HomePage -Screen1 Screen2

BottomNavigationBar overlaps when switching screens