Advanced Android - Sliding Menu

Quiz

The Android Navigation Drawer is a sliding panel on the whole determined on the left fringe of the main screen in which you've got your apps predominant navigation menu or options.

Example

This example demostrate about how to integrate Android Sliding Menu using Navigation Drawer.

Create a project with Android Studio Navigation Drawer Template as shown below −

The above template creates the basic skeleton app with few navigation menu items

Adding Items to Drawer

To add an item to drawer,open res ⇒ values ⇒ String.xml file. The sample file os String.xml as shown below −

<?xml version = "1.0" encoding = "utf-8"?>
<menu xmlns:android = "http://schemas.android.com/apk/res/android">

   <group android:checkableBehavior = "single">
      <item
         android:id = "@+id/nav_camera"
         android:icon = "@drawable/ic_menu_camera"
         android:title = "Import" />
      <item
         android:id = "@+id/nav_gallery"
         android:icon = "@drawable/ic_menu_gallery"
         android:title = "Gallery" />
      <item
         android:id = "@+id/nav_slideshow"
         android:icon = "@drawable/ic_menu_slideshow"
         android:title = "Slideshow" />
      <item
         android:id = "@+id/nav_manage"
         android:icon = "@drawable/ic_menu_manage"
         android:title = "Tools" />
   </group>

   <item android:title = "Communicate">
      <menu>
         <item
            android:id = "@+id/nav_share"
            android:icon = "@drawable/ic_menu_share"
            android:title = "Share" />
         <item
            android:id = "@+id/nav_send"
            android:icon = "@drawable/ic_menu_send"
            android:title = "Send" />
      </menu>
   </item>

</menu>

After add an item to group. The code should be like this −

<?xml version = "1.0" encoding = "utf-8"?>
<menu xmlns:android = "http://schemas.android.com/apk/res/android">

   <group android:checkableBehavior = "single">
      <item
         android:id = "@+id/nav_camera"
         android:icon = "@drawable/ic_menu_camera"
         android:title = "Import" />
      <item
         android:id = "@+id/nav_gallery"
         android:icon = "@drawable/ic_menu_gallery"
         android:title = "Gallery" />
      <item
         android:id = "@+id/nav_slideshow"
         android:icon = "@drawable/ic_menu_slideshow"
         android:title = "Slideshow" />
      <item
         android:id = "@+id/nav_manage"
         android:icon = "@drawable/ic_menu_manage"
         android:title = "Tools" />
      <item
         android:id = "@+id/example"
            android:icon = "@drawable/side_nav_bar"
            android:title = "example"/>
   </group>

   <item android:title = "Communicate">
      <menu>
         <item
            android:id = "@+id/nav_share"
            android:icon = "@drawable/ic_menu_share"
            android:title = "Share" />
         <item
            android:id = "@+id/nav_send"
            android:icon = "@drawable/ic_menu_send"
            android:title = "Send" />
      </menu>
   </item>

</menu>

Following is the content of the modified main activity file src/MainActivity.java.

package myapplication.example.com.myapplication;

import android.os.Bundle;
import android.support.design.widget.FloatingActionButton;
import android.support.design.widget.Snackbar;
import android.view.View;

import android.support.design.widget.NavigationView;
import android.support.v4.view.GravityCompat;
import android.support.v4.widget.DrawerLayout;
import android.support.v7.app.ActionBarDrawerToggle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;

import android.view.Menu;
import android.view.MenuItem;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity
implements NavigationView.OnNavigationItemSelectedListener {
   @Override
   protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_main);
      Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
      
      setSupportActionBar(toolbar);
      FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);
      
      fab.setOnClickListener(new View.OnClickListener() {
         @Override
         public void onClick(View view) {
            Snackbar.make(view, "Replace with your own action", Snackbar.LENGTH_LONG)
               .setAction("Action", null).show();
         }
      });
         
      DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
      ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(
         this, drawer, toolbar, R.string.navigation_drawer_open, 
         R.string.navigation_drawer_close);
         
      drawer.setDrawerListener(toggle);
      toggle.syncState();
      NavigationView navigationView = (NavigationView) findViewById(R.id.nav_view);
      navigationView.setNavigationItemSelectedListener(this);
   }
      
   @Override
   public void onBackPressed() {
      DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
      if (drawer.isDrawerOpen(GravityCompat.START)) {
         drawer.closeDrawer(GravityCompat.START);
      } else {
         super.onBackPressed();
      }
   }
      
   @Override 
   public boolean onCreateOptionsMenu(Menu menu) {
      // Inflate the menu; this adds items to the action bar if it is present.
      getMenuInflater().inflate(R.menu.main, menu);
      return true;
   } 
      
   @Override 
   public boolean onOptionsItemSelected(MenuItem item) {
      // Handle action bar item clicks here. The action bar will
      // automatically handle clicks on the Home/Up button, so long
      // as you specify a parent activity in AndroidManifest.xml.
      int id = item.getItemId();

      //noinspection SimplifiableIfStatement
      if (id == R.id.action_settings) {
         return true;
      } 
      return super.onOptionsItemSelected(item);
   } 
      
   @SuppressWarnings("StatementWithEmptyBody")
   @Override 
   public boolean onNavigationItemSelected(MenuItem item) { 
      // Handle navigation view item clicks here.
      int id = item.getItemId();
         
      if (id == R.id.nav_camera) {
         // Handle the camera action
      } else if (id == R.id.nav_gallery) {
      } else if (id == R.id.nav_slideshow) {
      } else if (id == R.id.nav_manage) {
      } else if (id == R.id.nav_share) {
      } else if (id == R.id.nav_send) {
      } else if(id == R.id.example) {
         Toast.makeText(this,"This is sample",Toast.LENGTH_LONG).show();
      } 
      DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
      drawer.closeDrawer(GravityCompat.START);
      return true;
   }
}

Don't change content of activity_main.xml and manifest.xml file.

Let's try to run your application. I assume you have connected your actual Android Mobile device with your computer. To run the app from android studio, open one of your project's activity files and click Run Eclipse Run Icon icon from the toolbar. Select your mobile device as an option and then check your mobile device which will display your default screen −

Print Page