Reduce space between menu items

Viewed 6909

I have the following menu:

<menu xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:android="http://schemas.android.com/apk/res/android">


    <item
        android:title="@string/search_title"
        android:id="@+id/action_search_music"
        android:icon="@drawable/ic_add_final"

        app:actionViewClass="android.support.v7.widget.SearchView"
        app:showAsAction="ifRoom|collapseActionView" />

    <item
        android:id="@+id/more_options"
        android:title="Rename playlist"
        android:orderInCategory="101"
        app:showAsAction="always"
        android:icon="@drawable/ic_more_vert_black_24dp">

        <menu >
            <item android:id="@+id/rename_playlist"
                android:title="Rename playlist"
                >
            </item>
            <item android:id = "@+id/action_delete_playlist"
                android:title="Delete playlist"/>

        </menu>
    </item>
</menu>

Now, there is a pretty big space between the two menu items that I am unable to reduce. Are there any ideas how to reduce that space?

EDIT: The answer here: https://stackoverflow.com/a/10085862/6427401 doesn't work for me

7 Answers

Add this to your app theme.

 <item name="android:actionButtonStyle">@style/ActionButtonStyle</item>

where ActionButtonStyle is

<style name="ActionButtonStyle" parent="Widget.AppCompat.ActionButton">
        <item name="android:minWidth">0dip</item>
        <item name="android:paddingStart">8dip</item>
        <item name="android:paddingEnd">8dip</item>
    </style>

First I suggest you look at your icons images, perhaps they have some transparent padding. In addition, you can manipulate the menu using the Activity onPrepareOptionsMenu(final Menu menu) function.

For example, you can make changes to the icon:

@Override
public boolean onPrepareOptionsMenu(final Menu menu) {
    final MenuItem menuItem = menu.getItem(position);
    Drawable icon = menuItem.getIcon();
    menuItem.setIcon(doSomething(icon));
    return super.onPrepareOptionsMenu(menu);
}

Alternatively, you can use a custom actionViewClass, either in XML or like below:

menuItem.setActionView(yourView);

Add next line in your styles.xml

<item name="listPreferredItemPaddingLeft">5dp</item> 

In your project dimens.xml add this line:

 <dimen name="design_navigation_separator_vertical_padding">0dp</dimen>

Try by making a custom view for your action bar. First create make the custom_actionbar.xml(layout).

    ActionBar mActionBar = getSupportActionBar();
    mActionBar.setDisplayShowHomeEnabled(false);
    mActionBar.setDisplayShowTitleEnabled(false);
    LayoutInflater mInflater = LayoutInflater.from(this);

    View mCustomView = mInflater.inflate(R.layout.custom_actionbar, null);
           // Bind view like this
           // TextView mTitleTextView = (TextView) mCustomView.findViewById(R.id.title_text);
            //mTitleTextView.setText("My Own Title");

    mActionBar.setCustomView(mCustomView);
    mActionBar.setDisplayShowCustomEnabled(true);

Note :- Using Toolbar can make customization more easy.

Hope it hepls.

I have tried all the question but not every single answer solved my issue. This helped me solved my issue.

First of all, Go to styles.xml file and place below add inside TAG

<style name="NavigationTheme" parent="AppTheme">
    <item name="android:textSize">16sp</item>
    <item name="android:layout_marginBottom">-5dp</item> </style>

Next, Place below code inside your XML class(In my case it is activity_main.xml) portion.

android:theme="@style/NavigationTheme"

Just like below image

enter image description here

for me, I wanted to decrease the width of the items. th it was this combination:

<style name="ActionButton" parent="@android:style/Widget.ActionButton">
    <item name="android:drawablePadding">5dp</item>
    <item name="android:minWidth">0dip</item>
</style>
Related