Как реализовать нижнюю навигационную вкладку в соответствии с новым руководством Google

Как реализовать нижнюю навигационную вкладку в соответствии с новым руководством google (Pure android). Есть ли какой-нибудь пример?

Ссылка: https://www.google.com/design/spec/components/bottom-navigation.html

Solutions Collecting From Web of "Как реализовать нижнюю навигационную вкладку в соответствии с новым руководством Google"

Здесь, как я знаю, первое пользовательское решение.

ОБНОВИТЬ:

Официальный BottomNavigationView находится в Support lib 25.

Вы можете использовать библиотеку поддержки v25.

Добавьте в свой build.gradle

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

Добавьте BottomNavigationView в свой макет:

 <android.support.design.widget.BottomNavigationView android:id="@+id/bottom_navigation" app:menu="@menu/bottom_navigation_menu" android:layout_width="match_parent" android:layout_height="wrap_content" app:itemBackground="@color/colorPrimary" app:itemIconTint="@color/mycolor" app:itemTextColor="@color/mycolor"/> 

Затем создайте файл меню (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> 

Затем добавьте слушателя:

 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.my_action1: //Do something... break; } return false; } }); 

Дополнительная информация в документации.

Теперь BottomNavigationView добавлен в поддержку дизайна lib v25.0.0, выпущенный в октябре 2016 года

Добавьте BottomNavigationView в свой XML-файл.

Напр. 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" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/activity_main" android:layout_width="match_parent" android:layout_height="match_parent" tools:context="priyank.patel.bottomnavigationdemo.MainActivity"> <FrameLayout android:id="@+id/main_container" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_above="@+id/bottom_navigation" android:layout_alignParentTop="true"> </FrameLayout> <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="@android:color/white" app:itemTextColor="@android:color/white" app:menu="@menu/bottom_navigation_main" /> </RelativeLayout> 

Добавьте xml для пунктов меню в папку меню.

Напр. bottom_navigation_main.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_favorites" android:enabled="true" android:icon="@drawable/ic_favorite_white_24dp" android:title="@string/text_favorites" app:showAsAction="ifRoom" /> <item android:id="@+id/action_video" android:enabled="true" android:icon="@drawable/ic_music_video_white_24dp" android:title="@string/text_video" 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> 

Установите OnNavigationItemSelectedListener в BottomNavigationView в свой класс активности.

Напр. MainActivity.java

 import android.support.design.widget.BottomNavigationView; import android.support.v4.app.Fragment; import android.support.v4.app.FragmentManager; import android.support.v4.app.FragmentTransaction; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.view.MenuItem; public class MainActivity extends AppCompatActivity { private Fragment fragment; private FragmentManager fragmentManager; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); fragmentManager = getSupportFragmentManager(); fragment = new FavouriteFragment(); final FragmentTransaction transaction = fragmentManager.beginTransaction(); transaction.add(R.id.main_container, fragment).commit(); BottomNavigationView bottomNavigationView = (BottomNavigationView) findViewById(R.id.bottom_navigation); bottomNavigationView.setOnNavigationItemSelectedListener( new BottomNavigationView.OnNavigationItemSelectedListener() { @Override public boolean onNavigationItemSelected(MenuItem item) { switch (item.getItemId()) { case R.id.action_favorites: fragment = new FavouriteFragment(); break; case R.id.action_video: fragment = new VideoFragment(); break; case R.id.action_music: fragment = new MusicFragment(); break; } final FragmentTransaction transaction = fragmentManager.beginTransaction(); transaction.replace(R.id.main_container, fragment).commit(); return true; } }); } } 

Оформить заказ здесь для BottomNavigation-Demo

Там нет примеров кода. Хотя на данный момент есть пользовательские библиотеки, которые могут выполнять эту работу (как упоминалось в предыдущих сообщениях), я бы не рекомендовал использовать TabLayout для достижения этой цели, поскольку в руководящих принципах разработки для вкладки «Нижняя навигация» четко указано, что прокрутка экрана не должна Прокручивать страницы по горизонтали. Однако TabLayout расширяет HorizontalScrollView, и его основным мотивом является упрощение прокрутки, хотя вы можете отключить его, но это не будет идеальным.

Как сказал user6146138, https://github.com/roughike/BottomBar – отличная реализация. И вы можете посмотреть здесь отличный учебник, который очень прост в использовании, а в части 2 показано, как использовать его с прикрепленными фрагментами.

Еще одна хорошая реализация – https://github.com/aurelhubert/ahbottomnavigation, если вы хотите ее проверить. Я не знаю ни одного учебника по нему, но инструкции по ссылке достаточно хороши ИМО.

На данный момент нет примеров кода, а нижняя панель не находится в библиотеке поддержки (пока). Я нашел стороннюю библиотеку, которая имитирует рекомендации. Его можно найти здесь .

Репозиторий Я добавил полный проект по этой ссылке, посмотрите https://gitlab.com/ashish29agre/android-bottom-navigation-view-support-lib

Привет Это может быть немного поздно здесь xml

 <android.support.design.widget.AppBarLayout android:id="@+id/app_bar_layout" android:layout_width="match_parent" android:layout_height="wrap_content" android:fitsSystemWindows="true" android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="?attr/colorPrimary" app:layout_scrollFlags="scroll|enterAlways" app:popupTheme="@style/ThemeOverlay.AppCompat.Light" /> </android.support.design.widget.AppBarLayout> <RelativeLayout android:layout_width="match_parent" android:layout_height="match_parent"> <android.support.design.widget.BottomNavigationView android:id="@+id/nm_bottom" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:background="@color/colorPrimaryDark" app:itemIconTint="@android:color/white" app:itemTextColor="@android:color/white" app:layout_scrollFlags="scroll|enterAlways" app:layout_behavior="@string/appbar_scrolling_view_behavior" app:menu="@menu/nav_menu" /> <android.support.v7.widget.RecyclerView android:id="@+id/rv" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_above="@id/nm_bottom" app:layout_behavior="@string/appbar_scrolling_view_behavior" /> </RelativeLayout> 

Вы можете использовать библиотеки поддержки дизайна Google для BottomNavigationView . Прочтите ответ здесь .

Пока нет примеров кода. Но в андроидном арсенале есть пользовательские библиотеки, и это подробный учебник, который вы можете проверить.

Официального примера нет, но проверьте ссылку ниже.
Очень хорошая реализация. https://github.com/roughike/BottomBar

Вы можете использовать TabLayout для этого. Его можно легко выровнять в нижней части экрана.