Navigation Drawer Not Properly Opening

Question

I added a navigation drawer to my toolbar and added the toolbar to my HomePage Activity. The Drawer seems to be working fine but only pulls out when I slide my finger below the hamburger icon. Otherwise, if I simply click on the icon nothing happens. Does anybody know why? I watched the following tutorial and ideally when the hamburger icon is clicked, the drawer should come out: https://www.youtube.com/watch?v=Lfc1q1dFB3E

Is there an onClick attribute that I'm missing? Here is my code:

public class HomePage extends AppCompatActivity implements View.OnClickListener {

private DrawerLayout drawerLayout;
private ListView drawerList;
private ActionBarDrawerToggle drawerToggle;
String[] drawerListItems;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_home_page);

    Toolbar myToolbar = (Toolbar) findViewById(R.id.toolBarHome);
    drawerLayout = (DrawerLayout)findViewById(R.id.homePageDrawer);
    drawerList = (ListView)findViewById(R.id.homePageList);
    drawerListItems = getResources().getStringArray(R.array.activities);
    drawerList.setAdapter(new ArrayAdapter<String>(this,android.R.layout.simple_list_item_1,drawerListItems));
    drawerList.setOnItemClickListener(new AdapterView.OnItemClickListener() {
        @Override
        public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
            switch (position) {
                case 0: {
                    Intent i = new Intent(HomePage.this, HomePage.class);
                    startActivity(i);
                    break;
                }
                case 1: {
                    Intent i = new Intent(HomePage.this, Allergy.class);
                    startActivity(i);
                    break;
                }

            }
            drawerLayout.closeDrawer(drawerList);
        }
    });
    drawerToggle = new ActionBarDrawerToggle(this,drawerLayout,myToolbar,R.string.drawer_open,R.string.drawer_close)
    {
        @Override
        public void onDrawerOpened(View drawerView) {
            super.onDrawerOpened(drawerView);
            invalidateOptionsMenu();
            syncState();
        }

        @Override
        public void onDrawerClosed(View drawerView) {
            super.onDrawerClosed(drawerView);
            invalidateOptionsMenu();
            syncState();
        }
    };
    drawerLayout.setDrawerListener(drawerToggle);
    setSupportActionBar(myToolbar);
    getSupportActionBar().setDisplayHomeAsUpEnabled(true);
    getSupportActionBar().setHomeButtonEnabled(true);
    drawerToggle.syncState();
}

@Override
protected void onPostCreate(Bundle savedInstanceState) {
    super.onPostCreate(savedInstanceState);
    drawerToggle.syncState();
}

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

@Override
public boolean onOptionsItemSelected(MenuItem item) {
    switch (item.getItemId()){
        case R.id.home:{
            if (drawerLayout.isDrawerOpen(drawerList)){
                drawerLayout.closeDrawer(drawerList);
            }else{
                drawerLayout.openDrawer(drawerList);
            }
            return true;
        }
        default:return super.onOptionsItemSelected(item);
    }
}

Here is the XML layout. I have one ImageView on my Homepage Activity. When the NavigationDrawer pulls out, I need it to cover the existing ImageView, so I placed it within a relative layout within my drawerlayout:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:background="@drawable/boardlayered"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">


    <android.support.v7.widget.Toolbar
    android:id="@+id/toolBarHome"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="?attr/colorPrimary">

   </android.support.v7.widget.Toolbar>

   <android.support.v4.widget.DrawerLayout
    android:id="@+id/homePageDrawer"
    android:layout_below="@+id/toolBarHome"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <ImageView
            android:id="@+id/dogPic"
            android:background="@drawable/happy_dog"
            android:layout_width="175dp"
            android:layout_height="200dp"
            android:layout_alignParentBottom="true"
            android:layout_marginLeft="20dp" />

    </RelativeLayout>


    <ListView
        android:id="@+id/homePageList"
        android:background="@android:color/white"
        android:layout_gravity="start"
        android:layout_width="305dp"
        android:layout_height="match_parent"></ListView>

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

Answer 1

Found it. The issue is in this piece of code, which is directly responsible for the hamburger icon to perform an action:

public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getItemId()){
    case R.id.home:{
        if (drawerLayout.isDrawerOpen(drawerList)){
            drawerLayout.closeDrawer(drawerList);
        }else{
            drawerLayout.openDrawer(drawerList);
        }
        return true;
    }
    default:return super.onOptionsItemSelected(item);
}}

Specifically

case R.id.home:

Should be

case android.R.id.home:

This latter case syntax is what works

Answer 2

I think the problem here is with the lines:

getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setHomeButtonEnabled(true);

It seems this will try to use your toggle button as an 'up' navigation button instead, if you're trying to use the hamburger button to open and close your drawer you can remove these lines.