How to change android top toolbar menu item icon size

Question

How can I change the size of a menu item in the android toolbar? Currently the menus have a very small size and I want to increase the size. If anyone knows please help me to find a solution.

app_bar.xml

  <?xml version="1.0" encoding="utf-8"?>
   <android.support.v7.widget.Toolbar
   xmlns:android="http://schemas.android.com/apk/res/android"
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
   android:background="@color/primaryColor"
   android:minHeight="?attr/actionBarSize"
   android:paddingTop="@dimen/app_bar_top_padding"
   android:theme="@style/ToolBarStyle"/>

Styles.xml

<resources xmlns:android="http://schemas.android.com/apk/res/android">
<style name="AppTheme" parent="AppTheme.Base"> </style>
<!-- Application theme. -->
<style name="AppTheme.Base" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="colorPrimary">@color/primaryColor</item>
    <item name="colorPrimaryDark">@color/primaryColorDark</item>
    <item name="colorAccent">@color/accentColor</item>
    <item name="colorControlHighlight">@color/primary_high_light</item>
    <!-- <item name="textColorPrimary">@color/ColorPrimaryText</item> -->
</style>

<style name="ToolBarStyle" parent="ThemeOverlay.AppCompat.Dark">
    <item name="android:textColorPrimary">#ffffff</item>

</style>
<style name="option" parent="Theme.AppCompat.Light">
</style>
<style name="Dialog" parent="Base.Theme.AppCompat.Light.Dialog">
</style>

menu_option.xml

<?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/homes"
    android:title="homes"
    android:icon="@drawable/ic_action_home1"
    app:showAsAction="always"/>

<item android:id="@+id/profilepreview"
    android:title="ProfilePreview"
    android:icon="@drawable/profile"
    app:showAsAction="always"/>

<item android:id="@+id/findPeople"
    android:title="findPeople"
    android:icon="@drawable/ic_action_search1"
    app:showAsAction="always"/>

<item android:id="@+id/log"
    android:title="log"
    android:icon="@drawable/ic_action_logout1"
    app:showAsAction="always"/>

</menu>

MainActivity.java

public boolean onCreateOptionsMenu(Menu menu) {
    MenuInflater inflater = getMenuInflater();
    inflater.inflate(R.menu.menu_option, menu);
    return true;
}

@Override
public boolean onOptionsItemSelected(MenuItem item) {
    switch (item.getItemId()) {

            case R.id.profilepreview:
            startActivity(new Intent(this, ProfilePreview.class));
            return true;

            case R.id.homes:
            mFragment = new HomeFragment();
            break;

            case R.id.findPeople:
            mFragment = new FindFriendsFragment();
            break;

            case R.id.log:
            M.logOut(this);
            mIntent = new Intent(this, LoginActivity.class);
            finish();

    }

    if (mFragment != null && mIntent == null) {
        mFragmentManager = getFragmentManager();
        mFragmentManager.beginTransaction()
                .replace(R.id.frameContainer, mFragment).commit();
    } else {
        startActivity(mIntent);
        mIntent = null;
    }return super.onOptionsItemSelected(item);
    }

Subversive

android4devs.com/2014/12/how-to-make-material-design-app.html – Plainspoken

i did try that tutorial, but there are no any option for change size of that menu icons – Subversive

@PrinsPrem I've the same issue with icon size inside toolbar. Want to know if you find any solution to this matter? Thanks in advance. – Duffy

Any solutions? I am running into this as well – Felty

This can be set in onCreateOptionsMenu. Refer to my answer here – Gearing

Answer 1

You may design a custom layout and add it as your actionlayout. ALso make sure you do not add any icon in menu.xml file.

<item android:id="@+id/homes"
android:title="homes"
app:actionLayout="@layout/your_custom_layout"
app:showAsAction="always"/>

Then give min_height in your custom layout.

Browning

Answer 2

I ran into this problem too and the only workaround I was able to have was to use smaller images. A size of 24dp from the icons here (https://design.google.com/icons) fits nicely into my toolbar.

Emelinaemeline

Answer 3

I suggest you to read this blog for custom toolbar.

https://stablekernel.com/using-custom-views-as-menu-items/

instead of adding drawable_icon to your menu-xml file, you can use "app:actionLayout" in that menu-xml file to specify the other xml-file(where you are going to create custom toolbar icon).

Unifoliolate

Answer 4

Just increase the size of the vector image(in the right) from the default 24x24 to a different size but after a certain size it won't scale up. The size might seem odd if it is put beside a view inflated(with orange background in the left) in the custom toolbar as shown in the image, only way to fix this is to inflate another view in the toolbar with the vector as the background.

Leman