Afficher/masquer les bottomNavigationView sur de Défilement
je dois cacher la vue de navigation du bas sur le rouleau haut et montrer sur le rouleau bas .comment mettre en œuvre ceci? ma mise en page est comme ceci
<?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">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_above="@+id/navigation"
android:layout_alignParentTop="true"
android:layout_marginBottom="5dp">
<FrameLayout
android:id="@+id/container1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>
</LinearLayout>
<android.support.design.widget.BottomNavigationView
android:id="@+id/navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="?android:attr/windowBackground"
app:layout_scrollFlags="scroll|enterAlways|snap"
app:menu="@menu/dashboard_slider_menu" />
</RelativeLayout>
j'ai joint screenshot of view. Veuillez la vérifier.
5 réponses
UPDATE
dernière mise à Jour de Bibliothèque de prise en charge de la Version 28.0.0-alpha1
et il suffit d'ajouter un attribut BottomNavigationView
.
<BottomNavigationView
....
....
app:layout_behavior="@string/hide_bottom_view_on_scroll_behavior"/>
Remarque:: votre XML doit suivre la structure de XML donnée ci-dessous dans l'ancienne réponse.
OLD ANSWER (Still Works)
vous avez besoin d'un cours d'aide pour faire cela .Cette solution fonctionne comme Google La Conception De Matériel De Directive.
Créer une classe BottomNavigationViewBehavior
public class BottomNavigationViewBehavior extends CoordinatorLayout.Behavior<BottomNavigationView> {
private int height;
@Override
public boolean onLayoutChild(CoordinatorLayout parent, BottomNavigationView child, int layoutDirection) {
height = child.getHeight();
return super.onLayoutChild(parent, child, layoutDirection);
}
@Override
public boolean onStartNestedScroll(@NonNull CoordinatorLayout coordinatorLayout,
BottomNavigationView child, @NonNull
View directTargetChild, @NonNull View target,
int axes, int type)
{
return axes == ViewCompat.SCROLL_AXIS_VERTICAL;
}
@Override
public void onNestedScroll(@NonNull CoordinatorLayout coordinatorLayout, @NonNull BottomNavigationView child,
@NonNull View target, int dxConsumed, int dyConsumed,
int dxUnconsumed, int dyUnconsumed,
@ViewCompat.NestedScrollType int type)
{
if (dyConsumed > 0) {
slideDown(child);
} else if (dyConsumed < 0) {
slideUp(child);
}
}
private void slideUp(BottomNavigationView child) {
child.clearAnimation();
child.animate().translationY(0).setDuration(200);
}
private void slideDown(BottomNavigationView child) {
child.clearAnimation();
child.animate().translationY(height).setDuration(200);
}
}
pour utiliser ce comportement, vous devez utiliser la disposition cooradinator...
<android.support.v4.widget.DrawerLayout 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/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.kliff.digitaldwarka.activity.MainActivity">
<android.support.design.widget.CoordinatorLayout
android:id="@+id/coordinator_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="@+id/myAppBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:descendantFocusability="beforeDescendants"
android:focusableInTouchMode="true"
android:theme="@style/AppTheme.AppBarOverlay"
app:elevation="0dp">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:contentInsetStart="0dp"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="@style/AppTheme.PopupOverlay"/>
</android.support.design.widget.AppBarLayout>
<!---your RecyclerView/Fragment Container Layout-->
<FrameLayout
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior" />
<android.support.design.widget.BottomNavigationView
android:id="@+id/bottom_nav"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
app:itemBackground="@color/white"
app:menu="@menu/bottom_nav_menu" />
</android.support.design.widget.CoordinatorLayout>
<!---NavigationView-->
</android.support.v4.widget.DrawerLayout>
ajouter ce code à votre activité qui contient la navigation par le bas..
mBottomNavigationView = (BottomNavigationView) findViewById(R.id.bottom_nav);
CoordinatorLayout.LayoutParams layoutParams = (CoordinatorLayout.LayoutParams) mBottomNavigationView.getLayoutParams();
layoutParams.setBehavior(new BottomNavigationViewBehavior());
Essayez ceci,
mRecyclerView.addOnScrollListener(new RecyclerView.OnScrollListener() {
@Override
public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
if (dy > 0 && bottom_navigation.isShown()) {
bottom_navigation.setVisibility(View.GONE);
} else if (dy < 0 ) {
bottom_navigation.setVisibility(View.VISIBLE);
}
}
@Override
public void onScrollStateChanged(RecyclerView recyclerView, int newState) {
super.onScrollStateChanged(recyclerView, newState);
}
});
Image tout en défilant vers le haut :-
Image pendant le défilement vers le bas:
Utilisez ceci
mRecyclerView.addOnScrollListener(new RecyclerView.OnScrollListener()
{
@Override
public void onScrolled(RecyclerView recyclerView, int dx, int dy)
{
if (dy > 0 ||dy<0 && csButtonLay.isShown())
{
bottomBar.setVisibility(View.GONE);
}
}
@Override
public void onScrollStateChanged(RecyclerView recyclerView, int newState)
{
if (newState == RecyclerView.SCROLL_STATE_IDLE)
{
bottomBar.setVisibility(View.VISIBLE);
}
super.onScrollStateChanged(recyclerView, newState);
}
});
réponse mise à jour après les dernières mises à jour des bibliothèques:
Cacher le BottomNavigationView
le défilement est maintenant disponible avec un seul drapeau dans la mise en page! A partir de la version 1.0.0-alpha1.
j'ai mis à jour mon projet en utilisant cette dernière approche puisque la version est maintenant en version candidate stable release "1.0.0-rc01"
.
La nouvelle sortie de la boîte disponibles comportement est appelé HideBottomViewOnScrollBehavior
. Réglez-le sur le BottomNavigationView
comme
app:layout_behavior="@string/hide_bottom_view_on_scroll_behavior"
comme décrit dans le dernier docs.
Voici un exemple complet:
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="@+id/navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:labelVisibilityMode="selected"
app:layout_behavior="@string/hide_bottom_view_on_scroll_behavior"
android:layout_gravity="bottom"
app:layout_insetEdge="bottom"
app:menu="@menu/navigation" />
comme pour cacher la barre D'outils sur le défilement, vous devez vous assurer que le contenu est une classe qui supporte le dernier défilement comme RecyclerView
et NestedScrollView
.
cela garantit que tout fonctionne comme indiqué dans le animation sur les spécifications de conception
PS: labelVisibilityMode
est un autre ajout cool que vous obtenez gratuitement pour prendre le problème de mise à jour et qui est décrit en profondeur dans le spécifications de conception.