BottomAppBar Menu

En esta ultima parte veremos como crear Menu items para nuestro BottomAppBar. Estos items de menu nos pueden servir para poner distintas acciones que querramos que nuestros usuarios utilizen a la hora de usar nuestra app.

Lo primero que vamos a hacer es crear nuestro menu, para eso hacemos click derecho sobre res - New - Android Resource Directory 

Luego, una vez creada la carpeta del menu, vamos a hacer click derecho sobre la misma y vamos a crear nuestro menu_item.xml el cual va a contener todos los items de nuestro menu

Una vez creamos nuestro menu_item.xml  vamos a escribir los dos items dentro del mismo para crearlos

<?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/alarma"
android:title="alarm_icon"
android:icon="@drawable/ic_add_alarm_black_24dp"
app:showAsAction="ifRoom" />

<item
android:id="@+id/avion"
android:title="avion_icon"
android:icon="@drawable/ic_airplanemode_active_black_24dp"
app:showAsAction="ifRoom" />


</menu>

La opcion showAsAction es muy importante, ya que si ponemos ifRoom nuestros items de menu se acomodaran al tamaño correspondiente de nuestro bottomAppBar o Toolbar, si ponemos always (no aconsejable) se acomodaran todos los items que pongamos dentro de nuestro bottomAppBar, es decir, si tenemos muchos items estos se veran aplastados en distintas pantallas (si son mas chicas) y por ultimo tenemos never que esto mostrara las opciones con un overflow menu que listara a cada item.

Para los iconos del menu en la parte de android:icon="@drawable/ic_airplanemode_active_black_24dp" usamos una imagen vectorizada, esta imagen nos ayuda a que si se escala en otros telefonos con dimensiones mayores, la imagen del icono no se vea borrosa y se adapte a cada pantalla.

Para crear una imagen vectorizada nos dirigimos a drawable , click derecho - New - vector Asset 

Al clicar, se nos abrira la siguiente pantalla, donde clicaremos clip art y se nos abrira la siguiente pantalla donde podemos seleccionar cualquier icono y agregarlo a drawable para luego utilizarlo

Por último en nuestro MainActivity deberemos hacer un override de onCreateOptionsMenu (para inflar la layout del menu que hicimos anteriormente) y onOptionsItemSelected (para programar las acciones que realizara cada item al clicarlo)

@Override
public boolean onOptionsItemSelected(MenuItem item) {

switch (item.getItemId()) {

case R.id.alarma:
Toast.makeText(this, "Alarma Activada", Toast.LENGTH_SHORT).show();
break;

case R.id.avion:
Toast.makeText(this, "Modo avion activado", Toast.LENGTH_SHORT).show();
break;


}

return super.onOptionsItemSelected(item);
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {

MenuInflater inflater = getMenuInflater();
inflater.inflate(R.menu.menu_item, menu);

return true;
}

Con esto listo ya podremos ejecutar nuestro menu y ver los items, como asi clicar cada uno y ver un Toast con un mensaje, el BottomAppBar se encargara por si mismo de desplazar estos items cuando se mueva el floatingActionButton

Si surge alguna duda pueden ver el siguiente video tutorial