CODEWITHSUNDEEP
flutterdartnavigation-drawerflutter-drawer
saravanan G
saravanan G

Reputation: 21

How to hide admin menu from user Flutter navigation drawer

I'm trying to hide the admin menu from normal users. Storing login response and role in shared preferences, where isAdmin variable has boolean data, where its stored login provider.

Please find the code which I tried:

[
  buildMenuItem(
    text: 'Home',
    icon: Icons.home,
    onClicked: () => selectedItem(context, 0),
  ),
  const SizedBox(height: 16),
  buildMenuItem(
    text: 'Schedule Parking',
    icon: Icons.update,
    onClicked: () => selectedItem(context, 1),
  ),
  const SizedBox(height: 16),
  buildMenuItem(
    text: 'Status',
    icon: Icons.info,
    onClicked: () => selectedItem(context, 2),
  ),
  const SizedBox(height: 24),
  const Divider(color: Colors.white70),
  const Text(
    'ADMIN',
    style: TextStyle(
        color: Colors.green, fontWeight: FontWeight.bold),
  ),
  const SizedBox(height: 10),
  buildMenuItem(
    text: 'Request',
    icon: Icons.read_more,
    onClicked: () => selectedItem(context, 4),
  ),
  const Divider(color: Colors.white70),
  const SizedBox(height: 24),
  buildMenuItem(
    text: 'Logout',
    icon: Icons.logout,
    onClicked: () => selectedItem(context, 3),
  ),
]

Screenshot for references: screenshot

Please help me with any solution.

Upvotes: 1

Views: 472

Answers (2)

Thiago Fontes
Thiago Fontes

Reputation: 375

You can add an if that checks the isAdmin variable and concatenate the itens from your list of widgets, here's an example based on your code:

[
                  buildMenuItem(
                    text: 'Home',
                    icon: Icons.home,
                    onClicked: () => selectedItem(context, 0),
                  ),
                  const SizedBox(height: 16),
                  buildMenuItem(
                    text: 'Schedule Parking',
                    icon: Icons.update,
                    onClicked: () => selectedItem(context, 1),
                  ),
                  const SizedBox(height: 16),
                  buildMenuItem(
                    text: 'Status',
                    icon: Icons.info,
                    onClicked: () => selectedItem(context, 2),
                  ),
                  if(isAdmin) ...[
                    const SizedBox(height: 24),
                    const Divider(color: Colors.white70),
                    const Text(
                    'ADMIN',
                    style: TextStyle(
                        color: Colors.green, fontWeight: FontWeight.bold),
                    ),
                  ],
                  const SizedBox(height: 10),
                  buildMenuItem(
                    text: 'Request',
                    icon: Icons.read_more,
                    onClicked: () => selectedItem(context, 4),
                  ),
                  const Divider(color: Colors.white70),
                  const SizedBox(height: 24),
                  buildMenuItem(
                    text: 'Logout',
                    icon: Icons.logout,
                    onClicked: () => selectedItem(context, 3),
                  ),
                ]

The ... operator will insert the element of the sublist only if the variable isAdmin is true in this example.

Upvotes: 0

Hari Upreti
Hari Upreti

Reputation: 101

You can simply use the help of ternary operator here, for user based role. Which you receive from your login provider. For Example:

    isAdmin ? const Text('ADMIN') : const Text('Normal User')

Upvotes: 1

Related Questions