Dnaso
Dnaso

Reputation: 1365

ActionBar with icon and text in portrait mode

I can't seem to get an image and text to work in portrait mode on menu items in the action bar no matter what I try. I even tried to force android portrait orientation

My XML:

 <item android:id="@+id/menu_save"
  android:icon="@drawable/content"
  android:orderInCategory="100"
  android:title="New Group"
 android:showAsAction="withText|always" />

Has anyone figured this out?

Upvotes: 7

Views: 1309

Answers (3)

Saul_programa
Saul_programa

Reputation: 351

The easiest way to do it is:

<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"   
tools:ignore="AppCompatResource">
<item
    android:id="@+id/action_nexo"
    android:title="title"
    app:actionLayout="@layout/custom_menu_item"
    app:showAsAction="always"/>

 </menu>

custom_menu_item.xml

<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="?attr/actionBarSize">
<TextView
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:gravity="center"
    android:text="@string/nexo_tile_short"
    android:clickable="true"
    android:focusable="true"
    android:textSize="@dimen/text_size_small"
    android:textStyle="bold"
    android:textColor="?attr/actionMenuTextColor"
    />
<ImageView
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:paddingTop="@dimen/padding_small"
    android:paddingBottom="@dimen/padding_small"
    android:src="@drawable/nexo"/>
 </LinearLayout>

Upvotes: 0

TTransmit
TTransmit

Reputation: 3350

Ahmad's answer makes clear why this is not possible. It is annoying that the action bar is not easier to customise.

One quick and dirty solution is to put two buttons in the menu, remove the icon from one and give the second a different name. Then in the corresponding java file, replicate the functionality for the extra button in onOptionsItemSelected. This gets over having to create a custom view for the action bar.

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:yourapp="http://schemas.android.com/apk/res-auto" >
    <item android:id="@+id/action_done"
          android:icon="@drawable/ic_done"
          android:title="@string/done"
          yourapp:showAsAction="always" />
    <item android:id="@+id/action_done2"
          android:title="@string/done"
          yourapp:showAsAction="always" />
    <item android:id="@+id/action_cancel"
          android:icon="@drawable/ic_cancel"
          android:title="@string/cancel"
          yourapp:showAsAction="always" />
    <item android:id="@+id/action_cancel2"
          android:title="@string/cancel"
          yourapp:showAsAction="always" />
</menu>

I also saw this answer but didn't try it: withText in split ActionBar #Google Calendar Method. This is how it is done in Google Calendar but also relies on a custom view replacing the action bar.

Upvotes: 0

Ahmad
Ahmad

Reputation: 72533

From the config.xml file of the native ActionBar:

values:

<bool name="config_allowActionMenuItemTextWithIcon">false</bool>

values-480dp:

<bool name="config_allowActionMenuItemTextWithIcon">true</bool>

To answer your question:

No you can't do that, if the devices width is smaller than 480dp. (Unless you want to create a custom rom with a modded framework)

Upvotes: 8

Related Questions