I'd like to have an app layout as the one they used for Gmail. They have the actionbar that has icons (on my device it has the app logo for up navigation, and a custom view for selecting priority inbox/inbox/etc), but there is also some kind of split ActionBar because at the bottom I have several icons (compose, search, labels, etc).
How could I do this? I have implemented the following ActionBar through this XML:
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:id="#+id/menu_gps"
android:icon="#drawable/icone_gps_continu"
android:showAsAction="always"
android:title="#string/menu_gps"/>
<item
android:id="#+id/menu_sort"
android:icon="#drawable/icone_liste_chron"
android:showAsAction="always"
android:title="#string/menu_liste"/>
<item
android:id="#+id/menu_stats"
android:icon="#drawable/icone_statistiques"
android:showAsAction="always"
android:title="#string/menu_stats"/>
<item
android:id="#+id/menu_save"
android:icon="#drawable/icone_terminersortie"
android:showAsAction="always"
android:title="#string/menu_save"/>
<item
android:id="#+id/menu_search"
android:icon="#drawable/ic_launcher"
android:showAsAction="always"
android:title="#string/menu_search"/>
<item
android:id="#+id/menu_photo"
android:icon="#drawable/icone_enregistrerphoto"
android:showAsAction="always"
android:title="#string/menu_photo">
</item>
<item
android:id="#+id/menu_sound"
android:icon="#drawable/icone_enregistrerson"
android:showAsAction="always"
android:title="#string/menu_sound">
</item>
<item
android:id="#+id/menu_settings"
android:icon="#drawable/icone_parametres"
android:showAsAction="always"
android:title="#string/menu_settings">
</item>
</menu>
And I have of course enabled the split ActionBar by adding android:uiOptions="splitActionBarWhenNarrow" to my <application> tag in the manifest.
What I get though is an empty "top" ActionBar; and the bottom one is displaying only three icons. I thought I could display like 3-4 icons at the top and 5 at the bottom in portait mode, and all of them at the top in landscape mode.
Note: even if I'm testing on ICS with my Galaxy Nexus, I'm using ActionBarSherlock in order to provide backward compatibility.
Looks like I posted too fast, it seems it's not possible.
Duplicates:
How to Place ActionBar Items in Main ActionBar and Bottom Bar
Android Split Action Bar with Action Items on the top and bottom?
Apparently this is not possible. However they did it in gmail/gplus, maybe using a custom view for the bottom part... Still expecting a better answer to this!
Reto Meier's word on this:
I think the problem with splitting the actions between the top and bottom is that it would make it more difficult to perform actions. Actions should be the most important things to do on an Activity -- splitting them between the top and bottom of the screen means users need to look in two places rather than one.
I was also wondering how these apps had icons in both bars, so I decompiled two of them.
What I found is that these two apps didn't implement the ActionBar at all and use custom layouts for both bars. I'm not sure if I can name these apps here, but they are well known apps with 10M+ downloads.
I strongly suggest to go the same way if you don't like the default ActionBar (which have very little room for customization) and create custom layouts instead (not necessary for both bars, it depends on your needs).
It's quite easy to reproduce the split action bar layout. Its height is always 48dp whatever the device is, so a simple LinearLayout or RelativeLayout with a fixed height and some transparent image buttons work very vell. In only 15 minutes you get a fully customizable split action bar.
Related
I have an application without an appbar. Now I want to put 3 Buttons into a menu. I have seen the option to create a toolbar and then add the items programmaticlly. But first I would prefer not to have a bar but just the menu.
I know that that isn´t really important because I can make the bar transparent.
And Second I really don´t want to add the items programmatically. (But defigned in xml.) Is this possible, are there better ways and how can I do it?
If "By the menu" you mean, the overflow menu that exists in the app bar then you can not just the add the menu that way. The app bar or toolbar has to be there to contain that overflow menu. But for giving that sort of effect as you also mentioned you can have the toolbar transparent or you can look into the PopUpMenu, http://developer.android.com/guide/topics/ui/menus.html,
this way you can hide your app bar and can give a separate button which will call PopUpMenu, its going to give you same overflow menu effect.
Regarding your 2nd requirement of putting menu in xml, if i am getting it correct you can have your menu defined like this,
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:id="#+id/phone"
android:title="#string/phone"
android:icon="#drawable/phone"
android:showAsAction="ifRoom|withText"
/>
<item
android:id="#+id/computer"
android:title="#string/computer"
android:icon="#drawable/computer"
android:showAsAction="ifRoom|withText"
/>
</menu>
You need your CSS anymets revised.
Please consider this codings:
style {template.css}
I think you'll find those are the exact answer.
I'm trying to customize the background of my action bar items with a selector, to override what is shown when the button is pressed.
This was pretty easy with menu buttons (e.g., overflow icon), as you can style them with actionBarItemBackground .
Sadly this does not apply for the up/home/left indicator. I have unsuccessfully tried, in my styles.xml:
<item name="actionButtonStyle">;
<item name="actionBarStyle">;
<item name="toolbarStyle">;
None of the nested attributes seem to act on the home icon background. I also searched over android.R.attr and gave a look at this. Is there any way?
I would like to stay with the "up" indicator, without inflating a custom view. In that case, I would also have to inflate the title as well as custom views naturally appear at the end of the title. AND I would lose the burger-to-arrow animation, AND I would have to take care about margins and design guidelines (now managed by AppCompat), and some other bad thing on the way.
I thought about setting a Logo, but that would have some complications as well and I don't think I could change the background anyway.
I thought about Toolbar being a Layout, so I could put custom views in it from XML. If I'm not wrong they appear after the title, so neither this is a good idea.
What can I do?
please let me know if it works
add this to your your theme or if it doesn't take both remove the one with android prefix
<item name="android:selectableItemBackground">#drawable/selector</item>
<item name="selectableItemBackground">#drawable/selector</item>
Example #drawable/selector:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_pressed="true"
android:drawable="#ddffffff" />
<item
android:drawable="#android:color/transparent" />
</selector>
I'm making an android app in Eclipse. I want to place a text or icon in the action bar, but when I am writing in menu.xml, which looks like this:
<menu xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:id="#+id/createnew"
android:orderInCategory="1"
android:showAsAction="ifRoom"
android:title="CREATE"/>
</menu>
it puts it in the options menu. I want to separate it.
I see this in the app when I run it:
(sorry can't post pictures because I don't have enough rep)
I want to CREATE next to the option menu like this for example:
Since you are using the AppCompat Actionbar, you need to use a custom namespaced showAsAction attribute.
It should look something like this:
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:yourapp="http://schemas.android.com/apk/res-auto" >
<item
android:id="#+id/createnew"
android:orderInCategory="1"
yourapp:showAsAction="ifRoom"
android:title="CREATE"/>
</menu>
Note that this uses yourapp:showAsAction instead of android:showAsAction. This is because the showAsAction attribute is not available on pre-Honeycomb devices and is provided by the support library.
For more information, read the Action Bar developer guide.
It's caused by this line
android:showAsAction="ifRoom"
That tells Android to put it up there if it's going to fit nicely. If you want it up there no matter the fit use
android:showAsAction="always"
I have tried setting the:
android:showAsAction=".."
to every one of these:
ifRoom, never, withText, always, collapseActionView
but I always got the same result, which is not having any buttons on the action bar, so I have to press the 'menu' button.
Here is a picture of the menu now :
<item android:id="#+id/smth1"
android:title="#string/smth1"
android:showAsAction="always"
android:orderInCategory="1" />
I have even tried adding this:
android:uiOptions="splitActionBarWhenNarrow"
into application manifest file, but with no positive result (nothing changed).
I have tried running it on various kind of APIs (14, 16, 17, 19), but with the same result.
If my question seems to be unclear, here is a picture of a menu, which I would like to have:
Thanks for any help.
You need to use the compatibility namespace (see here)
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item android:id="#+id/menu_add_size"
android:title="#string/menu_add_item"
android:icon="#android:drawable/ic_menu_add"
app:showAsAction="always"/>
</menu>
Once you're using that you can use as many menu buttons as will fit. You're no longer limited to just two buttons + overflow showing.
You maybe just don't have enough space, you should first remove the title from your Activity by adding this to your onCreate method:
ActionBar actionBar = getActionBar();
actionBar.setDisplayShowTitleEnabled(false);
Then you can see here that the maximum number of icons you can display is directly linked to the width of your screen, on small phones you will only be able to see 2 icons in the ActionBar.
How do you manage Icons with ABS and Gingerbread? As you can see from the Screenshots, I have a menu item "Help", that sits in the action bar, when there's room for it. (when nothing is selected). The icon looks good so far. But when it moves into the options menu, I probably should use another icon for better visibility :)
How do you normally do that? Any ideas? This is my menu xml:
<menu xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:id="#+id/new_button"
android:showAsAction="always"
android:title="new"
android:icon="#drawable/content_new_calendar"/>
<item
android:id="#+id/share_button"
android:visible="false"
android:showAsAction="ifRoom"
android:title="share"
android:icon="#drawable/social_share"/>
<item
android:id="#+id/help_button"
android:showAsAction="ifRoom"
android:title="help"
android:icon="#drawable/action_help"/>
</menu>
I know how to create different menus for various api levels, etc. But here, the same phone is showing the icon in the action bar and in the options menu. The simplest solution is to set android:showAsAction="never", but from user reviews I learned, that the App is difficult to understand (especially the Widget-Part), so I would love to have the help menu visible. Any ideas?
P.S. I know that the App is ugly and unfinished. It's work in progress and will be polished :)
Try using the force overflow option like so:
<item name="absForceOverflow">true</item>