Comment mettre en œuvre l'onglet de navigation du bas selon les nouvelles directives de Google (Android pur). Y a-t-il un exemple?
Réf.: https://www.google.com/design/spec/components/bottom-navigation.html
Ici première solution personnalisée pour autant que je sache.
METTRE À JOUR:
Official BottomNavigationView est sorti dans Support lib 25.
Vous pouvez utiliser la bibliothèque de support v25.
Ajoutez dans votre build.gradle
compile 'com.Android.support:design:25.0.0'
Ajoutez la BottomNavigationView
dans votre mise en page:
<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"/>
Créez ensuite un fichier de menu (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>
Ajoutez ensuite l'auditeur:
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;
}
});
Maintenant, BottomNavigationView est ajouté au support de conception lib v25.0.0 publié en octobre 2016
Ajoutez BottomNavigationView
dans votre fichier xml.
Par ex. 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>
Ajouter XML pour les éléments de menu dans le dossier de menu.
Par ex. 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>
Définissez OnNavigationItemSelectedListener
sur BottomNavigationView
dans votre classe d'activité.
Par ex. 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;
}
});
}
}
Commander ici pour BottomNavigation-Demo
Il n'y a pas d'exemples de code là-bas. Bien que certaines bibliothèques personnalisées puissent faire le travail à partir de maintenant. (Comme mentionné dans les messages ci-dessus) l'écran ne doit pas faire défiler les pages horizontalement. Cependant, TabLayout étend HorizontalScrollView et son objectif principal est de faciliter le défilement, même si vous pouvez le désactiver, cela ne sera pas idéal.
Comme le dit l'utilisateur 6146138, https://github.com/roughike/BottomBar est une excellente implémentation. Et vous pouvez consulter un excellent didacticiel à ce sujet ici , qui est vraiment facile à suivre et la partie 2 vous montre comment l’utiliser avec des fragments attachés.
Une autre implémentation de Nice est https://github.com/aurelhubert/ahbottomnavigation si vous voulez y accéder. Je ne connais aucun tutoriel sur ce sujet, mais les instructions sur le lien sont assez bonnes, IMO.
Repository J'ai ajouté le projet complet en cliquant sur ce lien https://gitlab.com/ashish29agre/Android-bottom-navigation-view-support-lib
Salut Cela pourrait être un peu tard ici, voici le 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>
Pour l'instant, il n'y a pas d'exemples de code et la barre du bas ne se trouve pas (encore) dans la bibliothèque de support. J'ai trouvé une bibliothèque tierce qui imite les directives. On peut le trouver ici .
Vous pouvez utiliser les bibliothèques de support de conception Google pour BottomNavigationView . Lire la réponse ici .
Vous pouvez utiliser TabLayout pour cela. Il peut être facilement aligné en bas de l'écran.
Il n'y a pas d'exemple officiel mais vérifiez le lien ci-dessous.
Très bonne implémentation. https://github.com/roughike/BottomBar
Il n'y a pas encore d'exemples de code. Mais il existe des bibliothèques personnalisées dans l'arsenal Android et il s'agit d'un didacticiel détaillé que vous pouvez vérifier conception du matériel Android, navigation de fond