How to set MenuItem text instead of icon in toolbar

Question

I am trying to set text at the end of menu as menuItem but I ve tried app:showAsAction="always|withText" in for menu item but the text is not displaying to its full length infact its getting congested.

Code:

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <item
        app:itemIconTint="@color/white"
        android:id="@+id/next_btn"
        android:title="@string/next"
        app:showAsAction="always|withText"
        />
</menu>

Toolbar:

<android.support.v7.widget.Toolbar

    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/colorPrimary"
    app:popupTheme="@style/AppTheme.PopupOverlay">
    <LinearLayout
        android:layout_centerInParent="true"
        android:orientation="vertical"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        >
        <TextView
            android:textSize="18sp"
            android:layout_gravity="center_horizontal"
            android:textColor="@color/white"
            android:text="@string/recomended"
            android:id="@+id/title_main"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
        <TextView
            android:layout_gravity="center_horizontal"

            android:textColor="@color/white"
            android:textSize="9sp"
            android:text="@string/choose_your_friends"
            android:id="@+id/title_secondary"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />

    </LinearLayout>


</android.support.v7.widget.Toolbar>


toolbar.inflateMenu(R.menu.next_menu);
  @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        getMenuInflater().inflate(R.menu.next_menu, menu);
        return true;
    }

if you have only one item, I would suggest to add button to Toolbar and use it to handle user events. — karan, Nov 05 '18 at 05:57
ive tried it but adding a button disturbs the layout as it should be at end it have make a relative layout which disturbs the title in center — mr debug, Nov 05 '18 at 05:58
Check [this](https://stackoverflow.com/questions/26511981/toolbar-inflatemenu-seems-to-do-nothing) — Rajen Raiyarela, Nov 05 '18 at 06:02
@RajenRaiyarela this is not the solution of my problem I am inflating the menu and its clickable events are called as well but the issue is I am unable to stretch he text of menu item — mr debug, Nov 05 '18 at 06:08
refer this https://stackoverflow.com/questions/32969172/how-to-display-menu-item-with-icon-and-text-in-appcompatactivity?answertab=votes#tab-top — , Nov 05 '18 at 06:10
@mrdebug are you trying to inflate menu in the toolbar on pre-lollipop devices? If yes it won't work as per the link i shared. You need to inflate using the onCreateOptionMenu in Activity. As per my knowledge, if we do not provide icon (as it is in your case), irrespective of `app:showAsAction` value, it will display Text only. — Rajen Raiyarela, Nov 05 '18 at 06:20
@RajenRaiyarela I am using onCreateOptionsMenu to inflate it and there is no icon i think the width of menu item is restricted — mr debug, Nov 05 '18 at 06:22
@mrdebug as per your code you are using `toolbar.inflateMenu` what i m saying is activity's `onCreateOptionsMenu` — Rajen Raiyarela, Nov 05 '18 at 06:24
I found the solution it was my theme I was having a restricted size for menu item — mr debug, Nov 05 '18 at 06:24
@mrdebug, please, add your solution. What is a restricted size? — CoolMind, Nov 23 '18 at 08:03
See https://stackoverflow.com/questions/12000562/how-to-display-both-icon-and-title-of-action-inside-actionbar. — CoolMind, Nov 23 '18 at 08:43

CoolMind · Accepted Answer · 2020-04-21T12:57:22.723

Remove an icon from menu item and set app:showAsAction="always" to show text:

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    >

    <item
        android:id="@+id/action_edit"
        android:title="@string/edit"
        app:showAsAction="always"
        />
</menu>

If nothing appears, probably a white text is drawn on white background and you can override text color. Add these lines in your AppTheme style:

<item name="actionMenuTextColor">@color/gray</item>
<item name="android:actionMenuTextColor">@color/gray</item>

If this doesn't help, see variants in How to display both icon and title of action inside ActionBar?.

score 0 · Answer 2 · answered Nov 05 '18 at 09:03

It works for me, in my ToolBar I see action button only text "today", without icon:

<menu
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <item
        android:id="@+id/action_иет"
        android:orderInCategory="200"
        android:title="today"
        app:showAsAction="ifRoom" />
</menu>

try without withText, only ifRoom:

app:showAsAction="ifRoom"

score 0 · Answer 3 · edited Jan 28 '21 at 08:20

0

This works on me Programmatically

MenuItem menuitem1 = menu.add(Menu.NONE, 0, Menu.NONE, "logout");

menuitem1.setShowAsAction(MenuItem.SHOW_AS_ACTION_IF_ROOM);

edited Jan 28 '21 at 08:20

Poul Bak

10,450
5
32
57

answered Jan 28 '21 at 01:17

RJA programer

19
3

How to set MenuItem text instead of icon in toolbar

3 Answers3