In my Android activity I've attempted to add a menu icon to a toolbar thus:
toolbar.inflateMenu(R.menu.toolbar_menu)
The menu is defined using an Android vector drawable:
<menu xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="@+id/toolbar_menu"
android:icon="@drawable/menu"
android:title="Menu"
app:showAsAction="always"
/>
</menu>
The drawable:
<!-- drawable/menu.xml -->
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:height="24dp"
android:width="24dp"
android:viewportWidth="24"
android:viewportHeight="24">
<path android:fillColor="#000" android:pathData="M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z" />
</vector>
But in the emulator (Nexus 5X on the left, Nexus 10 on the right) the menu icon doesn't autoscale as I would expect:
This occurs under API 21 and API 26.
I thought using vector drawables was supposed to lead to auto-scaled images, but it's clearly not occurring here. How can I get this menu to scale properly without resorting to per-resolution raster images?