How to Customize the Style of the Overflow Menu of the Toolbar

Photo by Croissant on Unsplash

In this post, we are going to learn how we can customize the style of the overflow menu of the toolbar.

Creating Style

First of all, let’s create a style for our overflow menu. Here, I am going to create a style named CustomPopupMenuStyle and add some basic attributes related to altering the text style.

Adding style to the toolbar

Now, as our style has been created let’s add it to our toolbar.

To change the theme of the overflow menu in the toolbar, we should provide our style to the app:popupTheme attribute of the toolbar.

Result

Before applying style (Default Style)

After applying style (CustomPopupMenuStyle)

As we can see, the properties have been applied to the overflow menu.

Conclusion

This way we can customize the overflow menu of the toolbar.

Bonus

As you might have noticed, after applying the style the overflow menu has some extra spaces between the items. For reducing it we can simply use the attribute.

android:listPreferredItemHeightSmall

After trying out some values for the property, I am going to set the android:listPreferredItemHeightSmall value to 32dp.

Result after adding linePreferredItemHeightSmall

Now, our overflow menu seems better.

If you want to learn more about listPreferredItemHeightSmall you can find it here. Also, if you are curious about other attributes then you can find it here.

Thank you for reading! Happy coding :)