Loading...

Android Navigation Drawer View: Material Design Support Library

Google announced Material Design Support Library for Android Developers with the release of new OS, Android Lollipop 5.0 (API 21). This library includes navigation drawer view, floating action buttonsnackbarfloating labels in EditText, tabs and motion and scroll framework. These tools help us to make our android application good looking with simple step and you can easily use these tools with the help of Android Design Support Library.

Android Navigation Drawer View: Material Design Support Library

Android Navigation View Material Design Support Library

 

Android Navigation View

Making navigation drawer is very difficult and time consuming before Google announced this material design support library. With this library, you can make your navigation drawer in simple step and less time.

Related:
Android Material Design with Design Support Library
Navigation Drawer View User Interface (UI) Design for Android
Best Android Navigation Drawer Libraries Collection
Android Menus: Best Practice and Awesome Android Menu Libraries

Here I will show you how to make a Navigation Drawer with the help of android Design Support Library. Let’s start step by step.

Create a Project


Create a new project with following information.
Application name: Navigation View
Company Domain: viralandroid.com
Package name: com.viralandroid.navigationview
Minimum SDK: Android 2.2 (API 8 Froyo)


Add Design Support Library Dependency


You have to add design support library dependency to your build.gradle file to make navigation drawer view.

dependencies {
    compile fileTree(dir: 'libs', include: ['*.jar'])
    compile 'com.android.support:appcompat-v7:22.2.0'
    compile 'com.android.support:design:22.2.0'
}
Now, to add a navigation view in your activity layout, you have to setup your application theme from styles.xml file and your styles.xml file looks like this:
res/values/styles.xml

And add PrimaryColor and PrimaryDarkColor to your colors.xml file and it looks like this:
res/values/colors.xml


<resources>
    <color name="PrimaryColor">#ff1b6bae</color>
    <color name="PrimaryDarkColor">#ff134a88</color>
</resources>

Create Navigation Header View and Navigation Menu


res/layout/navigation_header.xml

res/menu/navigation_view_items.xml

You can add more menu items according to your wish and also can design your custom menu. Here I have created simple navigation view with a header view and menu item.


Add Navigation View to your Activity Layout


After adding navigation view design support library to your activity layout, it looks like this:
res/layout/activity_main.xml

And do not forget to update your strings.xml file.
res/values/strings.xml

<resources>
    <string name="app_name">Navigation View</string>

    <string name="hello_world">Hello world!</string>
    <string name="action_settings">Settings</string>
    <string name="navigation_view_item_1">Navigation Item 1</string>
    <string name="navigation_view_item_2">Navigation Item 2</string>
    <string name="navigation_view_item_3">Navigation Item 3</string>
    <string name="navigation_view_item_4">Navigation Item 4</string>
    <string name="navigation_view_item_5">Navigation Item 5</string>
    <string name="navigation_view_item_6">Navigation Item 6</string>
    <string name="navigation_view_category_1">Navigation View Category</string>
    <string name="navigation_view_category_2">Navigation View Category</string>
</resources>

Modify Your Activity File

Finally, you have to add java code to your Activity file to make navigation drawer working. Your MainActivity.java file should look like this:
src/MainActivity.java

This is how you can make your Navigation Drawer View. Then, run your application and see how it looks.
Tutorial 7561476385939975420
Home item