J'ai besoin de créer une interface comme Google Kiosque qui est une sorte de ViewPager (défilement horizontal) sur un en-tête réduit (défilement vertical). L'une de mes exigences est d'utiliser la nouvelle bibliothèque de support de conception présentée au Google IO 2015. ( http://android-developers.blogspot.ca/2015/05/android-design-support-library.html )
Sur la base de l'exemple créé par Chris Banes ( https://github.com/chrisbanes/cheesesquare ), j'ai atteint le point où je suis capable de faire le comportement de réduction mais avec un LinearLayout de base (sans défilement horizontal).
J'ai essayé de remplacer LinearLayout par un ViewPager et j'ai eu un écran vide. J'ai joué avec: la largeur, le poids et toutes sortes de groupes de vues mais .... toujours un écran vide. Il semble que ViewPager et NestedScrollView ne s'aiment pas.
J'ai essayé une solution de contournement en utilisant un HorizontalScrollView: cela fonctionne mais je perds l'avantage de la fonctionnalité PagerTitleStrip et la mise au point sur un seul panneau (je peux arrêter horizontalement entre 2 panneaux).
Maintenant je n'ai plus d'idées, si quelqu'un peut m'amener à une solution ...
Merci
Voici mon dernier fichier de mise en page:
<?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"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="@dimen/header_height"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginEnd="64dp"
app:expandedTitleMarginStart="48dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<include
layout="@layout/part_header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_collapseMode="parallax"/>
<android.support.v7.widget.Toolbar
android:id="@+id/activity_main_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:id="@+id/activity_main_nestedscrollview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<android.support.v4.view.ViewPager
android:id="@+id/activity_main_viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FFA0"/>
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>
ViewPager
intérieurLinearLayout
? Juste curieux de savoir si cela rendrait leViewPager
correctement.ViewPager
intérieurNestedScrollView
comme seules mises en page - cela semblait fonctionner correctement. J'ai également puDrawerLayout
réussir un . Peut-être y a-t-il un autre aspect de votre code qui empêche la fonctionnalité souhaitée. Vous souhaitez partager davantage votre source?ViewPager
. Je suis capable de faire défiler les vues de haut en bas, ainsi que de faire défiler laViewPager
gauche / droite.Réponses:
Je rencontre ce problème, je le résous en
setFillViewport (true)
en activité
la source
android:fillViewport="true"
à l'NestedScrollView
objet. La documentation décrit cet attribut commeDefines whether the scrollview should stretch its content to fill the viewport.
.android:fillViewport="true"
surNestedScrollView
et à l'intérieur dufragment
j'ai unlistView
endroit où j'étais assisandroid:nestedScrollingEnabled="true"
.. Correction du problème de défilementD'accord, j'ai fait une petite démo avec
ViewPager
etNestedScrollView
. Le problème auquel j'ai été confronté concernait la hauteurViewPager
et leListView
. Donc , je l' ai fait une petite modification surListView
etViewPager's
mesure de la hauteur.Si quelqu'un souhaite consulter le code, voici le lien: https://github.com/TheLittleNaruto/SupportDesignExample/
Production:
la source
NestedScrollView
et en utilisant un à laLinearLayout
place. Quels seraient les avantages d'avoir unNestedScrollView
over aLinearLayout
si tout le but est de faire défiler le contenu dans le ViewPager? Corrigez-moi si j'ai tort, s'il-vous plait. : x MerciAjoutez
android:fillViewport="true"
votreNestedScrollView
. période.la source
Au lieu de placer ViewPager à l'intérieur du NestedScrollView, faites-le dans l'autre sens.
Placez le NestedScrollView dans les vues enfants à l'intérieur du ViewPager, qui est essentiellement la disposition du fragment. Il est également très probable que vous n'ayez même pas besoin d'utiliser NestedScrollView si la disposition de la liste de votre Fragment est très simple.
Exemples de dispositions
Disposition de l'activité:
Si vous n'avez pas besoin de TabLayout, vous pouvez abandonner LinearLayout et rendre ViewPager autonome. Mais assurez-vous d'utiliser
app:layout_behavior="@string/appbar_scrolling_view_behavior"
dans les attributs ViewPager.Disposition du fragment simple:
Disposition du fragment complexe:
Exemple d'application: CollapsingToolbarPoc
la source
Eu les mêmes problèmes.
Lorsque vous placez NestedScrollView autour du ViewPager, cela ne fonctionnerait pas.
Ce qui a fonctionné, c'est de placer le NestedScrollView dans la mise en page du fragment que je charge dans le ViewPager.
la source
vous pouvez essayer comme ceci, le viewpager fonctionne bien, mais la hauteur du viewpager est fixe.
je suis toujours en train de trouver la meilleure solution ..., alors s'il vous plaît laissez-moi savoir que tout point peut le faire mieux, merci
la source
J'ai eu le même problème et je l'ai juste corrigé avec quelques modifications.
ViewPager
ne fonctionne pas dans leNestedScrollView
. Mettez simplement votreViewPager
comme un enfant direct de votreCoordinatorLayout
. Ensuite, le contenu de chaque fragment de ViewPager doit être inclus dansNestedScrollView
. C'est tout.la source
Vous n'avez pas besoin d'utiliser NestedScrollView pour avoir les effets de parallaxe. essayez quelque chose comme ça:
la source
ViewPager
fragments sont de l'étherRecyclerView
, ouNestedScrollView
. S'ils ne le sont pas (par exempleListView
), une solution de contournement pour Lollipop et leslistView.setNestedScrollingEnabled(true)
J'avais une mise en page avec une barre d'outils d'application avec NestedScrollView en dessous, puis à l'intérieur de la barre d'outils imbriquée se trouvait un LinearLayout, sous le LinearLayout se trouvait un pager de vue. L'idée était que le LinearLayout à l'intérieur du NestedScrollView a été corrigé - vous pouvez glisser à gauche / droite entre les vues du pagineur de vue, mais ce contenu ne se déplace pas, du moins horizontalement . Vous devriez toujours pouvoir faire défiler tout le contenu verticalement grâce à la vue de défilement imbriquée. C'était l'idée. J'ai donc défini la hauteur imbriquée de NestedScrollView sur match_parent, remplir la fenêtre, puis toutes les mises en page enfants / ViewPager sur wrap_content.
Dans ma tête c'était vrai. Mais cela n'a pas fonctionné - ViewPager m'a permis d'aller à gauche / droite, mais pas de défilement vertical, que le contenu de la page du visualiseur soit poussé en dessous du bas de l'écran actuel ou non. Il s'avère que c'était essentiellement parce que le ViewPager ne respecte pas wrap_content sur ses différentes pages.
J'ai contourné cela en sous-classant le ViewPager pour le faire changer de hauteur en fonction de l'élément actuellement sélectionné, en le forçant à se comporter comme layout_height = "wrap_content":
La solution s'est inspirée de cette réponse . A travaillé pour moi!
la source
il suffit de mettre cette ligne dans NestedScrollView
la source
J'ai supprimé NestedScrollView de la mise en page principale et inséré en tant que parent dans toutes mes mises en page Fragment qui étaient censées se charger dans ViewPager, ce problème a été résolu pour moi.
la source
Utilisez la classe personnalisée ci-dessous pour résoudre votre problème. N'oubliez pas d'appeler la méthode onRefresh () sur pagechangelistener.
la source
J'avais un problème similaire (mais sans
CollapsingToolbarLayout
, juste un simpleToolbar
+TabLayout
dans leAppBarLayout
). Je voulais que la barre d'outils défile hors de vue lors du défilement du contenu d'unViewPager
dans leNestedScrollView
.Ma mise en page ressemblait à ceci:
Cette mise en page ne fonctionnait pas comme prévu, mais je l'ai résolue en me débarrassant simplement de
NestedScrollView
et en utilisant unLinearLayout
. Cela a fonctionné pour moi tout de suite sur la bibliothèque de support Android v23.1.0. Voici comment la mise en page s'est terminée:PS: Il s'agissait en fait de deux fichiers de mise en page dans mon projet. Je les ai copiés et collés ici et j'ai essayé de les structurer comme cela ressemblerait dans un seul fichier. Je suis désolé si je me suis trompé lors du copier-coller, mais s'il vous plaît laissez-moi savoir si c'est le cas afin que je puisse le réparer.
la source
Les éléments suivants doivent garantir la bonne hauteur du téléavertisseur. Le fragment est le premier fragment fourni par le pager de vue.
la source
J'ai le même souhait, nid a l'
ViewPager
intérieur aNestedScrollView
. Mais cela ne fonctionne pas non plus pour moi. Dans mon cas, leViewPager
est à l'intérieur d'unFragment
afin que je puisse changer de contenu en fonction des interactions avec le tiroir. Bien sûr, AppBar, collapse, etc. et toutes les nouvelles fonctionnalités de la bibliothèque de support doivent fonctionner.Si un utilisateur fait défiler verticalement une page dans le pager, je veux que les autres pages défilent de la même manière, pour donner à l'utilisateur l'impression générale que le pager lui-même a défilé.
Ce que j'ai fait, ce qui fonctionne, c'est que je n'intègre plus l'
ViewPager
intérieur aNestedScrollView
, à la place, j'intègre le contenu des fragments contenus dans un fichierNestedScrollView
.Ensuite, en cas de défilement dans un fragment, j'informe le conteneur de la nouvelle position de défilement, qui le stocke.
Enfin, lors d'un balayage vers la gauche ou vers la droite détecté depuis le pager (en utilisant la
addOnPageChangeListener
recherche des états de glissement), j'informe le fragment cible gauche ou droit où il doit défiler (en fonction de la connaissance du conteneur) pour être aligné à partir du fragment dont je viens.la source
Je connais une solution de travail: vous utilisez Activity, avec CoordinatorLayout et utilisez FrameLayout, container. Ensuite. utilisez le gestionnaire de fragments pour mettre le fragment dans le conteneur. Par exemple mon code:
Et Fragment:
Ensuite, utilisez FragmentManager
la source
LinearLayout
mise en page du fragment est inutile ici. Voir ma réponse, j'ai utilisé aLinearLayout
au lieu de aFrameLayout
dans la mise en page de mon activité, et la racine de mon fragment est un ViewPager (pas de mise en page enveloppante).Après avoir passé des heures à essayer toutes les suggestions ci-dessus, je l'ai finalement fait fonctionner. La clé est de mettre à l'
NestedScrollView
intérieurPageViewer
, et un ensemblelayout_behavior
à'@string/appbar_scrolling_view_behavior'
des DEUX vues. La mise en page finale est commela source
vous venez de supprimer le NestedScrollView sur votre xml et ajoutez ce code sur votre classe
yourGridView.setNestedScrollingEnabled(true);
la source
En fait, NestedScrollView n'a pas besoin d'être le frère direct de CollapsingToolbarLayout dans CoordinatorLayout. J'ai réalisé quelque chose de vraiment bizzare. L'appbar_scrolling_view_behavior fonctionne dans 2 fragments imbriqués.
Ma disposition d'activité:
Dans le frameLayout "container", j'ai gonflé ce fragment:
Et les fragments à l'intérieur de ce ViewPager ressemblent à ceci:
Le fait que NestedScrollView puisse être si profond dans la hiérarchie des enfants de CoordinatorLayout et les comportements de défilement toujours fonctionne m'a surpris.
la source