Saturday, 2 September 2017

Tutorial Double Navigation Drawer Android (Left and Right)

Hello everyone, today i gonna show you a good tutorial about how to creating double navigation drawer on left and right side.

In usual, you must be develop and application using one navigation drawer on left side, right?  But sometimes your application or your client requires double menu on left and right side. You can implement the right menu using dialog similar like navigation drawer, but it maybe not good for the future of your apps. Just a suggestion, on that case, you should use a navigation drawer to handle the menu on the right side.

Double navigation drawer

In this tutorial i will show you how to create double navigation drawer. I think this tutorial isn't hard if you have been understand about how to create left navigation drawer.

Crate the left navigation drawer from Android Studio


Think if the your application requires a right navigatio drawer after you create the left navigation drawer, so i assume you are have been create the left navigation drawer.

But a will guide you how to create the navigation drawer from Android Studio, here it is :

Open you android studio android and name your project as DoubleNavigationDrawer :

Give your project name

After name the project, click button next.

Choose minumu SDK Version

In this case i choose the fault minumun SDK, that is API 16 for Android Jelly Bean. Klik button Next.

Choose Navigation Drawer Activity

Then choose Navigation Drawer Activity as your first class. This will create the left navigation drawer (without right navigation drawer), after that give your first xml dan class file name, take a look the below image

Give the class and xml file name

Give name for your first class and xml file. In this case, just click button next.

Untuk this steps, you have succeed create the left navigation drawer. Just run the project for make sure. The next step is create the right navigation drawer.

Create the right navigation drawer


To create the right navigation drawer you have to create another menu and also there is one layout you have to modify.

Create new menu for the right navigation's items


Create a new file for the right navigation's items in res/menu. Name the new file as activity_navigation_drawer_right. Here the code :

The code above will appears as items of right navigation.

After you create the right navigation's items, now modify your activity_main.xml ( or the xml file where you hosting you NavigationView).

You have to create the another NavigationView to host the right navigation's items. and change its gravity to END. Just take a look the following codes :

Ok all that should be set in the xml file has been set. Now time to modify your java class.

Modify your main_menu (res/menu)


Modify your main_menu.xml (menu that hosted in page where the navigation drawer will appears). Other word this menu will displaying the right navigation drawer. Here the code :


Modify the java class


Find your class where you hosting your DrawerLayout or your NavigationView. In this case i host them in MainActivity.java.

Create new method for displaying the right navigation. In my case I named it as displayRightNavigation(). Do like the following code :

Call the method inside onCreate() method.

And your onBackPressed() method, modify like following code :

Once again, modify your onOptionItemSelecte(MenuItem item) look like the follows :



Full Code Of Java Class


That's all about the tutorial. Run your project. Hope it works well, feel free to ask me by post your comment.

Download the project here : LINK GITHUB


EmoticonEmoticon