Implementación de un BottomNavigationView en una aplicación Android.

Ahora este componente es parte de Jetpack y este tutorial se actualizó a AndroidX.

Dependencia

Adición de la dependencia (0.48)

~~compile 'com.android.support:design:25.0.0'~~
implementation 'com.google.android.material:material:1.1.0'

Adicionando el componente

Adicionando el BottomNavigationView (1.08)

<com.google.android.material.bottomnavigation.BottomNavigationView
    android:id="@+id/bottomNavigationView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom"
    app:labelVisibilityMode="labeled"
    app:menu="@menu/menu_navigation" />

Video version (deprecated):

<android.support.design.widget.BottomNavigationView  
    android:id="@+id/bottomNavigationView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" />

Menú

Creación del menú (1.38)

menu_navigation.xml

<?xml version="1.0" encoding="utf-8"?>  
<menu xmlns:android="http://schemas.android.com/apk/res/android">

    <item
        android:id="@+id/inicioItem"
        android:icon="@drawable/ic_home"
        android:title="@string/inicio" />

    <item
        android:id="@+id/buscarItem"
        android:icon="@drawable/ic_search"
        android:title="@string/buscar" />

    <item
        android:id="@+id/camaraItem"
        android:icon="@drawable/ic_camera_alt"
        android:title="@string/camara" />

    <item
        android:id="@+id/favoritosItem"
        android:icon="@drawable/ic_favorite"
        android:title="@string/favoritos" />

    <item
        android:id="@+id/perfilItem"
        android:icon="@drawable/ic_person"
        android:title="@string/perfil" />

</menu>


El Código

Repositorio Descargar

Si encuentras un error, por favor crea un Issue. Lo solucionaremos ASAP.
Crear un Issue

La versión actualizada se encuentra en el branch master si quieres ver la versión exacta del video puedes ir al branch video.

Luego de que descargues o clones el proyecto puedes importarlo con la opción "Import Project" desde Android Studio.


Extra

Badges

Ahora es posible adicionar badges a cada sección.

Importar BadgeDrawable

import com.google.android.material.badge.BadgeDrawable;

Colocar un valor o marca por el id del menu

BadgeDrawable badge = bottomNavigationView.getOrCreateBadge(R.id.inicioItem);
badge.setNumber(7); // opcional si solo quieres poner un punto rojo
badge.setVisible(true);

Themes

Ya no es necesario colocar la sombra manualmente, esta ya esta en el tema por defecto.

Default

style="@style/Widget.MaterialComponents.BottomNavigationView"

Si quieres que el BottomNavigationView tenga de fondo el color primario de la aplicación.

style="@style/Widget.MaterialComponents.BottomNavigationView.Colored"

Y este es el antiguo estilo con algo de movimiento, pero no recomendado.

style="@style/Widget.Design.BottomNavigationView"

Quitar animación

Si no deseas la animación de selección puedes adicionar el siguiente attributo.

app:labelVisibilityMode="labeled"

Si deseas que no tenga la animación de zoom al cambiar de opción (shift mode) aún no hay un método que lo permita hacer de forma sencilla, pero puedes utilizar este método:

private void removeShiftMode(BottomNavigationView bottomNavigationView) {~~
    BottomNavigationMenuView menuView = (BottomNavigationMenuView) bottomNavigationView.getChildAt(0);
    try {
        Field shiftingMode = menuView.getClass().getDeclaredField("mShiftingMode");
        shiftingMode.setAccessible(true);
        shiftingMode.setBoolean(menuView, false);
        shiftingMode.setAccessible(false);
        for (int i = 0; i < menuView.getChildCount(); i++) {
            BottomNavigationItemView item = (BottomNavigationItemView) menuView.getChildAt(i);
            //noinspection RestrictedApi
            item.setShiftingMode(false);
            //noinspection RestrictedApi
            item.setChecked(item.getItemData().isChecked());
        }
    } catch (NoSuchFieldException e) {
    } catch (IllegalAccessException e) {
    }
}

Puedes descargar el mismo ejemplo con esta modificación:

Con Fragments

Si quieres el ejemplo con fragments te lo dejamos aquí (aún no actualizada con AndroidX):

Recursos adicionales