Flutter app - login with firebase + Navigation bar

Question

I am building a Flutter app where I have a login form, which is connected with a firebasee database.
I would like to implement a navigation Bar when the user succesfully logs in.
The first page after login is the HomeTab. My app crashes when i add a BottomNavBar widget here.
could you help me please?
my GitHub repo:
https://github.com/GergoJeles/assignment2_07.11.2023.git

import 'package:firebase_ui_auth/firebase_ui_auth.dart';
import 'package:flutter/material.dart';
import 'BottomNavBar.dart'; // Import your custom BottomNavBar widget here
import 'NavBar.dart'; // Import your custom NavBar widget here
import 'AboutTab.dart'; // Import your AboutTab widget
import 'MapTab.dart'; // Import your MapTab widget
import 'ProfileTab.dart'; // Import your ProfileTab widget

class HomeTab extends StatelessWidget {
  const HomeTab({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        actions: [
          IconButton(
            icon: const Icon(Icons.person),
            onPressed: () {
              Navigator.push(
                context,
                MaterialPageRoute<ProfileScreen>(
                  builder: (context) => ProfileScreen(
                    appBar: AppBar(
                      title: const Text('User Profile'),
                    ),
                    actions: [
                      SignedOutAction((context) {
                        Navigator.of(context).pop();
                      })
                    ],
                    children: [
                      const Divider(),
                      Padding(
                        padding: const EdgeInsets.all(2),
                        child: AspectRatio(
                          aspectRatio: 1,
                          child: Image.asset('flutterfire_300x.png'),
                        ),
                      ),
                    ],
                  ),
                ),
              );
            },
          )
        ],
        automaticallyImplyLeading: false,
      ),
      body: Center(
        child: Column(
          children: [
            Image.asset('assets/dash.png'),
            Text(
              'Welcome!',
              style: Theme.of(context).textTheme.displaySmall,
            ),
            const SignOutButton(),
          ],
        ),
      ),
      // Add a custom BottomNavBar widget here
      bottomNavigationBar: BottomNavBar(),
    );
  }
}

the app crasghed when i tried this

Answer 1

create a Screen for user detials, and add in action

    appBar: AppBar(
  actions: <Widget>[
    IconButton(
      icon: Icon(Icons.person),
      onPressed: () {
        // Add your action here
      },
    ),
    // Add more action buttons as needed
  ],
  automaticallyImplyLeading: false,
),

and follow the bottomNavigationBar code below

 import 'package:flutter/material.dart';

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _currentIndex = 0;

  final List<Widget> _pages = [
    HomeTab(),
    AboutTab(),
    MapTab(),
    ProfileTab(),
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Your App Name'),
      ),
      body: _pages[_currentIndex],
      bottomNavigationBar: BottomNavigationBar(
        currentIndex: _currentIndex,
        items: [
          BottomNavigationBarItem(
            icon: Icon(Icons.home),
            label: 'Home',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.info),
            label: 'About',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.map),
            label: 'Map',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.person),
            label: 'Profile',
          ),
        ],
        onTap: (index) {
          setState(() {
            _currentIndex = index;
          });
        },
      ),
    );
  }
}

void main() {
  runApp(MaterialApp(
    home: MyHomePage(),
  ));
}

import screen as per your design view

import 'HomeTab.dart';
import 'AboutTab.dart';
import 'MapTab.dart';
import 'ProfileTab.dart';