webentwicklung-frage-antwort-db.com.de

Android neue untere Navigationsleiste oder BottomNavigationView

Ich habe gesehen, dass die neue Richtlinie herausgegeben wurde und in google photos latest app verwendet wurde. Sie haben keine Ahnung, wie sie die neue untere Navigationsleiste verwenden soll.

enter image description here

Kann keine offizielle Probe finden.

Wie benutze ich die neue Bodenleiste? Ich möchte nicht anpassen.

114
zjywill

Ich denke, du könntest danach suchen.

Hier ist ein kurzer Ausschnitt zum Einstieg:

public class MainActivity extends AppCompatActivity {
    private BottomBar mBottomBar;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        // Notice how you don't use the setContentView method here! Just
        // pass your layout to bottom bar, it will be taken care of.
        // Everything will be just like you're used to.
        mBottomBar = BottomBar.bind(this, R.layout.activity_main,
                savedInstanceState);

        mBottomBar.setItems(
                new BottomBarTab(R.drawable.ic_recents, "Recents"),
                new BottomBarTab(R.drawable.ic_favorites, "Favorites"),
                new BottomBarTab(R.drawable.ic_nearby, "Nearby"),
                new BottomBarTab(R.drawable.ic_friends, "Friends")
        );

        mBottomBar.setOnItemSelectedListener(new OnTabSelectedListener() {
            @Override
            public void onItemSelected(final int position) {
                // the user selected a new tab
            }
        });
    }

    @Override
    protected void onSaveInstanceState(Bundle outState) {
        super.onSaveInstanceState(outState);
        mBottomBar.onSaveInstanceState(outState);
    }
}

Hier ist ein Referenzlink.

https://github.com/roughike/BottomBar

EDIT Neuerscheinungen.

Die untere Navigationsansicht befand sich schon seit einiger Zeit in den Richtlinien für die Materialentwicklung, aber es war nicht einfach für uns, sie in unsere Apps zu implementieren. Einige Anwendungen haben eigene Lösungen entwickelt, während andere sich auf Open-Source-Bibliotheken von Drittanbietern verlassen haben, um die Arbeit zu erledigen. Jetzt wird in der Design-Support-Bibliothek diese untere Navigationsleiste hinzugefügt. Lassen Sie uns einen Blick darauf werfen, wie wir sie verwenden können!

Wie benutzt man ?

Zunächst müssen wir unsere Abhängigkeit aktualisieren!

compile ‘com.Android.support:design:25.0.0’

XML entwerfen.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
    xmlns:app="http://schemas.Android.com/apk/res-auto"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent">

    <!-- Content Container -->

    <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="@color/white"
        app:itemTextColor="@color/white"
        app:menu="@menu/bottom_navigation_main" />

</RelativeLayout>

Erstellen Sie ein Menü gemäß Ihrer Anforderung.

<?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/action_favorites"
        Android:enabled="true"
        Android:icon="@drawable/ic_favorite_white_24dp"
        Android:title="@string/text_favorites"
        app:showAsAction="ifRoom" />
    <item
        Android:id="@+id/action_schedules"
        Android:enabled="true"
        Android:icon="@drawable/ic_access_time_white_24dp"
        Android:title="@string/text_schedules"
        app:showAsAction="ifRoom" />
    <item
        Android:id="@+id/action_music"
        Android:enabled="true"
        Android:icon="@drawable/ic_audiotrack_white_24dp"
        Android:title="@string/text_music"
        app:showAsAction="ifRoom" />
</menu>

Umgang mit aktivierten/deaktivierten Zuständen. Selector-Datei erstellen.

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
  <item
      Android:state_checked="true"
      Android:color="@color/colorPrimary" />
  <item
      Android:state_checked="false"
      Android:color="@color/grey" />
 </selector>

Behandeln Sie Klickereignisse.

BottomNavigationView bottomNavigationView = (BottomNavigationView)
                findViewById(R.id.bottom_navigation);

bottomNavigationView.setOnNavigationItemSelectedListener(
        new BottomNavigationView.OnNavigationItemSelectedListener() {
            @Override
            public boolean onNavigationItemSelected(@NonNull MenuItem item) {
                switch (item.getItemId()) {
                    case R.id.action_favorites:

                        break;
                    case R.id.action_schedules:

                        break;
                    case R.id.action_music:

                        break;
                }
                return false;
            }
});

Wenn Sie mehr über seine Methoden und deren Funktionsweise erfahren möchten, lesen Sie dies.

Sicher wird es dir helfen.

159
Jay Rathod RJ

Sie sollten BottomNavigationView aus der Android Support Library der Version 25 verwenden. __, die eine standardmäßige untere Navigationsleiste für die Anwendung darstellt.

Hier ist ein Beitrag zu Medium, der ein Schritt für Schritt Anleitung:https://medium.com/@hitherejoe/exploring-the-Android-design-support-bibliothek- Navigations-Schublade-548de699e8d0 # .9vmiekxze

48
Maksim Turaev

Um dies zu erreichen, können Sie auch Tabulatorlayout mit benutzerdefinierter Tabulatoransicht verwenden. 

custom_tab.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
    xmlns:tools="http://schemas.Android.com/tools"
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content"
    Android:background="?attr/selectableItemBackground"
    Android:gravity="center"
    Android:orientation="vertical"
    Android:paddingBottom="10dp"
    Android:paddingTop="8dp">

    <ImageView
        Android:id="@+id/icon"
        Android:layout_width="24dp"
        Android:layout_height="24dp"
        Android:scaleType="centerInside"
        Android:src="@drawable/ic_recents_selector" />

    <TextView
        Android:id="@+id/title"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:ellipsize="end"
        Android:maxLines="1"
        Android:textAllCaps="false"
        Android:textColor="@color/tab_color"
        Android:textSize="12sp"/>
</LinearLayout>

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    Android:orientation="vertical">

    <Android.support.v4.view.ViewPager

        Android:id="@+id/view_pager"
        Android:layout_width="match_parent"
        Android:layout_height="0dp"
        Android:layout_weight="1" />

    <Android.support.design.widget.TabLayout
        Android:id="@+id/tab_layout"
        style="@style/AppTabLayout"
        Android:layout_width="match_parent"
        Android:layout_height="56dp"
        Android:background="?attr/colorPrimary" />

</LinearLayout>

MainActivity.Java

public class MainActivity extends AppCompatActivity {
    private TabLayout mTabLayout;

    private int[] mTabsIcons = {
            R.drawable.ic_recents_selector,
            R.drawable.ic_favorite_selector,
            R.drawable.ic_place_selector};


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        // Setup the viewPager
        ViewPager viewPager = (ViewPager) findViewById(R.id.view_pager);
        MyPagerAdapter pagerAdapter = new MyPagerAdapter(getSupportFragmentManager());
        viewPager.setAdapter(pagerAdapter);

        mTabLayout = (TabLayout) findViewById(R.id.tab_layout);
        mTabLayout.setupWithViewPager(viewPager);

        for (int i = 0; i < mTabLayout.getTabCount(); i++) {
            TabLayout.Tab tab = mTabLayout.getTabAt(i);
            tab.setCustomView(pagerAdapter.getTabView(i));
        }

        mTabLayout.getTabAt(0).getCustomView().setSelected(true);
    }


    private class MyPagerAdapter extends FragmentPagerAdapter {

        public final int PAGE_COUNT = 3;

        private final String[] mTabsTitle = {"Recents", "Favorites", "Nearby"};

        public MyPagerAdapter(FragmentManager fm) {
            super(fm);
        }

        public View getTabView(int position) {
            // Given you have a custom layout in `res/layout/custom_tab.xml` with a TextView and ImageView
            View view = LayoutInflater.from(MainActivity.this).inflate(R.layout.custom_tab, null);
            TextView title = (TextView) view.findViewById(R.id.title);
            title.setText(mTabsTitle[position]);
            ImageView icon = (ImageView) view.findViewById(R.id.icon);
            icon.setImageResource(mTabsIcons[position]);
            return view;
        }

        @Override
        public Fragment getItem(int pos) {
            switch (pos) {

                case 0:
                    return PageFragment.newInstance(1);

                case 1:
                    return PageFragment.newInstance(2);
                case 2:
                    return PageFragment.newInstance(3);

            }
            return null;
        }

        @Override
        public int getCount() {
            return PAGE_COUNT;
        }

        @Override
        public CharSequence getPageTitle(int position) {
            return mTabsTitle[position];
        }
    }

}

Komplettes Beispielprojekt herunterladen

16
waleedsarwar86

Google hat BottomNavigationView nach der Version 25.0.0 der Design-Support-Bibliothek gestartet. Es kam aber mit folgenden Einschränkungen:

  1. Titel und das mittlere Symbol können nicht entfernt werden.
  2. Die Textgröße des Titels kann nicht geändert werden.
  3. kann man auch nichts ändern Sie die Farbe Es ist immer die ̶c̶o̶l̶o̶r̶P̶r̶i̶m̶a̶r̶y̶.̶
  4. Es gibt kein BottomNavigationBehavior: daher keine Integration mit FAB oder SnackBar über CordinatorLayout.
  5. Jedes menuItem ist eine reine Erweiterung von FrameLayout, sodass es keinen Nizza-Kreis-Enthüllungseffekt hat

Das Maximum, das Sie mit dieser ersten Version von BottomNavigationView erreichen können, ist: (ohne Reflektion oder Implementierung der Bibliothek selbst).

enter image description here

Also, wenn Sie eines davon wollen. Sie können eine dritte Teilbibliothek wie roughike/BottomBar verwenden oder die lib selbst implementieren.

13
Sanf0rd

Wie bereits erwähnt, hat Google BottomNavigationView als Teil der Design Support Library Version 25.0.0 gestartet. Die Einschränkungen, die er erwähnte, sind größtenteils zutreffend, außer dass Sie die Hintergrundfarbe der Ansicht und sogar die Textfarbe und die Symbolfarbe ändern KÖNNEN. Es hat auch eine Animation, wenn Sie mehr als 4 Elemente hinzufügen (leider kann es nicht manuell aktiviert oder deaktiviert werden).

Ich habe ein detailliertes Tutorial mit Beispielen und einem dazugehörigen Repository geschrieben, das Sie hier lesen können: https: //blog.autsoft. hu/now-you-can-use-the-bottom-navigation-view-in-the-design-support-library /


Der Kern davon

Sie müssen diese in Ihrer App-Ebene hinzufügen build.gradle:

compile 'com.Android.support:appcompat-v7:25.0.0'  
compile 'com.Android.support:design:25.0.0'

Sie können es wie folgt in Ihr Layout einfügen:

<Android.support.design.widget.BottomNavigationView  
        xmlns:app="http://schemas.Android.com/apk/res-auto"
        Android:id="@+id/bottom_navigation_view"
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content"
        app:itemBackground="@color/darkGrey"
        app:itemIconTint="@color/bottom_navigation_item_background_colors"
        app:itemTextColor="@color/bottom_navigation_item_background_colors"
        app:menu="@menu/menu_bottom_navigation" />

Sie können die Elemente über eine Menüressource wie folgt angeben:

<?xml version="1.0" encoding="utf-8"?>  
<menu  
    xmlns:Android="http://schemas.Android.com/apk/res/Android">
    <item
        Android:id="@+id/action_one"
        Android:icon="@Android:drawable/ic_dialog_map"
        Android:title="One"/>
    <item
        Android:id="@+id/action_two"
        Android:icon="@Android:drawable/ic_dialog_info"
        Android:title="Two"/>
    <item
        Android:id="@+id/action_three"
        Android:icon="@Android:drawable/ic_dialog_email"
        Android:title="Three"/>
    <item
        Android:id="@+id/action_four"
        Android:icon="@Android:drawable/ic_popup_reminder"
        Android:title="Four"/>
</menu>

Und Sie können den Farbton und die Textfarbe als Farbliste festlegen, sodass das aktuell ausgewählte Element hervorgehoben wird:

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

    <item
        Android:color="@color/colorAccent"
        Android:state_checked="false"/>
    <item
        Android:color="@Android:color/white"
        Android:state_checked="true"/>

</selector>

Schließlich können Sie die Auswahl der Elemente mit einem OnNavigationItemSelectedListener behandeln:

bottomNavigationView.setOnNavigationItemSelectedListener(new BottomNavigationView.OnNavigationItemSelectedListener() {  
    @Override
    public boolean onNavigationItemSelected(@NonNull MenuItem item) {
        Fragment fragment = null;
        switch (item.getItemId()) {
            case R.id.action_one:
                // Switch to page one
                break;
            case R.id.action_two:
                // Switch to page two
                break;
            case R.id.action_three:
                // Switch to page three
                break;
        }
        return true;
    }
});
10
Balázs Gerlei

So fügen Sie eine untere Navigationsleiste hinzu

Die akzeptierte Antwort ist gut, aber ich fand die Organisation etwas schwer zu folgen und einige Inhalte waren nicht erforderlich. Das folgende vollständige Beispiel zeigt, wie eine untere Navigationsleiste dem Bild in der Frage ähnlich wird.

 enter image description here

Fügen Sie die Design-Support-Bibliothek hinzu

Fügen Sie diese Zeile zur build.grade -Datei Ihrer App neben den anderen Unterstützungsbibliotheken hinzu.

implementation 'com.Android.support:design:28.0.0'

Ersetzen Sie die Versionsnummer durch das, was aktuell ist.

Erstellen Sie das Aktivitätslayout

Das einzige, was wir dem Layout hinzugefügt haben, ist die Variable BottomNavigationView. Um die Farbe des Symbols und des Texts zu ändern, wenn Sie darauf klicken, können Sie eine selector verwenden, anstatt die Farbe direkt anzugeben. Dies ist hier der Einfachheit halber weggelassen.

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    xmlns:app="http://schemas.Android.com/apk/res-auto"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent">

    <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:menu="@menu/bottom_nav_menu"
        app:itemBackground="@color/colorPrimary"
        app:itemIconTint="@Android:color/white"
        app:itemTextColor="@Android:color/white" />

</RelativeLayout>

Beachten Sie, dass wir layout_alignParentBottom verwendet haben, um es tatsächlich unten zu platzieren. 

Definieren Sie die Menüpunkte

Die XML-Ansicht oben für die untere Navigationsansicht bezieht sich auf bottom_nav_menu. Dies ist, was jeden Artikel in unserer Sicht definiert. Wir werden es jetzt schaffen. Alles, was Sie tun müssen, ist fügen Sie eine Menüressource hinzu wie Sie es für eine Aktionsleiste oder Symbolleiste tun würden.

bottom_nav_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/action_recents"
        Android:enabled="true"
        Android:icon="@drawable/ic_action_recents"
        Android:title="Recents"
        app:showAsAction="ifRoom" />

    <item
        Android:id="@+id/action_favorites"
        Android:enabled="true"
        Android:icon="@drawable/ic_action_favorites"
        Android:title="Favorites"
        app:showAsAction="ifRoom" />

    <item
        Android:id="@+id/action_nearby"
        Android:enabled="true"
        Android:icon="@drawable/ic_action_nearby"
        Android:title="Nearby"
        app:showAsAction="ifRoom" />
</menu>

Sie müssen Ihrem Projekt die entsprechenden Symbole hinzufügen. Dies ist nicht sehr schwierig, wenn Sie zu File> New> Image Asset gehen und als Symboltyp Aktionsleiste und Registersymbole wählen.

Einen ausgewählten Listener hinzufügen

Hier passiert nichts Besonderes. Wir fügen der unteren Navigationsleiste in unserer onCreate-Methode unserer Aktivität einfach einen Listener hinzu.

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        BottomNavigationView bottomNavigationView = (BottomNavigationView) findViewById(R.id.bottom_navigation);
        bottomNavigationView.setOnNavigationItemSelectedListener(new BottomNavigationView.OnNavigationItemSelectedListener() {
            @Override
            public boolean onNavigationItemSelected(@NonNull MenuItem item) {
                switch (item.getItemId()) {
                    case R.id.action_recents:
                        Toast.makeText(MainActivity.this, "Recents", Toast.LENGTH_SHORT).show();
                        break;
                    case R.id.action_favorites:
                        Toast.makeText(MainActivity.this, "Favorites", Toast.LENGTH_SHORT).show();
                        break;
                    case R.id.action_nearby:
                        Toast.makeText(MainActivity.this, "Nearby", Toast.LENGTH_SHORT).show();
                        break;

                }
                return true;
            }
        });
    }
}

Benötigen Sie weitere Hilfe?

Ich habe gelernt, wie ich das folgende YouTube-Video anschaue. Die Computerstimme ist etwas seltsam, aber die Demonstration ist sehr klar.

8
Suragch

Andere alternative Bibliotheken, die Sie ausprobieren können: - https://github.com/Ashok-Varma/BottomNavigation

<com.ashokvarma.bottomnavigation.BottomNavigationBar
    Android:layout_gravity="bottom"
    Android:id="@+id/bottom_navigation_bar"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"/>

BottomNavigationBar bottomNavigationBar = (BottomNavigationBar) findViewById(R.id.bottom_navigation_bar);

bottomNavigationBar
                .addItem(new BottomNavigationItem(R.drawable.ic_home_white_24dp, "Home"))
                .addItem(new BottomNavigationItem(R.drawable.ic_book_white_24dp, "Books"))
                .addItem(new BottomNavigationItem(R.drawable.ic_music_note_white_24dp, "Music"))
                .addItem(new BottomNavigationItem(R.drawable.ic_tv_white_24dp, "Movies & TV"))
                .addItem(new BottomNavigationItem(R.drawable.ic_videogame_asset_white_24dp, "Games"))
                .initialise();
8
Ashok Varma

ich habe eine Privatklasse erstellt, die eine Rasteransicht und eine Menüressource verwendet:

private class BottomBar {

    private GridView mGridView;
    private Menu     mMenu;
    private BottomBarAdapter mBottomBarAdapter;
    private View.OnClickListener mOnClickListener;

    public BottomBar (@IdRes int gridviewId, @MenuRes int menuRes,View.OnClickListener onClickListener) {
        this.mGridView = (GridView) findViewById(gridviewId);
        this.mMenu = getMenu(menuRes);
        this.mOnClickListener = onClickListener;

        this.mBottomBarAdapter = new BottomBarAdapter();
        this.mGridView.setAdapter(mBottomBarAdapter);
    }

    private Menu getMenu(@MenuRes int menuId) {
        PopupMenu p = new PopupMenu(MainActivity.this,null);
        Menu menu = p.getMenu();
        getMenuInflater().inflate(menuId,menu);
        return menu;
    }

    public GridView getGridView(){
        return mGridView;
    }

    public void show() {
        mGridView.setVisibility(View.VISIBLE);
        mGridView.animate().translationY(0);
    }

    public void hide() {
        mGridView.animate().translationY(mGridView.getHeight());
    }



    private class BottomBarAdapter extends BaseAdapter {

        private LayoutInflater    mInflater;

        public BottomBarAdapter(){
            this.mInflater = LayoutInflater.from(MainActivity.this);
        }

        @Override
        public int getCount() {
            return mMenu.size();
        }

        @Override
        public Object getItem(int i) {
            return mMenu.getItem(i);
        }

        @Override
        public long getItemId(int i) {
            return 0;
        }

        @Override
        public View getView(int i, View view, ViewGroup viewGroup) {

            MenuItem item = (MenuItem) getItem(i);

            if (view==null){
                view = mInflater.inflate(R.layout.your_item_layout,null);
                view.setId(item.getItemId());
            }

            view.setOnClickListener(mOnClickListener);
            view.findViewById(R.id.bottomnav_icon).setBackground(item.getIcon());
            ((TextView) view.findViewById(R.id.bottomnav_label)).setText(item.getTitle());

            return view;
        }
    }

your_menu.xml:

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:Android="http://schemas.Android.com/apk/res/Android">
    <item Android:id="@+id/item1_id"
        Android:icon="@drawable/ic_item1"
        Android:title="@string/title_item1"/>
    <item Android:id="@+id/item2_id"
        Android:icon="@drawable/ic_item2"
        Android:title="@string/title_item2"/>
    ...
</menu>

und ein benutzerdefiniertes Layoutelement Ihre_Element_Layout.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:layout_width="wrap_content" Android:layout_height="wrap_content"
    Android:orientation="vertical"
    Android:layout_margin="16dp">
    <ImageButton Android:id="@+id/bottomnav_icon"
        Android:layout_width="24dp"
        Android:layout_height="24dp"
        Android:layout_gravity="top|center_horizontal"
        Android:layout_marginTop="8dp"
        Android:layout_marginBottom="4dp"/>
    <TextView Android:id="@+id/bottomnav_label"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_gravity="bottom|center_horizontal"
        Android:layout_marginBottom="8dp"
        Android:layout_marginTop="4dp"
        style="@style/mystyle_label" />
</LinearLayout>

nutzung innerhalb Ihrer Hauptaktivität:

BottomBar bottomBar = new BottomBar(R.id.YourGridView,R.menu.your_menu, mOnClickListener);

und

private View.OnClickListener mOnClickListener = new View.OnClickListener() {
    @Override
    public void onClick(View view) {
        switch (view.getId()) {
            case R.id.item1_id:
                //todo item1
                break;
            case R.id.item2_id:
                //todo item2
                break;
            ...
        }
    }
}

und in layout_activity.xml

<?xml version="1.0" encoding="utf-8"?>
<Android.support.design.widget.CoordinatorLayout 
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    xmlns:app="http://schemas.Android.com/apk/res-auto"
    xmlns:tools="http://schemas.Android.com/tools"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    Android:fitsSystemWindows="true">
    ...
    <FrameLayout Android:id="@+id/fragment_container"
        Android:layout_width="match_parent"
        Android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"/>

    <GridView Android:id="@+id/bottomNav"
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content"
        Android:background="@color/your_background_color"
        Android:verticalSpacing="0dp"
        Android:horizontalSpacing="0dp"
        Android:numColumns="4"
        Android:stretchMode="columnWidth"
        app:layout_anchor="@id/fragment_container"
        app:layout_anchorGravity="bottom"/>
</Android.support.design.widget.CoordinatorLayout>
3
G Dias

In Version 25 der Design Support Library gibt es ein neues offizielles BottomNavigationView

https://developer.Android.com/reference/Android/support/design/widget/BottomNavigationView.html add in Gradle compile 'com.Android.support:design:25.0.0'

XML

<Android.support.design.widget.BottomNavigationView
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    xmlns:design="http://schema.Android.com/apk/res/Android.support.design"
    Android:id="@+id/navigation"
    Android:layout_width="wrap_content"
    Android:layout_height="match_parent"
    Android:layout_gravity="start"
    design:menu="@menu/my_navigation_items" />
2
Mrk_Slk

Ich denke, das ist auch nützlich. 

Snippet

public class MainActivity : AppCompatActivity, BottomNavigationBar.Listeners.IOnTabSelectedListener
{
    private BottomBar _bottomBar;

    protected override void OnCreate(Bundle bundle)
    {
        base.OnCreate(bundle);

        SetContentView(Resource.Layout.MainActivity);

        _bottomBar = BottomBar.Attach(this, bundle);
        _bottomBar.SetItems(
            new BottomBarTab(Resource.Drawable.ic_recents, "Recents"),
            new BottomBarTab(Resource.Drawable.ic_favorites, "Favorites"),
            new BottomBarTab(Resource.Drawable.ic_nearby, "Nearby")
        );
        _bottomBar.SetOnItemSelectedListener(this);
        _bottomBar.HideShadow();
        _bottomBar.UseDarkTheme(true);
        _bottomBar.SetTypeFace("Roboto-Regular.ttf");

        var badge = _bottomBar.MakeBadgeForTabAt(1, Color.ParseColor("#f02d4c"), 1);
        badge.AutoShowAfterUnSelection = true;
    }

    public void OnItemSelected(int position)
    {

    }

    protected override void OnSaveInstanceState(Bundle outState)
    {
        base.OnSaveInstanceState(outState);

        // Necessary to restore the BottomBar's state, otherwise we would
        // lose the current tab on orientation change.
        _bottomBar.OnSaveInstanceState(outState);
    }
}

Links

https://github.com/pocheshire/BottomNavigationBar

Es ist https://github.com/roughike/BottomBar für Xamarin-Entwickler nach C # portiert

2
Pocheshire

Diese Bibliothek, BottomNavigationViewEx , erweitert Google BottomNavigationView. Sie können die Google-Bibliothek ganz einfach so anpassen, dass die untere Navigationsleiste Ihren Wünschen entspricht. Sie können den Umschaltmodus deaktivieren, die Sichtbarkeit der Symbole und Texte ändern und vieles mehr. Probieren Sie es auf jeden Fall aus. 

1
Anky An
<Android.support.design.widget.BottomNavigationView
    Android:id="@+id/navigation"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    Android:layout_gravity="bottom"
    Android:background="?android:attr/windowBackground"
    app:menu="@menu/navigation" />

navigation.xml (im Menü)

<?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/navigation_home"
        Android:icon="@drawable/ic_home_black_24dp"
        Android:title="@string/title_home"
        app:showAsAction="always|withText"
        Android:enabled="true"/>

In onCreate()-Methode,

BottomNavigationView navigation = (BottomNavigationView)findViewById(R.id.navigation);
//Dont forgot this line     
BottomNavigationViewHelper.disableShiftMode(navigation);

Und wie unten beschrieben eine Klasse erstellen.

public class BottomNavigationViewHelper {
    public static void disableShiftMode(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);
        }
    }
}
0
Kishore Reddy

Ich habe diese github post verwiesen und den three layouts für three fragment Seiten in der unteren Tab-Leiste eingestellt.

FourButtonsActivity.Java:

bottomBar.setFragmentItems(getSupportFragmentManager(), R.id.fragmentContainer,
            new BottomBarFragment(LibraryFragment.newInstance(R.layout.library_fragment_layout), R.drawable.ic_update_white_24dp, "Recents"),
            new BottomBarFragment(PhotoEffectFragment.newInstance(R.layout.photo_effect_fragment), R.drawable.ic_local_dining_white_24dp, "Food"),
            new BottomBarFragment(VideoFragment.newInstance(R.layout.video_layout), R.drawable.ic_favorite_white_24dp, "Favorites")

    );

So legen Sie die Anzahl der Ausweise fest:

  BottomBarBadge unreadMessages = bottomBar.makeBadgeForTabAt(1, "#E91E63", 4);
  unreadMessages.show();
  unreadMessages.setCount(4);
  unreadMessages.setAnimationDuration(200);
  unreadMessages.setAutoShowAfterUnSelection(true);

LibraryFragment.Java:

import Android.os.Bundle;
import Android.support.annotation.Nullable;
import Android.support.v4.app.Fragment;
import Android.view.LayoutInflater;
import Android.view.View;
import Android.view.ViewGroup;

public class LibraryFragment extends Fragment {
    private static final String STARTING_TEXT = "Four Buttons Bottom Navigation";

    public LibraryFragment() {
    }

    public static LibraryFragment newInstance(int resource) {
        Bundle args = new Bundle();
        args.putInt(STARTING_TEXT, resource);

        LibraryFragment sampleFragment = new LibraryFragment();
        sampleFragment.setArguments(args);

        return sampleFragment;
    }

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {


        View view = LayoutInflater.from(getActivity()).inflate(
                getArguments().getInt(STARTING_TEXT), null);
        return view;


    }
0
Stephen