Hello friends today we are learn about how to create simple navigation drawer system.
activity_main.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="@+id/container_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<include
android:id="@+id/maintoolbar"
layout="@layout/toolbar" />
</LinearLayout>
<android.support.v4.widget.DrawerLayout
android:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<FrameLayout
android:id="@+id/container_body"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1" />
<RelativeLayout
android:id="@+id/drawer_switch"
android:layout_gravity="left|start"
android:layout_width="match_parent"
android:background="#fff"
android:layout_height="match_parent">
<android.support.v7.widget.RecyclerView
android:id="@+id/drawer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="15dp" />
</RelativeLayout>
</android.support.v4.widget.DrawerLayout>
</LinearLayout>
package com.samset.simplenavigationdrawer;
import android.support.v4.widget.DrawerLayout;
import android.support.v7.app.ActionBarDrawerToggle;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.Toolbar;
import android.view.View;
import android.widget.RelativeLayout;
import com.samset.simplenavigationdrawer.adapters.NavigationDrawerAdapter;
import com.samset.simplenavigationdrawer.model.NavDrawerItem;
import java.util.ArrayList;
import java.util.List;
public class MainActivity extends AppCompatActivity {
// Add icons
private static int[] icons = {
R.drawable.ic_home, R.drawable.ic_android, R.drawable.ic_facebook,
R.drawable.ic_twitter, R.drawable.ic_dropbox, R.drawable.ic_camera, R.drawable.ic_audiotrack,
R.drawable.ic_video, R.drawable.ic_wifi,R.drawable.ic_call,R.drawable.ic_gallery,
R.drawable.ic_cloudy,R.drawable.ic_power};
private Toolbar toolbar;
private RecyclerView recyclerView;
private RelativeLayout drawer_pane;
private DrawerLayout drawerLayout;
private RecyclerView.LayoutManager layoutManager;
private ActionBarDrawerToggle mDrawerToggle;
NavigationDrawerAdapter nav_adapter;
private String[] titles;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Init();
setUpDrawar();
}
private void Init() {
titles = getResources().getStringArray(R.array.nav_drawer_labels);
drawer_pane = (RelativeLayout) findViewById(R.id.drawer_switch);
toolbar = (Toolbar) findViewById(R.id.maintoolbar);
drawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
recyclerView = (RecyclerView) findViewById(R.id.drawer);
}
public void setUpDrawar() {
if (toolbar != null) {
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayShowTitleEnabled(false);
getSupportActionBar().setDisplayHomeAsUpEnabled(false);
}
recyclerView.setHasFixedSize(true);
layoutManager = new LinearLayoutManager(this);
recyclerView.setLayoutManager(layoutManager);
nav_adapter = new NavigationDrawerAdapter(this, getData(), icons);
recyclerView.setAdapter(nav_adapter);
//nav_adapter.setListner(this);
mDrawerToggle = new ActionBarDrawerToggle(this, drawerLayout, toolbar, R.string.drawer_open, R.string.drawer_close) {
@Override
public void onDrawerOpened(View drawerView) {
super.onDrawerOpened(drawerView);
}
@Override
public void onDrawerClosed(View drawerView) {
super.onDrawerClosed(drawerView);
}
};
drawerLayout.setDrawerListener(mDrawerToggle); // Drawer Listener set to the Drawer toggle
mDrawerToggle.syncState(); // Finally we set the drawer toggle sync State
}
public List<NavDrawerItem> getData() {
List<NavDrawerItem> data = new ArrayList<>();
// preparing navigation drawer items
for (int i = 0; i < titles.length; i++) {
NavDrawerItem navItem = new NavDrawerItem();
navItem.setTitle(titles[i]);
data.add(navItem);
}
return data;
}
}
NavigationDrawerAdapter.java
package com.samset.simplenavigationdrawer.adapters;
import android.app.Activity;
import android.support.v7.widget.RecyclerView;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.TextView;
import com.samset.simplenavigationdrawer.R;
import com.samset.simplenavigationdrawer.listeners.OnItemListener;
import com.samset.simplenavigationdrawer.model.NavDrawerItem;
import java.util.List;
/**
* Created by samset on 30-09-2015.
*/
public class NavigationDrawerAdapter extends RecyclerView.Adapter<NavigationDrawerAdapter.MyHolderView> {
List<NavDrawerItem> data;
static Activity context;
int icons[] = null;
private static OnItemListener listner;
public OnItemListener getListner() {
return listner;
}
public void setListner(OnItemListener listner) {
this.listner = listner;
}
public NavigationDrawerAdapter(Activity ctx, List<NavDrawerItem> datalist, int[] icon) {
NavigationDrawerAdapter.context = ctx;
this.data = datalist;
this.icons = icon;
}
public static class MyHolderView extends RecyclerView.ViewHolder
{
TextView list_item;
ImageView icons;
public MyHolderView(View view, int Viewtype) {
super(view);
view.setClickable(true);
list_item = (TextView) view
.findViewById(R.id.tvDrawer_title);
icons = (ImageView) view
.findViewById(R.id.ivdrawer_icon);
list_item.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
if (listner != null) {
listner.OnItemClick(v, getPosition());
} else {
Log.e("Adapter", " Listener Null");
}
}
});
}
}
@Override
public int getItemCount() {
// TODO Auto-generated method stub
return data.size();
}
@Override
public NavigationDrawerAdapter.MyHolderView onCreateViewHolder(
ViewGroup root_parent, int position) {
View v = LayoutInflater.from(root_parent.getContext()).inflate(
R.layout.nav_drawer_row, root_parent, false);
MyHolderView holdview = new MyHolderView(v, position);
return holdview;
}
@Override
public int getItemViewType(int position) {
return position;
}
@Override
public void onBindViewHolder(MyHolderView holder, int position) {
if (icons != null && data != null) {
try {
holder.list_item.setText("" + data.get(position).getTitle().toString());
holder.icons.setImageResource(icons[position]);
} catch (NullPointerException e) {
e.printStackTrace();
}
}
}
}
nav_drawer_row.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:clickable="true">
<RelativeLayout
android:id="@+id/parent_lay"
android:paddingLeft="30dp"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="@+id/ivdrawer_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/ic_launcher"
android:layout_marginRight="20dp"
android:layout_centerVertical="true"
android:layout_alignParentRight="true" />
<TextView
android:id="@+id/tvDrawer_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Samset"
android:layout_centerVertical="true"
android:layout_marginLeft="5dp"
android:layout_alignParentLeft="true"
android:textAppearance="?android:attr/textAppearanceMedium"
/>
</RelativeLayout>
<View
android:id="@+id/v"
android:layout_below="@+id/parent_lay"
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="@color/divider"
android:layout_marginLeft="@dimen/left_margin"
android:layout_marginRight="@dimen/right_margin"
/>
</RelativeLayout>
NavDrawerItem.java
package com.samset.simplenavigationdrawer.model;
/**
* Created by Samset on
*/
public class NavDrawerItem {
private boolean showNotify;
private String title;
public NavDrawerItem() {
}
public NavDrawerItem(boolean showNotify, String title) {
this.showNotify = showNotify;
this.title = title;
}
public boolean isShowNotify() {
return showNotify;
}
public void setShowNotify(boolean showNotify) {
this.showNotify = showNotify;
}
public String getTitle() {
return title;
}
public void setTitle(String title) {
this.title = title;
}
}
toobar.xml
<?xml version="1.0" encoding="utf-8"
?>
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/toolbar"
android:minHeight="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize">
<RelativeLayout
android:id="@+id/rlheader"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<ImageView
android:id="@+id/iv_back"
android:layout_width="24dp"
android:layout_height="24dp"
android:layout_alignParentLeft="true"
android:src="@drawable/ic_back"
android:visibility="gone"
android:layout_centerVertical="true"
/>
<TextView
android:id="@+id/tv_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="SimpleDrawer"
android:textColor="#fff"
android:layout_marginLeft="5dp"
android:layout_toRightOf="@+id/iv_back"
android:layout_centerVertical="true"
android:textAppearance="?android:attr/textAppearanceMedium"
/>
</RelativeLayout>
</android.support.v7.widget.Toolbar>
color.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="colorPrimary">#3F51B5</color>
<color name="colorPrimaryDark">#303F9F</color>
<color name="colorAccent">#FF4081</color>
<color name="divider">#d5d5d5</color>
<color name="btn_back">#F2F2F2</color>
<color name="footer">#424242</color>
<color name="white">#fff</color>
<color name="background">#bada55</color>
<color name="background1">#34c9c1</color>
</resources>
dimen.xml
<resources>
<!-- Default screen margins, per the Android Design guidelines. -->
<dimen name="activity_horizontal_margin">16dp</dimen>
<dimen name="activity_vertical_margin">16dp</dimen>
<dimen name="left_margin">10dp</dimen>
<dimen name="right_margin">10dp</dimen>
<dimen name="drawer_grouping_padding">8dp</dimen>
<dimen name="drawer_right_margin">16dp</dimen>
<dimen name="drawer_left_margin">16dp</dimen>
<dimen name="drawer_header_text">56dp</dimen>
</resources>
style.xml
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
</style>
// If you are change drawer arrow color use this code
<!--this style is change drawer icon color-->
<style name="DrawerArrowStyle" parent="@style/Widget.AppCompat.DrawerArrowToggle">
<item name="spinBars">true</item>
<item name="color">@android:color/white</item>
</style>
</resources>
build.gradle
apply plugin: 'com.android.application'
android {
compileSdkVersion 23
buildToolsVersion "23.0.2"
defaultConfig {
applicationId "com.samset.simplenavigationdrawer"
minSdkVersion 15
targetSdkVersion 23
versionCode 1
versionName "1.0"
}
buildTypes {
release {
minifyEnabled false
proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
}
}
}
dependencies {
compile fileTree(dir: 'libs', include: ['*.jar'])
testCompile 'junit:junit:4.12'
compile 'com.android.support:appcompat-v7:23.2.1'
compile 'com.android.support:design:23.2.1'
compile 'com.android.support:support-v4:23.2.1'
compile 'com.android.support:recyclerview-v7:23.2.1'
}
I hope this blog helps you
Thank you
Live Sample
