Toggle DrawerLayout With Title Only (NO App Icon)?

Question

I have an activity with a DrawerLayout. I can open the drawer two different ways...by swiping from the left area of the screen towards the right and by clicking the app title. I DO NOT have an app icon displayed, only a title. I've implemented this exactly as recommended by Google here: Creating a Navigation Drawer: Open and Close with the App Icon

Everything is functional as far as opening and closing the drawer itself. However, it does not display the standard DrawerLayout icon that is suppose to be used. Instead I get the regular up caret (looks like a less than sign).

As soon as I add the app icon back to the ActionBar it begins to work as expected. The Drawer layout icon displays and animates when the drawer is opened or closed. I've tried removing the app icon both in my styles XML file and programmatically.

Is there a way to get the DrawerLayout icon working WITHOUT the app icon???

UPDATE: I've found a work around, but it's a hack more so than a solution. I simply created a 1x1 pixel transparent PNG (blank.png) and set it as my app icon in my styles.xml file. Below is all relative code:

styles.xml

<style name="MyCustomTheme" parent="android:Theme.Holo.Light.DarkActionBar">
    <item name="android:actionBarStyle">@style/MyCustomActionBar</item>
    <item name="android:icon">@drawable/blank</item>
</style>

<style name="MyCustomActionBar" parent="@android:style/Widget.Holo.ActionBar">
    <item name="android:displayOptions">showHome|showTitle|homeAsUp</item>
</style>

MainActivity -> onCreate()

this.navDrawerToggle = new ActionBarDrawerToggle
(
    this,
    this.navDrawerLayout,
    R.drawable.icon_nav_drawer,
    R.string.nav_drawer_open,
    R.string.nav_drawer_closed
)
{
    public void onDrawerClosed(View view) {}
    public void onDrawerOpened(View drawerView) {}
};

MainActivity -> onPostCreate()

super.onPostCreate(savedInstanceState);
this.navDrawerToggle.syncState();

MainActivity -> onResume()

this.navDrawer.setOnItemClickListener(new DrawerItemClickListener());
this.navDrawerLayout.setDrawerListener(this.navDrawerToggle);

MainActivity -> onPause()

this.navDrawer.setOnItemClickListener(null);
this.navDrawerLayout.setDrawerListener(null);

MainActivity -> onConfigurationChanged(Configuration newConfig)

super.onConfigurationChanged(newConfig);
navDrawerToggle.onConfigurationChanged(newConfig);

MainActivity -> onOptionsItemSelected(MenuItem item)

if (this.navDrawerToggle.onOptionsItemSelected(item)) {return true;}
else
{
    // A bunch of item click handling happens here...

    return true;
}

As a side note, for next time, please add some code to know what you are working with. — velazcod, Jun 18 '13 at 16:17
See my update below. Using setDisplayOptions instead of trying to set them on the style fixes it. — velazcod, Jun 18 '13 at 19:28

velazcod · Answer 1 · 2013-06-18T19:05:22.247

13

I was curious about this so I tried it with the sample for the DrawerLayout and it worked fine. Also, it seems like you have to use your own drawer icon drawable, it's recommended anyways. You can download the default assets from this site Creating a Navigation Drawer and put them in their respective drawable resource folder.

Here's what worked for me:

ActionBar actionBar = getActionBar();

// Let's get rid of the app icon here
actionBar.setIcon(null);
actionBar.setTitle("App Name");

// Setting these 3 options allows us to show the title as well as a "Home" elements
// "Home" elements include the Up and/or Drawer icon. The DISPLAY_HOME_AS_UP will enable
// and show the Drawer icon, we'll be "replacing" the "up" button with the drawer icon below
actionBar.setDisplayOptions(ActionBar.DISPLAY_SHOW_TITLE 
        | ActionBar.DISPLAY_SHOW_HOME 
        | ActionBar.DISPLAY_HOME_AS_UP);

// Get a reference of the DrawerLayout
DrawerLayout drawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
drawerLayout.setDrawerListener(drawerToggle);

// Setting ActionBarDrawerToggle will allow you to set the drawables for the drawer
// (this will also give you the nice/smooth animation) as well as allow you to do some
// other things depending on the events: onDrawerClosed & onDrawerOpened.
ActionBarDrawerToggle drawerToggle = new ActionBarDrawerToggle(
          this,                   /* host Activity */
          drawerLayout,           /* DrawerLayout object */
          R.drawable.ic_drawer,   /* nav drawer image to replace 'Up' caret */
          R.string.drawer_open,   /* "open drawer" description for accessibility */
          R.string.drawer_closed  /* "close drawer" description for accessibility */
      ) {
    public void onDrawerClosed(View view) {
        actionBar.setTitle("Closed...");
        invalidateOptionsMenu(); // creates call to onPrepareOptionsMenu()
    }

    public void onDrawerOpened(View drawerView) {
        actionBar.setTitle("Open...");
        invalidateOptionsMenu(); // creates call to onPrepareOptionsMenu()
    }
};

// Set a listener to be notified of drawer events.
drawerLayout.setDrawerListener(drawerToggle);

UPDATE: It seems like the android:displayOptions on the ActionBar style are not being accounted for. Use actionBar.setDisplayOptions(int options) instead.

edited Jun 18 '13 at 19:05

answered Jun 18 '13 at 15:56

velazcod

1,014
1
11
17

1

What you've listed above is almost exactly what I've implemented except for two things. 1) I didn't use `actionbar.setIcon(null)`. Instead, I used `actionbar.setDisplayShowHomeEnabled(false)`. 2) I eventually scrapped changing the ActionBar programmatically and changed them in my styles.xml file instead, including the display options. I'm going to add the `actionbar.setIcon(null)` and see what happens... – Jabari Jun 18 '13 at 16:12
setDisplayShowHomeEnabled(false) is about the same as not having the option ActionBar.DISPLAY_SHOW_HOME. You need to either setDisplayShowHomeEnabled(true) or set the option. – velazcod Jun 18 '13 at 16:17
Still didn't work for me. Are you using ActionBarSherlock (I'm not). I'm also running 4.2.2. I had already removed `setDisplayShowHomeEnabled(false)`. I've found a temp solution...I simply created a 1x1 px transparent PNG and used it as my app icon (via the styles.xml file). It just feels like a hack. – Jabari Jun 18 '13 at 16:23
OP is updated with code. Also, there is a Google Developers Live Hangout tomorrow on the DrawLayout. I posted my issue in the comments and one of the Devs believes it may be a bug... – Jabari Jun 18 '13 at 17:30
http://i.imgur.com/CSlC5q7.png Get rid of the "android:displayOptions" in the Actionbar style and use actionBar.setDisplayOptions(ActionBar.DISPLAY_SHOW_TITLE | ActionBar.DISPLAY_SHOW_HOME | ActionBar.DISPLAY_HOME_AS_UP); – velazcod Jun 18 '13 at 18:57
Presto...it worked! I have no clue why it works programmatically and not via styles. The reason I prefer doing it in styles.xml is because there is no delay in loading when the app starts up. This way works, but when the app first loads I still see the icon for a brief moment. At any rate...I see you added an update, so I'm making this as the correct answer! – Jabari Jun 19 '13 at 06:23
One thing I do, is make the action bar on the theme hidden by default and then show it on the activity after setting my custom action bar layout. That way you don't see the action bar style flickering like that in the case you use a custom layout or no app icon on the action bar. However, I'm able to do this since I rely heavily on fragments and only have a few activities and I can handle this behavior with minimal effort and code reuse. Good luck. – velazcod Jun 19 '13 at 13:37
I don't get it...how does still using `ActionBar.DISPLAY_SHOW_HOME` not display the home icon? – Jason Robinson Oct 02 '13 at 23:16

score 0 · Answer 2 · answered Oct 03 '13 at 15:18

After setting the drawer toggle you need to call the following method:

 mDrawerToggle.syncState();

so your code would look like this:

 mDrawerToggle = new ActionBarDrawerToggle(
            this,                  /* host Activity */
            mDrawerLayout,         /* DrawerLayout object */
            R.drawable.ic_drawer,  /* nav drawer image to replace 'Up' caret */
            R.string.drawer_open,  /* "open drawer" description for accessibility */
            R.string.drawer_close  /* "close drawer" description for accessibility */
            ) {
        public void onDrawerClosed(View view) {
            actionBar.setTitle(mTitle);
            invalidateOptionsMenu(); // creates call to onPrepareOptionsMenu()
        }


        public void onDrawerOpened(View drawerView) {
            actionBar.setTitle("Preview Mode");
            invalidateOptionsMenu(); // creates call to onPrepareOptionsMenu()
        }
    };

    mDrawerToggle.syncState();
    mDrawerLayout.setDrawerListener(mDrawerToggle);

score 0 · Accepted Answer · answered Sep 17 '15 at 06:45

0

getActionBar().setIcon(android.R.color.transparent);

This worked for me..... ;)

answered Sep 17 '15 at 06:45

karan

3,319
1
35
44

Back when I posted this (a few versions of Android ago), that was one of the first things I tried. It worked functionally, but the icon still took up the same space. Is that not the case now? If not, I'll make this the new accepted answer after testing. – Jabari Sep 17 '15 at 22:07
which version you are talking about. I tested on 5.1 (lolipop) and 4.4.2 (kit kat) both working fine. – karan Sep 18 '15 at 05:59
This post is over 2 years old, and I was trying to stay backward compatible, so Ice Cream Sandwich and Gingerbread (I didn't care about Honecomb). Answer accepted! – Jabari Sep 18 '15 at 14:32

Toggle DrawerLayout With Title Only (NO App Icon)?

3 Answers3