'flutter bloc and navigation drawer

New to Bloc and love having a structured app!

I used the firebase login example:

Flutter Firebase Login Tutorial

Works great and great example. Building upon this example I decided to do it step by step (avoid big mistakes).

I created a bottom navigation with an appbar that has a logout icon. Clicked on logout and it works.

Now I wanted to move the logout to the navigation drawer. I created a statelessWidget dart file called DrawerItems and then I call it from my bottom navigation file (within my scaffold). Here is part of the code of the DrawerItems:

DrawerListItem(
      navListIcon: const Icon(Icons.logout_sharp),
      strTitle: "Logout",
      myFunction: () => context.read<AppBloc>().add(AppLogoutRequested()),
    ),

When I click on the logout icon, it doesn't do anything. Do I really need to make this statefulWidget? the whole point of bloc is to use stateful widgets as little as possible no?

any insight will be great!

Thank you in advance :D



Solution 1:[1]

Ok I figured it out... not really happy about this answer (I like having different files for everything), so if any of you know why this is happening feel free to drop a comment!

I removed the "myFunction" that I was passing and put the read bloc line directly in the drawer stateless class and it worked.

so this is my final code (I kept the old code there too FYI):

Widget build(BuildContext context) {
const drawerHeader = UserAccountsDrawerHeader(
  accountName: Text("Account Name"),
  accountEmail: Text("Account Email"),
  currentAccountPicture: CircleAvatar(
    child: FlutterLogo(size: 42.0),
  ),
);

return ListView(
  children: [
    drawerHeader,
    // DrawerListItem(
    //   navListIcon: Icon(Icons.account_circle_sharp),
    //   strTitle: "Account information",
    // ),
    // DrawerListItem(
    //   navListIcon: Icon(Icons.filter_list_sharp),
    //   strTitle: "Filter",
    // ),
    ListTile(
      leading: const Icon(Icons.logout_sharp),
      title: const Text("Logout"),
      onTap: () {
        context.read<AppBloc>().add(AppLogoutRequested());
        Navigator.pop(context);
      },
    ),
    // DrawerListItem(
    //   navListIcon: const Icon(Icons.logout_sharp),
    //   strTitle: "Logout",
    //   myFunction: () => context.read<AppBloc>().add(AppLogoutRequested()),
    // ),
  ],
);

}

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Ants