Android- app crashes while adding a navigation drawer to a custom toolbar

Question

I've made a custom toolbar and its Right-To-Left. and it looks like this:

I want a navigation drawer appears when I click on the right side icon. But when I add the navigation drawer to app, it crashes. I've tried many things and also searched a lot, but it didn't work. It'd be GREAT it someone would help me.

Here is my code:

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="com.playpersia.mycustomizedtoolbar.MainActivity"
  >

  <include
    layout="@layout/toolbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:id="@+id/toolbar"/>


  <android.support.v4.widget.DrawerLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:openDrawer="end"
    android:fitsSystemWindows="true"
    android:id="@+id/right_drawer">

   <!-- Main layout -->
   <FrameLayout
    android:id="@+id/main_fragment_container"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

 <TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/toolbar"
android:text="Hello"/>

  </FrameLayout>


    <!-- Nav drawer -->
    <LinearLayout
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="right|end" >

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/header_drawer"
            android:src="@drawable/my_image" />

        <ListView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="end"
            android:id="@+id/list_view"
            android:entries="@array/pages" />
    </LinearLayout>

   </android.support.v4.widget.DrawerLayout>

 </LinearLayout>

right_drawer.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:openDrawer="end"
android:fitsSystemWindows="true"
android:id="@+id/right_drawer"
>
    <ImageView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/header_drawer"
        android:src="@drawable/my_image" />
    <ListView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="end"
        android:id="@+id/list_view"
        android:entries="@array/pages" />

  </android.support.v4.widget.DrawerLayout>

MainActivity.java

 package com.playpersia.mycustomizedtoolbar;

import android.annotation.TargetApi;
import android.app.Activity;
import android.content.res.Configuration;
import android.os.Build;
import android.os.Bundle;
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.LayoutInflater;
import android.view.MenuItem;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.ImageView;
import android.widget.ListView;
import android.widget.Toast;
import java.util.zip.Inflater;

public class MainActivity extends AppCompatActivity implements  NavigationView.OnNavigationItemSelectedListener {
    private Toolbar toolbar;
    public ListView listView;
    public String[] pages;
    ArrayAdapter<String> arrayAdapter;
    public ImageView menu_icon;
    public ImageView  back_arrow;
    public boolean mSlideState;
    private DrawerLayout drawerLayout;
    public ActionBarDrawerToggle _mDrawerTg;
    @TargetApi(Build.VERSION_CODES.ICE_CREAM_SANDWICH)
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        toolbar = (Toolbar) findViewById(R.id.toolbar);
        menu_icon = (ImageView) findViewById(R.id.menu_icon);
        back_arrow = (ImageView) findViewById(R.id.back_button);
        drawerLayout =(DrawerLayout) findViewById(R.id.right_drawer);
        pages =getResources().getStringArray(R.array.pages);
        _mDrawerTg =new ActionBarDrawerToggle(this, drawerLayout,
                null, R.string.drawer_open, R.string.drawer_close){
            public void onDrawerClosed(View view){
                mSlideState=false;
            }
            public void onDrawerOpened (View drawerView){
                super.onDrawerOpened(drawerView);
                mSlideState=true;
            }        };

       listView = (ListView) findViewById(R.id.list_view);

        listView.setAdapter(new ArrayAdapter<String>(this,R.layout.drawer_list_item,pages));

        drawerLayout.setDrawerListener(_mDrawerTg);
        _mDrawerTg.syncState();
        menu_icon.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                if(mSlideState){
                    drawerLayout.closeDrawer(GravityCompat.END);
                }else{
                    drawerLayout.openDrawer(GravityCompat.END);                }            }        });    }


    @Override
    protected void onPostCreate(Bundle savedInstanceState) {
        super.onPostCreate(savedInstanceState);
        // Sync the toggle state after onRestoreInstanceState has occurred.
        _mDrawerTg.syncState();
    }

    @Override
    public void onConfigurationChanged(Configuration newConfig) {
        super.onConfigurationChanged(newConfig);
        _mDrawerTg.onConfigurationChanged(newConfig);
    }

    @Override
    public boolean onNavigationItemSelected(MenuItem item) {
        return false;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Pass the event to ActionBarDrawerToggle, if it returns
        // true, then it has handled the app icon touch event
        if (_mDrawerTg.onOptionsItemSelected(item)) {
            return true;
        }
        // Handle your other action bar items...

        return super.onOptionsItemSelected(item);
    }
}

UPDATE logcat:

01-18 12:34:25.386 29949-29949/com.playpersia.mycustomizedtoolbar  
E/AndroidRuntime: FATAL EXCEPTION: main Process:
com.playpersia.mycustomizedtoolbar, PID: 29949 java.lang.RuntimeException: 
Unable to start activityComponentInfo{com.playpersia.mycustomizedtoolbar/com.playpersia.mycustomizedtool   
 bar.MainActivity}: java.lang.NullPointerException: Attempt to invoke virtual
 method 'void android.widget.ListView.setAdapter(android.widget.ListAdapter)' on    a null object reference at 
android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2379
at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:2442)at
 android.app.ActivityThread.access$800(ActivityThread.java:156)at    android.app.ActivityThread$H.handleMessage(ActivityThread.java:1351)at
android.os.Handler.dispatchMessage(Handler.java:102)
at android.os.Looper.loop(Looper.java:211)
at android.app.ActivityThread.main(ActivityThread.java:5373)
at java.lang.reflect.Method.invoke(Native Method)
at java.lang.reflect.Method.invoke(Method.java:372)at   com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:1020)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:815)
Caused by: java.lang.NullPointerException: Attempt to invoke virtual method   'void android.widget.ListView.setAdapter(android.widget.ListAdapter)' on a null   object reference at com.playpersia.mycustomizedtoolbar.MainActivity.onCreate(MainActivity.java:53)
at android.app.Activity.performCreate(Activity.java:5990)
at    android.app.Instrumentation.callActivityOnCreate(Instrumentation.java:1106)
at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2332)
at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:2442) 
at android.app.ActivityThread.access$800(ActivityThread.java:156) 
at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1351) 
at android.os.Handler.dispatchMessage(Handler.java:102) 
at android.os.Looper.loop(Looper.java:211) 
at android.app.ActivityThread.main(ActivityThread.java:5373) 
at java.lang.reflect.Method.invoke(Native Method) 
at java.lang.reflect.Method.invoke(Method.java:372)at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:1020)
 at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:815)

UPDATE 2

now I have this toolbar when I click on the right side icon the drawer opens & closes, right side drawer

What do you mean by : **I've tried many things** how should we know these tries? :) Add your logcats also please. — ʍѳђઽ૯ท, Jan 17 '16 at 16:45
@LinX64 I added the logcat. I meant at first I used the Navigation Drawer Template in android studio but it didn't work, I think it was because I'm using a custom toolbar. then I used fragment instead if activity but it cased more complications for me. then again I made a BaseActivity, wrote the drawer code in it and made the MainActivity extends from it. but it didn't work too. — Hadis, Jan 18 '16 at 09:26
Now, it's better somehow, that problem is in the `ListView` as you can see, since you are using `AppCompatActivity`, you can simply use NavgiationDrawer.that is what docs says.and onething, if you wanna set a custom icon for that, check this : http://stackoverflow.com/a/29559002/4409113 better to use `NavigationDrawer` not with that listview. — ʍѳђઽ૯ท, Jan 18 '16 at 09:29

Rami · Accepted Answer · 2016-01-18T11:56:11.210

Caused by: java.lang.NullPointerException: Attempt to invoke virtual method 'void android.widget.ListView.setAdapter(android.widget.ListAdapter)' on a null object reference at com.playpersia.mycustomizedtoolbar.MainActivity.onCreate(MainActivity.java:53)

In onCreate method, your listView object is null.

You need to add

listView = (ListView) findViewById(R.id.list_view);

before

listView.setAdapter(new ArrayAdapter<String (this,R.layout.drawer_list_item,pages));

UPDATE:

Change your activity_main.xml to:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:orientation="vertical" 
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <include
        layout="@layout/toolbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/toolbar"/>

    <android.support.v4.widget.DrawerLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:openDrawer="end"
        android:fitsSystemWindows="true"
        android:id="@+id/right_drawer">

        <!-- Main layout -->
        <FrameLayout
            android:id="@+id/main_fragment_container"
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_below="@id/toolbar"
                android:text="Hello"/>

        </FrameLayout>

        <!-- Nav drawer -->
        <LinearLayout
            android:orientation="vertical"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_gravity="left|start" >

            <ImageView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:id="@+id/header_drawer"
                android:src="@drawable/my_image" />

            <ListView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_gravity="end"
                android:id="@+id/list_view"
                android:entries="@array/pages" />
        </LinearLayout>

    </android.support.v4.widget.DrawerLayout>

</LinearLayout>

OK, how can I instantiate it? and I'm not using any fragments, does it make a problem? — Hadis, Jan 18 '16 at 09:53
@Hadis Check my update. Also there is no need for *onCreateView()* method, you can comment/remove it. — Rami, Jan 18 '16 at 11:56
Thank you so much, it's much better now.I Updated my question & code. Now how can I delete the left side icon make the right side one open & close the drawer? you've been a great help so far. — Hadis, Jan 18 '16 at 16:05
You're welcome. Please, if you have another question/problem open a new thread, don't update the OP...to not confuse future users. — Rami, Jan 18 '16 at 16:43

ʍѳђઽ૯ท · Answer 2 · 2016-01-17T17:06:51.093

This should be your MainLayout since you are using DrawerLayout:

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/right_drawer"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

    <!-- Your contents, for example, CoordinatorLayout with material design -->

    <!-- And after main Contents, here you can use NavigationDrawer also -->

</android.support.v4.widget.DrawerLayout>

And instead of commented code, use your contents.

You did it in wrong way, Take a look:

http://developer.android.com/training/implementing-navigation/nav-drawer.html#DrawerLayout

To add a navigation drawer, declare your user interface with a DrawerLayout object as the root view of your layout. Inside the DrawerLayout, add one view that contains the main content for the screen (your primary layout when the drawer is hidden) and another view that contains the contents of the navigation drawer.

For example, the following layout uses a DrawerLayout with two child views: a FrameLayout to contain the main content (populated by a Fragment at runtime), and a ListView for the navigation drawer.

Example:

<android.support.v4.widget.DrawerLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <!-- The main content view -->
    <FrameLayout
        android:id="@+id/content_frame"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
    <!-- The navigation drawer -->
    <ListView android:id="@+id/left_drawer"
        android:layout_width="240dp"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:choiceMode="singleChoice"
        android:divider="@android:color/transparent"
        android:dividerHeight="0dp"
        android:background="#111"/>
</android.support.v4.widget.DrawerLayout>

You may want to take a look at the Material Design Guidelines for this implementation of course:

https://www.google.com/design/spec/patterns/navigation-drawer.html

Android- app crashes while adding a navigation drawer to a custom toolbar

2 Answers2