android Lollipop toolbar: comment masquer/afficher la barre d’outils lors du défilement?
J'utilise le nouveau widget de barre d'outils introduit dans appcompat/support-v7. Je voudrais masquer/afficher la barre d'outils selon que l'utilisateur fait défiler la page vers le haut ou vers le bas, comme dans la nouvelle application Google PlayStore ou NewsStand. Existe-t-il quelque chose de intégré dans le widget de barre d’outils ou devrais-je l’utiliser conjointement avec FrameLayout et ObservableScrollView?
Autant que je sache, rien n’est prévu pour vous. Cependant, vous pouvez consulter le code source Google IO, en particulier le BaseActivity . Recherchez "masquer automatiquement" ou regardez onMainContentScrolled
Afin de cacher la Toolbar, vous pouvez simplement faire quelque chose comme ceci:
toolbar.animate().translationY(-toolbar.getBottom()).setInterpolator(new AccelerateInterpolator()).start();
Si vous voulez le montrer à nouveau, vous appelez:
toolbar.animate().translationY(0).setInterpolator(new DecelerateInterpolator()).start();
Pour masquer la barre d'outils, vous pouvez simplement faire:
getSupportActionBar().hide();
Il suffit donc d’un écouteur de défilement et de masquer la barre d’outils lorsque l’utilisateur défile
Cacher:
getSupportActionBar().hide();
Spectacle:
getSupportActionBar().show();
La réponse est simple. Il suffit de mettre en œuvre OnScrollListeneret de masquer/afficher votre barre d’outils dans le programme d’écoute. Par exemple, si vous avez listview/recyclerview/gridview, suivez l'exemple.
Dans votre méthode MainActivity Oncreate, initialisez la barre d'outils.
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
toolbar = (Toolbar) findViewById(R.id.toolbar);
if (toolbar != null) {
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayShowHomeEnabled(true);
}
}
Et puis implémenter la OnScrollListener
public RecyclerView.OnScrollListener onScrollListener = new RecyclerView.OnScrollListener() {
boolean hideToolBar = false;
@Override
public void onScrollStateChanged(RecyclerView recyclerView, int newState) {
super.onScrollStateChanged(recyclerView, newState);
if (hideToolBar) {
((ActionBarActivity)getActivity()).getSupportActionBar().hide();
} else {
((ActionBarActivity)getActivity()).getSupportActionBar().show();
}
}
@Override
public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
super.onScrolled(recyclerView, dx, dy);
if (dy > 20) {
hideToolBar = true;
} else if (dy < -5) {
hideToolBar = false;
}
}
};
J'ai eu l'idée de: https://stackoverflow.com/a/27063901/1079773
Vous pouvez utiliser la bibliothèque d’aide Android Design pour afficher/masquer la barre d’outils.
Voir ceci . http://Android-developers.blogspot.kr/2015/05/Android-design-support-library.html
Et il y a des exemples de détails ici . http://inthecheesefactory.com/blog/Android-design-support-library-codelab/fr
Il y a en fait un bon nombre de manières de cacher/montrer la barre d'outils pendant que vous faites défiler le contenu. L’une des méthodes consiste à le faire via la bibliothèque de support de conception Android ou plus précisément la présentation de coordinateur. super structure du cadre.
Fondamentalement, tout ce que vous avez à faire est d’avoir la structure suivante dans votre fichier de mise en page et d’obtenir le résultat souhaité.
<CoordinatorLayout>
<AppBarLayout>
</AppBarLayout>
<NestedScrollView>
</NestedScrollView>
</CoordinatorLayout>
J'ai en fait réalisé une vidéo pour expliquer comment cela peut se faire étape par étape. N'hésitez pas à le vérifier et laissez-moi savoir si cela aide. Merci! :)
Pour masquer le menu d'un fragment particulier:
setHasOptionsMenu(true); //Inside of onCreate in FRAGMENT:
@Override
public void onPrepareOptionsMenu(Menu menu) {
menu.findItem(R.id.action_search).setVisible(false);
}
J'ai essayé d'implémenter le même comportement, voici l'essentiel du code montrant et cachant la barre d'outils (insérez n'importe quelle classe contenant votre RecyclerView):
int toolbarMarginOffset = 0
private int dp(int inPixels){
return (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, inPixels, getApplicationContext().getResources().getDisplayMetrics());
}
public RecyclerView.OnScrollListener onScrollListenerToolbarHide = new RecyclerView.OnScrollListener() {
@Override
public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
super.onScrolled(recyclerView, dx, dy);
toolbarMarginOffset += dy;
if(toolbarMarginOffset>dp(48)){
toolbarMarginOffset = dp(48);
}
if(toolbarMarginOffset<0){
toolbarMarginOffset = 0;
}
ViewGroup.MarginLayoutParams params = (ViewGroup.MarginLayoutParams)toolbar.getLayoutParams();
params.topMargin = -1*toolbarMarginOffset;
toolbar.setLayoutParams(params);
}
};
J'ai inclus la fonction dp pour convertir des pixels en dp mais, évidemment, réglez-la sur la hauteur de votre barre d'outils. (remplacez dp (48) par la hauteur de votre barre d’outils)
Où que vous installiez votre RecyclerView, incluez ceci:
yourListView.setOnScrollListener(onScrollListenerToolbarHide);
Cependant, il existe quelques problèmes supplémentaires si vous utilisez également un SwipeRefreshLayout.
J'ai dû définir le marginTop du premier élément de l'adaptateur pour RecyclerView sur la hauteur de la barre d'outils plus le décalage d'origine. (Un peu de bidouille je sais). La raison en est que j’ai constaté que si je changeais le code ci-dessus afin d’inclure la modification du marginTop de recyclerView lors du défilement, c’était une expérience agitée. Alors c'est comme ça que je l'ai surmonté. Donc, fondamentalement, configurez votre présentation de sorte que votre barre d’outils flotte au-dessus de RecyclerView (en la coupant) quelque chose comme ceci (dans onBindViewHolder de votre adaptateur personnalisé RecyclerView):
if(position==0){
ViewGroup.MarginLayoutParams params = (ViewGroup.MarginLayoutParams)holder.card.getLayoutParams();
// params.height = ViewGroup.LayoutParams.WRAP_CONTENT;
params.topMargin = dp(10+48);
}
Enfin, comme il existe un décalage important, le cercle d’actualisation de RecyclerViews sera tronqué. Vous devrez donc le compenser (revenez dans onCreate de votre classe qui tient votre RecyclerView):
swipeLayout.setProgressViewOffset(true,dp(48),dp(96));
J'espère que ça aidera quelqu'un. C'est ma première réponse détaillée donc j'espère avoir été suffisamment détaillé.
Ajoutez simplement cette propriété dans votre barre d’outils et c’est fait
app:layout_scrollFlags="scroll|enterAlways"
N'est pas génial
Il existe une bibliothèque Android appelée Android Design Support Library, une bibliothèque pratique dans laquelle vous pouvez trouver toutes les choses de conception fantaisiste de Material que la documentation Material présente sans vous dire comment les faire.
C'est bien présenté dans cet article Blog Android . La "Barre d'outils réductrice" en particulier est ce que vous recherchez.
Une bibliothèque et une démo avec le code source complet pour le défilement des barres d’outils ou tout type d’en-tête peuvent être téléchargées ici:
https://github.com/JohannBlake/JBHeaderScroll
Les en-têtes peuvent être Barres d'outils, LinearLayouts, RelativeLayouts ou tout type de vue que vous utilisez pour créer un en-tête.
La zone de défilement peut être n’importe quel type de contenu de défilement, y compris ListView, ScrollView, WebView, RecyclerView, RelativeLayout, LinearLayout ou tout ce que vous voulez.
Il existe même un support pour les en-têtes imbriqués.
Il est en effet complexe de synchroniser les en-têtes (barres d’outils) et le contenu déroulant comme indiqué dans Google Kiosque.
Cette bibliothèque ne nécessite la mise en œuvre d'aucun type de onScrollListener.
Les solutions énumérées ci-dessus par d'autres ne sont que des solutions à moitié cuites qui ne prennent pas en compte le fait que le bord supérieur de la zone de contenu défilable situé sous la barre d'outils doit être initialement aligné sur le bord inférieur de la barre d'outils, puis pendant le défilement, la zone de contenu doit être repositionné et éventuellement redimensionné. JBHeaderScroll gère tous ces problèmes.
J'ai implémenté une classe utilitaire pour faire toute l'animation masquer/afficher la barre d'outils lors du défilement. Vous pouvez voir l'article ici http://rylexr.tinbytes.com/2015/04/27/how-to-hideshow-Android-toolbar-when-scrolling-google-play-musics-behavior/ . Le code source est ici https://github.com/rylexr/Android-show-hide-toolbar .