Change Icon Of Navigation Drawer

Asked 10/4, 2015 at 9:49 Answered 11/3, 2019 at 14:15

Solved android android-actionbar android-drawable android-navigation android-actionbaractivity

I am having trouble with changing my navigation drawer icon to a custom one. I've currently had to implement the standard drawer icon which has 3 horizontal lines on top, but now I want to replace this with my custom drawer icon.

This is how my mDrawerToggle is at the moment:

mDrawerToggle=new ActionBarDrawerToggle(this,
    mDrawerLayout,
    R.drawable.app_icon,
    R.string.drawer_open) {
        // My code
    };

Catholicon answered 10/4, 2015 at 9:49 Comment(4)

Is the above how you are going about it currently? – Clarey 10/4, 2015 at 9:52

yeh right @FarbodSalamat-Zadeh – Catholicon 10/4, 2015 at 9:53

try set homeAsUpIndicator() with icon. – Iatrochemistry 10/4, 2015 at 9:58

@Harry i had tried that too...mDrawerToggle.setHomeAsUpIndicator(R.drawable.app_icon); – Catholicon 10/4, 2015 at 10:3

Here is the sample code taken from Creating a Navigation Drawer

Activity.class

public class MainActivity extends Activity {
    private DrawerLayout mDrawerLayout;
    private ActionBarDrawerToggle mDrawerToggle;
    ...

    public void onCreate(Bundle savedInstanceState) {
        ...

        mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
        mDrawerToggle = new ActionBarDrawerToggle(
                this,                  /* host Activity */
                mDrawerLayout,         /* DrawerLayout object */
                R.drawable.ic_drawer,  /* nav drawer icon to replace 'Up' caret */
                R.string.drawer_open,  /* "open drawer" description */
                R.string.drawer_close  /* "close drawer" description */
                ) {

            /** Called when a drawer has settled in a completely closed state. */
            public void onDrawerClosed(View view) {
                super.onDrawerClosed(view);
                getActionBar().setTitle(mTitle);
            }

            /** Called when a drawer has settled in a completely open state. */
            public void onDrawerOpened(View drawerView) {
                super.onDrawerOpened(drawerView);
                getActionBar().setTitle(mDrawerTitle);
            }
        };

        // Set the drawer toggle as the DrawerListener
        mDrawerLayout.setDrawerListener(mDrawerToggle);

        getActionBar().setDisplayHomeAsUpEnabled(true);
        getActionBar().setHomeButtonEnabled(true);
    }

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

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

    @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 (mDrawerToggle.onOptionsItemSelected(item)) {
          return true;
        }
        // Handle your other action bar items...

        return super.onOptionsItemSelected(item);
    }

    ...
}

Rad answered 10/4, 2015 at 10:22 Comment(11)

Yar @Tarun jain i had done same thing ...what is my problem check that... i know constructor of mdrawertoogle – Catholicon 10/4, 2015 at 10:25

@Catholicon Did u added the following code..

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

– Rad 10/4, 2015 at 10:26

i had override both the method ....look at my pics my icon is displayed but when i wanna change ..it dosent change – Catholicon 10/4, 2015 at 10:30

if i add R.String.drawer_close then it gives me error change construcitr or change ic_drawer to toolbar..any soln – Catholicon 10/4, 2015 at 10:59

Can u check the import whether it is using V4 support library or not – Rad 10/4, 2015 at 11:41

...yeh it is imported from b4 library – Catholicon 10/4, 2015 at 12:5

Check if you have added dependencies in build.gradle file or not if you are using Android Studio. In Eclipse check the android support library. You should not add both V4 and V7 library. – Rad 10/4, 2015 at 12:14

i had done it already ..i had accepted ur ans ..now give me upvote @tarun Tak – Catholicon 10/4, 2015 at 12:47

Let us continue this discussion in chat. – Catholicon 10/4, 2015 at 12:47

This CTOR doesn't exist. Only similar thing is having DrawerArrowDrawable instead of the drawable resource – Malvie 6/12, 2017 at 14:48

NOT WORKING NOW – Tricyclic 18/8, 2020 at 10:42

Use below code,it's working for V7 ActionBarDrawerToggle

mDrawerToggle.setDrawerIndicatorEnabled(false);

mDrawerToggle.setHomeAsUpIndicator(R.drawable.your_custom_icon);
 mDrawerToggle.setToolbarNavigationClickListener(new View.OnClickListener() {
@Override
 public void onClick(View v) {
     if (mDrawerLayout.isDrawerVisible(GravityCompat.START)) {
          mDrawerLayout.closeDrawer(GravityCompat.START);
     } else {
         mDrawerLayout.openDrawer(GravityCompat.START);
    }
}
});

Calcariferous answered 4/3, 2016 at 9:41 Comment(3)

Suggestion: You can use the Drawable resource id for setting an image file as a Navigation Drawer Icon. Example: mDrawerToggle.setHomeAsUpIndicator(R.drawable.ic_navigation_home_icon); Hence, no need of using the below code: Drawable drawable = ResourcesCompat.getDrawable(getResources(), R.drawable.your_custom_icon, getActivity().getTheme()); – Gatias 10/10, 2016 at 8:42

This was the best option for me. Setting the icon explicitly, rather than letting Android figure out whether to show a menu icon or back icon, is a lot more consistent for my app. – Parsons 29/9, 2017 at 5:19

Why doesn't the icon auto-resize. When I use a 512*512 icon, It takes up the entire ActionBar. – Lefthanded 2/3, 2019 at 1:31

Here is the sample code taken from Creating a Navigation Drawer

Activity.class

public class MainActivity extends Activity {
    private DrawerLayout mDrawerLayout;
    private ActionBarDrawerToggle mDrawerToggle;
    ...

    public void onCreate(Bundle savedInstanceState) {
        ...

        mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
        mDrawerToggle = new ActionBarDrawerToggle(
                this,                  /* host Activity */
                mDrawerLayout,         /* DrawerLayout object */
                R.drawable.ic_drawer,  /* nav drawer icon to replace 'Up' caret */
                R.string.drawer_open,  /* "open drawer" description */
                R.string.drawer_close  /* "close drawer" description */
                ) {

            /** Called when a drawer has settled in a completely closed state. */
            public void onDrawerClosed(View view) {
                super.onDrawerClosed(view);
                getActionBar().setTitle(mTitle);
            }

            /** Called when a drawer has settled in a completely open state. */
            public void onDrawerOpened(View drawerView) {
                super.onDrawerOpened(drawerView);
                getActionBar().setTitle(mDrawerTitle);
            }
        };

        // Set the drawer toggle as the DrawerListener
        mDrawerLayout.setDrawerListener(mDrawerToggle);

        getActionBar().setDisplayHomeAsUpEnabled(true);
        getActionBar().setHomeButtonEnabled(true);
    }

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

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

    @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 (mDrawerToggle.onOptionsItemSelected(item)) {
          return true;
        }
        // Handle your other action bar items...

        return super.onOptionsItemSelected(item);
    }

    ...
}

Rad answered 10/4, 2015 at 10:22 Comment(11)

Yar @Tarun jain i had done same thing ...what is my problem check that... i know constructor of mdrawertoogle – Catholicon 10/4, 2015 at 10:25

@Catholicon Did u added the following code..

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

– Rad 10/4, 2015 at 10:26

i had override both the method ....look at my pics my icon is displayed but when i wanna change ..it dosent change – Catholicon 10/4, 2015 at 10:30

if i add R.String.drawer_close then it gives me error change construcitr or change ic_drawer to toolbar..any soln – Catholicon 10/4, 2015 at 10:59

Can u check the import whether it is using V4 support library or not – Rad 10/4, 2015 at 11:41

...yeh it is imported from b4 library – Catholicon 10/4, 2015 at 12:5

i had done it already ..i had accepted ur ans ..now give me upvote @tarun Tak – Catholicon 10/4, 2015 at 12:47

Let us continue this discussion in chat. – Catholicon 10/4, 2015 at 12:47

This CTOR doesn't exist. Only similar thing is having DrawerArrowDrawable instead of the drawable resource – Malvie 6/12, 2017 at 14:48

NOT WORKING NOW – Tricyclic 18/8, 2020 at 10:42

This is main activity

final 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);


        toggle.setDrawerIndicatorEnabled(false);

        toggle.setToolbarNavigationClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                drawer.openDrawer(GravityCompat.START);
            }
        });

        toggle.setHomeAsUpIndicator(R.drawable.menuicon);

Dibri answered 11/3, 2019 at 14:15 Comment(0)

You could use this format for your mDrawerToggle:

mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout,
    R.drawable.CUSTOM_ICON, // Navigation menu toggle icon
    R.string.DRAWER_OPEN, // Navigation drawer open description
    R.string.DRAWER_CLOSE // Navigation drawer close description
    )

Change your drawable and make sure it is the same name as the one in the code.

Clarey answered 10/4, 2015 at 9:59 Comment(1)

This CTOR doesn't exist. Only similar thing is having DrawerArrowDrawable instead of the drawable resource – Malvie 6/12, 2017 at 14:48

This is the main layout file

<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" >

    <!-- Framelayout to display Fragments -->

    <FrameLayout
        android:id="@+id/frame_container"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <!-- Listview to display slider menu -->

    <ListView
        android:id="@+id/list_slidermenu"
        android:layout_width="240dp"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:background="@color/white"
        android:choiceMode="singleChoice"
        android:divider="@color/black"
        android:dividerHeight="1dp" />

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

This is the main Activity

DrawerLayout mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
ActionBarDrawerToggle mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout,
                R.drawable.menuicon, // nav menu toggle icon
                R.string.app_name, // nav drawer open - description for
                                    // accessibility
                R.string.app_name // nav drawer close - description for
                                    // accessibility
        ) {
            public void onDrawerClosed(View view) {
                // getActionBar().setTitle(mTitle);
                // calling onPrepareOptionsMenu() to show action bar icons
                invalidateOptionsMenu();
            }

            public void onDrawerOpened(View drawerView) {
                // getActionBar().setTitle(mDrawerTitle);
                // calling onPrepareOptionsMenu() to hide action bar icons
                invalidateOptionsMenu();
            }
        };
        mDrawerLayout.setDrawerListener(mDrawerToggle);

finally at R.drawable.menuicon(you can give your image id) it will work.

Canyon answered 10/4, 2015 at 10:24 Comment(8)

whenever i want to change my icon with ur code it give me error of change app-icon to toolbar...can u tell me which file extension you used – Catholicon 10/4, 2015 at 10:28

for image i have used png image but any extension image will work – Canyon 10/4, 2015 at 10:36

if i follow ur code @Allu it gives me error constructor is undefined – Catholicon 10/4, 2015 at 10:40

see this link i have followed this link it works for me just check total code once in this link if possible androidhive.info/2013/11/… – Canyon 10/4, 2015 at 10:42

if i follow ur code it gives me error no constructor match for mdrawertoogle – Catholicon 10/4, 2015 at 10:49

r u using actionbar or toolbar – Canyon 10/4, 2015 at 10:54

Let us continue this discussion in chat. – Canyon 10/4, 2015 at 10:55

see my solution in chat – Canyon 10/4, 2015 at 11:14

Hot tags

Godot Unity Godot Help Programming Godot 4.X GUI GDScript 3D 2D Physics CSharp Godot 3.X VR XR Projects C++

Recommended topics

Hot tags