21.7 C
Friday, September 24, 2021

Code to Create Navigation Drawer in Android App




Create Navigation Drawer in Android App

Being an app developer one should know how to create navigation drawer, of course, you will have the code for navigation drawer from many source code site. Seizing instant code and implementing as it is in your app is not a big deal, what if you want something other than the size code? you need to make changes to the enfolded code. Without proper insight, you can not make any changes easily. It is your concern to understand basic structure, the concept first after that you can easily make whatever changes you want. Here I am going to cover essential chunks requisite to understand navigation drawer and how to create it.

Create Navigation Drawer in Android
Create Navigation Drawer in Android

What is Navigation Drawer:

As a developer, you may know Navigation. Yes, navigation is nothing but the various menus that navigates people from one page to other. Also in the case of the website you have seen navigation that is the menus available most probably on the top of the page or may be on the left side or right side of the page.

In the application, there is navigation as well, for your understanding you can call navigation drawer as “sliding menu bar” which is most of the times remains invisible. As per the developer.android.com “the navigation drawer is a panel that displays the apps main navigation options on the left edge of the screen”.

Do you think it is the only option for navigation drawer, that it can display only on the left edge of the screen? No, it is not the constraint we can also create navigation drawer at the right edge I have discussed it below. However, as per the standard design, it is not recommended to have navigation drawer on the right side.

See Also  Building Android Apps React Native Tutorial

Types of Navigation Drawer:

Basically android is having  two of navigation drawer as shown below:

Navigation drawer below the action bar
Navigation drawer below the action bar
Navigation drawer above the action bar
Navigation drawer above the action bar

There is one more type which is not shown here, that type is slightly diverse and the contrast is the background shade that turns to dim or remains high when the drawer is visible on the device screen. In my case you can see when the drawer is visible the background incline dim shade.

See Also  Logical & Comparison Operators in Kotlin

How to create Navigation Drawer :

In updated Android Studio you have off-the-rack Navigation Drawer Activity however default navigation drawer is of single type to get any of the other type one have to make changes. First study the steps for creating navigation drawer I am sure this will help you very well. For making any changes or creating your navigation drawer best idea is to create default navigation drawer activity then grasp it and then create your own navigation drawer. To better figure out follow the below steps.

Step#1: First of all create a new app with blank or empty activity.

Step#2: Create a layout say “app_bar” in layout directory under res folder(I am giving the name as available in the default navigation drawer activity) app_bar layout is the layout that is visible on the screen. Shown in the figure below.

Step#3: If you want a header in navigation drawer then create different layout say nav_header_layout hope you will find the same layout name or it may be slightly different.

Step#4: For menu in the drawer create menu_item.xml (you might see the same name in default navigation drawer activity) in menu directory under res folder.

Step#5: Finally in activity_main layout add both the drawer as well as the layout that is always visible that is app_bar.xml layout.

See Also  Chess game development in android studio

Step#6 : Here you bound navigation drawer to activity_main, to get the code you can simply copy from default navigation drawer activity available in android studio just make sure that you are using proper id and resources name like drawable name, strings etc.

My motive is to just make you clear which activity uses what etc. as it is very important to clear all this. Here you have your navigation drawer.

See Also  Chess game development in android studio

How to create Navigation Drawer opening from right edge :

To make drawer to open from right edge you need to make some changes in your drawer. Gravity left = start and gravity right end some system may have start,end gravity and some may have left,right gravity here i am showing an example with start end gravity as my system is having start and end gravity.

This will be your activity_main layout, bold text is responsible for making right edge drawer.




Here is your MainActivity.java

//add this code in oncreate() in default navigation drawer MainActivity.java
toolbar.setNavigationOnClickListener(new View.OnClickListener() {

public void onClick(View v) {
if (drawer.isDrawerOpen(Gravity.RIGHT)) {
} else {

after making the above changes you will see navigation drawer at the right edge as shown below.

Navigation Drawer at the right edge
Navigation Drawer at the right edge

Note: The above code is according to default Navigation Drawer activity that is directly created in an android studio.

I hope you understand how to Create Navigation Drawer in Android App and how to make it open from right edge ( right align ). If you have any question, comment below I will try my best to solve your problems.

About the author

SyncSaS Technologies is specialized in creating and designing customized software. We have our own team that will be in charge of developing your softwares.

Add a comment

Related posts