android:showAsAction ifRoom - why in overflow if enough room is available ?

[Davy De Waele]

I have a (split) ActionBar that contains 6 menu items. 

When all 6 menu items have the android:showAsAction="always" attribute defined

• all 6 are displayed and fit nicely on my Galaxy Nexus in both landscape and portrait without overflow.
  

http://dl.dropbox.com/u/13246619/Random%20stuff/Screen%20Shot%202012-04-10%20at%2009.39.12.png

If I define the first 4 with android:showAsAction="always" and the last 2 menu items with android:showAsAction="ifRoom" , I noticed that 

• 2 end up in the overflow menu when in landscape (here I have 4 menu items + overflow icon that holds the 5th and 6th one)
  
• 1 ends up in the overflow menu when in portrait (here I have 5 menu items + overflow icon that holds the 6th one)

http://dl.dropbox.com/u/13246619/Random%20stuff/Screen%20Shot%202012-04-10%20at%2009.39.18.png

Both in landscape and in portrait I see that there is enough room available to show all 6 items without overflow.

How exactly should the ifRoom value be interpreted ? As the first configuration shows that all 6 can fit on the actionbar, shouldn't the second configuration also place them on the actionbar without overflow on the same device ?

[Jake Wharton]

When contained within the action bar there is a finite maximum of action items based on the device's density-independent width. The action items can also not cover more than half the width of the action bar.

When in a split action bar the items can obviously span the entire width so a maximum of 5 items is imposed and the measurements is used to determine how many actually get displayed.

By having that many items forced as "always" you can override this behavior but you must be conscious of not cluttering up your UI. I highly recommend the "Action buttons" section on the Action Bar patterns page.

---
Jake Wharton
http://about.me/jakewharton

[Davy De Waele]

Hi Jake,

Apologies for all the stupid questions, I'm only in my second day of action bar usage and trying to grasp the behavior on 4 different devices here :)

Am I correct in saying that by putting android:showAsAction="ifRoom" on all menu items you basically let the system decide how the icons should be placed on the actionBar, taking these guidelines into account ?

I noticed for example that the Google Maps application on my Galaxy Nexus renders its icons correctly on the action bar, according to the Action Bar patterns page. (both 0000= in landscape and portrait).

In my app, when putting all icons on android:showAsAction="ifRoom" (and using the ForceOverflow theme to get the overflow on older devices and 
android:uiOptions="splitActionBarWhenNarrow" to get the optional bottom bar ) I get :

• On a Galaxy Nexus (4.0.4), 00000= on bottom bar in portrait and 000= in top bar in landscape
  
• On a Galaxy S (2.3.3), 0000= on bottom bar in portrait and 000= in top bar in landscape
  
• On a Galaxy Mini (2.3.4) , 0000= on bottom bar in portrait and 000000 in bottom bar in landscape (This is actually the only time I saw a bottom action bar in landscape mode on a device but I guess that's normal on a very low res device)
• On a 10 inch tablet (4.0.3) 0000= on top bar in both portrait and landscape
  

The thing that puzzles me is 

• why the Galaxy Nexus is showing 000= in the top bar in landscape where the guidelines say it should be 0000= (there is plenty of room for the additional icon).
  
• why the galaxy nexus is showing 00000= in the bottom bar (overflow icon and the one icon behind the overflow are the same size) 
  

I couldn't find any more info on how action buttons are placed on a bottom action bar besides this : Action buttons on bottom action bars can use the entire width.  The guideline page also shows 2 screenshots of a bottom bar, one showing 0000= and another showing 00000=

The detailed table in the Action Bar patterns page only covers the placement on the top action bar I guess. I didn't see any additional device specific rules for icon placement on the bottom bar. 

Overall, I'm ok with how the icons are placed on the different devices when using ifRoom on all items, even though they don't seem to respect the guidelines 100%. It's a major improvement on what I currently have. Just would like to understand why it's behaving in a certain way.

Regards,

Davy

On Tuesday, April 10, 2012 9:55:14 AM UTC+2, Jake Wharton wrote:

When contained within the action bar there is a finite maximum of action items based on the device's density-independent width. The action items can also not cover more than half the width of the action bar.

When in a split action bar the items can obviously span the entire width so a maximum of 5 items is imposed and the measurements is used to determine how many actually get displayed.

By having that many items forced as "always" you can override this behavior but you must be conscious of not cluttering up your UI. I highly recommend the "Action buttons" section on the Action Bar patterns page.

---
Jake Wharton
http://about.me/jakewharton

[Jake Wharton]

The variance between phones is due to the different resolutions and densities of the screens. The number of action items allowed is determined based on measuring the width of the device in DP (logic is here). The actual filtering of what gets displayed on the action bar is here. As you'll see, there is a lot of things that go in to this decision.

The best thing to take away is that you should account for two to five action items being displayed and refrain from using the "always" flag as much as possible.

---
Jake Wharton
http://about.me/jakewharton