Introduction:

Navigation Drawer is a kind of menu which is quite common in apps, which makes the user understand the key features of the app much easier.

We also find a user profile in this menu which makes the user know his details with a profile pic in some cases.

So, today we deal with navigation drawer in both Android as well as iOS using the flutter.

Please visit my previous tutorials on flutter for more info on this topic here.

Let’s start coding, the menu with the basic components

 

Main.dart

Import flutter package

 

Declare a void main

 

Now create a class MyApp which extends StatelessWidget

 

 

Now add in body add  text view just to display a sample text

 

 

then add a navigation drawer

 

 

add a list view inside drawer

 

 

padding for list

 

add a drawer header

 

a sample text where we display user information in further stages, which include background color for header, and text color, font size declaration.

 

 

now here come’s the key module that is adding a row to list view

we declare name of the tile with the properties like font size, color etc.,

 

 

and we need a click functionality for which we  have a method called   —  tap()

 

 

like wise add few more fields depending on your requirement.

 

Full code:

 

 

 

 

Output:

Show Buttons
Hide Buttons
Read previous post:
Android iOS Flutter tutorial on Snackbar || SnackBar || Flutter

Close