Android
BottomNavigationView

Einführung

Bemerkungen

Grundlegende Implementierung

BottomNavigationView folgendermaßen vor, um die BottomNavigationView hinzuzufügen:

1. Fügen Sie in Ihrem build.gradle die Abhängigkeit hinzu :

compile 'com.android.support:design:25.1.0'

2. Fügen Sie die BottomNavigationView Ihrem Layout hinzu :

<android.support.design.widget.BottomNavigationView
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/bottom_navigation"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:menu="@menu/bottom_navigation_menu"/>

3. Erstellen Sie das Menü , um die Ansicht aufzufüllen:

<!-- res/menu/bottom_navigation_menu.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/my_action1"
        android:enabled="true"
        android:icon="@drawable/my_drawable"
        android:title="@string/text"
        app:showAsAction="ifRoom" />
    ....
</menu>

4. Hängen Sie einen Listener für die Klickereignisse an:

//Get the view
BottomNavigationView bottomNavigationView = (BottomNavigationView)
                findViewById(R.id.bottom_navigation);
//Attach the listener
bottomNavigationView.setOnNavigationItemSelectedListener(
        new BottomNavigationView.OnNavigationItemSelectedListener() {
            @Override
            public boolean onNavigationItemSelected(@NonNull MenuItem item) {
                switch (item.getItemId()) {

                    case R.id.my_action1:
                        //Do something...
                        break;

                    //...
                }
                return true;//returning false disables the Navigation bar animations
            }
        });

Checkout-Demo-Code bei BottomNavigation-Demo

Anpassung von BottomNavigationView

Hinweis: Ich BottomNavigationView davon aus, dass Sie wissen, wie BottomNavigationView .

In diesem Beispiel werde ich erläutern, wie der Selektor für BottomNavigationView . Sie können also auf der Benutzeroberfläche für Symbole und Texte angeben.

Erstellen Sie eine drawable bottom_navigation_view_selector.xml als

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item  android:color="@color/bottom_nv_menu_selected" android:state_checked="true" />
    <item android:color="@color/bottom_nv_menu_default" />
</selector>

Verwenden Sie die folgenden Attribute in BottomNavigationView in der Layoutdatei

app:itemIconTint="@drawable/bottom_navigation_view_selector" 
app:itemTextColor="@drawable/bottom_navigation_view_selector"

In obigem Beispiel habe ich denselben Selektor bottom_navigation_view_selector für app:itemIconTint und app:itemTextColor , um die Text- und app:itemTextColor zu halten. Wenn Ihr Design jedoch eine andere Farbe für Text und Symbole hat, können Sie zwei verschiedene Selektoren definieren und verwenden.

Die Ausgabe ist ähnlich wie unten

Umgang mit aktivierten / deaktivierten Zuständen

Selektor für Menüelement aktivieren / deaktivieren.

selector.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@color/white" android:state_enabled="true" />
    <item android:color="@color/colorPrimaryDark" android:state_enabled="false" />
</selector>

design.xml

<android.support.design.widget.BottomNavigationView
    android:id="@+id/bottom_navigation"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    app:itemBackground="@color/colorPrimary"
    app:itemIconTint="@drawable/nav_item_color_state"
    app:itemTextColor="@drawable/nav_item_color_state"
    app:menu="@menu/bottom_navigation_main" />

Erlaubt mehr als 3 Menüs

Dieses Beispiel ist ausnahmslos eine Problemumgehung, da ein Verhalten, das als ShiftMode bekannt ist, derzeit nicht deaktiviert werden kann.

Erstellen Sie eine Funktion als solche.

public static void disableMenuShiftMode(BottomNavigationView view) {
    BottomNavigationMenuView menuView = (BottomNavigationMenuView) view.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);
            // set once again checked value, so view will be updated
            //noinspection RestrictedApi
            item.setChecked(item.getItemData().isChecked());
        }
    } catch (NoSuchFieldException e) {
        Log.e("BNVHelper", "Unable to get shift mode field", e);
    } catch (IllegalAccessException e) {
        Log.e("BNVHelper", "Unable to change value of shift mode", e);
    }
}

Dies deaktiviert das Verschiebungsverhalten des Menüs, wenn die Elementanzahl 3 Nummern überschreitet.

VERWENDUNGSZWECK

BottomNavigationView navView = (BottomNavigationView) findViewById(R.id.bottom_navigation_bar);
disableMenuShiftMode(navView);

Proguard-Problem : Fügen Sie die folgende Zeile der Proguard-Konfigurationsdatei hinzu. Andernfalls funktioniert dies nicht.

-keepclassmembers class android.support.design.internal.BottomNavigationMenuView { 
boolean mShiftingMode; 
}

Alternativ können Sie eine Klasse erstellen und von dort auf diese Methode zugreifen. Siehe Originalantwort hier

HINWEIS : Dies ist ein auf Reflection basierender HOTFIX . Bitte aktualisieren Sie diesen, sobald die Support-Bibliothek von Google mit einem direkten Funktionsaufruf aktualisiert wird.