Muszę stworzyć interfejs taki jak Google Newsstand, który jest rodzajem ViewPagera (przewijanie w poziomie) nad zwijanym nagłówkiem (przewijanie w pionie). Jednym z moich wymagań jest korzystanie z nowej biblioteki Design Support Library przedstawionej na Google IO 2015. ( http://android-developers.blogspot.ca/2015/05/android-design-support-library.html )
Na podstawie próbki stworzonej przez Chrisa Banesa ( https://github.com/chrisbanes/cheesesquare ) doszedłem do punktu, w którym jestem w stanie wykonać zachowanie zwijania, ale z podstawowym LinearLayout (bez przewijania poziomego).
Próbowałem zamienić LinearLayout na ViewPager i otrzymałem pusty ekran. Bawiłem się: szerokością, wagą i wszelkiego rodzaju grupami widoków, ale ... nadal był pusty ekran. Wygląda na to, że ViewPager i NestedScrollView się nie lubią.
Próbowałem obejścia tego problemu za pomocą HorizontalScrollView: działa, ale tracę zalety funkcji PagerTitleStrip i skupienie się na jednym panelu (mogę zatrzymać poziomo między 2 panelami).
Teraz nie mam już pomysłów, jeśli ktoś może mnie doprowadzić do rozwiązania ...
Dzięki
Oto mój najnowszy plik układu:
<?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
wnętrzeLinearLayout
? Ciekawe, czy to renderujeViewPager
poprawnie.ViewPager
wewnętrznym aNestedScrollView
jako jedynymi układami - wydawało się, że działa dobrze. Udało mi się też zDrawerLayout
powodzeniem wpaść do . Być może jest inny aspekt twojego kodu uniemożliwiający pożądaną funkcjonalność. Chcesz udostępnić więcej swojego źródła?ViewPager
. Jestem w stanie przewijać widoki w górę iw dół, a także przewijać wViewPager
lewo / w prawo.Odpowiedzi:
Spotykam się z tym problemem, rozwiązuję go przez
setFillViewport (true)
w działalności
źródło
android:fillViewport="true"
doNestedScrollView
obiektu. Dokumentacja opisuje to jako atrybutDefines whether the scrollview should stretch its content to fill the viewport.
.android:fillViewport="true"
naNestedScrollView
i wewnątrzfragment
mamlistView
gdzie ja siedziałemandroid:nestedScrollingEnabled="true"
.. Naprawiono problem przewijaniaOK, stworzyłem małe demo z
ViewPager
iNestedScrollView
. Problem, z jakim miałem do czynienia, dotyczył wysokościViewPager
iListView
. Zrobiłem więc małą modyfikacjęListView
iViewPager's
pomiar wysokości.Jeśli ktoś chciałby zajrzeć do kodu, oto link: https://github.com/TheLittleNaruto/SupportDesignExample/
Wynik:
źródło
NestedScrollView
i używającLinearLayout
zamiast tego. Jakie byłyby korzyści z posiadaniaNestedScrollView
ponad a,LinearLayout
gdyby celem było przewijanie zawartości w ViewPager? Proszę popraw mnie jeżeli się mylę. : x ThanksDodaj
android:fillViewport="true"
swojeNestedScrollView
. Kropka.źródło
Zamiast umieszczać ViewPager wewnątrz NestedScrollView, zrób to na odwrót.
Umieść NestedScrollView w widokach podrzędnych wewnątrz ViewPager, który w istocie jest układem fragmentu. Jest również bardzo prawdopodobne, że nie będziesz nawet musiał używać NestedScrollView, jeśli układ listy Twojego fragmentu jest bardzo prosty.
Przykładowe układy
Układ działania:
Jeśli nie potrzebujesz TabLayout, możesz porzucić LinearLayout i uczynić ViewPager samodzielnym. Ale pamiętaj, aby użyć
app:layout_behavior="@string/appbar_scrolling_view_behavior"
atrybutów ViewPager.Układ prostego fragmentu:
Układ złożonego fragmentu:
Przykładowa aplikacja: CollapsingToolbarPoc
źródło
Miał te same problemy.
Podczas umieszczania NestedScrollView wokół ViewPager nie zadziała.
To, co DID działało, to umieszczenie NestedScrollView w układzie fragmentu, który ładuję, wewnątrz ViewPager.
źródło
możesz spróbować w ten sposób, przeglądarka działa dobrze, ale wysokość podglądu jest stała.
wciąż znajduję lepsze rozwiązanie ... więc proszę, daj mi znać, że w każdej chwili mogę to zrobić lepiej, dzięki
źródło
Miałem ten sam problem i po prostu naprawiłem go z pewnymi zmianami.
ViewPager
nie działa w ramachNestedScrollView
. Po prostu umieść swojeViewPager
jako bezpośrednie dzieckoCoordinatorLayout
. Następnie zawartość każdego fragmentu ViewPagera powinna być ujęta wNestedScrollView
. Otóż to.źródło
Nie musisz używać NestedScrollView, aby uzyskać efekty paralaksy. spróbuj czegoś takiego:
źródło
ViewPager
fragmenty będą eteremRecyclerView
lubNestedScrollView
. Jeśli tak nie jest (np.ListView
), Obejściem dla Lollipopa i nowszych jest zadzwońlistView.setNestedScrollingEnabled(true)
Miałem układ z paskiem narzędzi aplikacji z NestedScrollView pod nim, następnie wewnątrz zagnieżdżonego paska narzędzi był LinearLayout, poniżej LinearLayout był pager widoku. Pomysł polegał na tym, że LinearLayout wewnątrz NestedScrollView został naprawiony - można było przesuwać w lewo / w prawo między widokami pagera widoku, ale ta zawartość nie poruszała się w poziomie przynajmniej w . Nadal powinno być możliwe przewijanie całej zawartości w pionie ze względu na zagnieżdżony widok przewijania. To był pomysł. Więc ustawiłem zagnieżdżoną wysokość NestedScrollView na match_parent, wypełnij rzutnię, a następnie wszystkie układy potomne / ViewPager na wrap_content.
W mojej głowie to było słuszne. Ale to nie zadziałało - ViewPager pozwolił mi przejść w lewo / w prawo, ale bez przewijania w pionie, niezależnie od tego, czy zawartość strony przeglądarki została przesunięta poniżej dolnej części bieżącego ekranu, czy nie. Okazuje się, że było tak, ponieważ ViewPager nie respektuje zawartości wrap_content na swoich różnych stronach.
Obejrzałem to, podklasując ViewPager, aby zmieniał wysokość w zależności od aktualnie wybranego elementu, w pewnym sensie zmuszając go do zachowania się jak layout_height = "wrap_content":
Rozwiązanie zostało zainspirowane tą odpowiedzią . Pracował dla mnie!
źródło
po prostu umieść tę linię w NestedScrollView
źródło
Usunąłem NestedScrollView z głównego układu i wstawiony jako dominującej we wszystkich moich Fragment układów, które miały obciążenia w ViewPager stałe ten problem dla mnie.
źródło
Użyj poniższej klasy niestandardowej, aby rozwiązać problem. Nie zapomnij wywołać metody onRefresh () na pagechangelistener.
źródło
Miałem podobny problem (ale bez
CollapsingToolbarLayout
prostegoToolbar
+TabLayout
wewnątrzAppBarLayout
). Chciałem, aby pasek narzędzi przewijał się poza zasięgiem wzroku podczas przewijania zawartości plikuViewPager
wewnątrzNestedScrollView
.Mój układ wyglądał mniej więcej tak:
Ten układ nie działał zgodnie z przeznaczeniem, ale rozwiązałem go, po prostu pozbywając się
NestedScrollView
i używającLinearLayout
zamiast tego. U mnie zadziałało od razu na Android Support Library w wersji 23.1.0. Oto, jak skończył się układ:PS: To były właściwie dwa pliki układu w moim projekcie. Skopiowałem i wkleiłem je tutaj i próbowałem uporządkować je tak, jak wyglądałyby w jednym pliku. Przepraszam, jeśli schrzaniłem podczas kopiowania i wklejania, ale daj mi znać, jeśli tak jest, żebym mógł to naprawić.
źródło
Poniższe czynności powinny zapewnić odpowiednią wysokość pagera widoku. Fragment jest pierwszym fragmentem udostępnionym przez pager widoku.
źródło
Mam to samo życzenie, zagnieździć
ViewPager
wewnątrz aNestedScrollView
. Ale na mnie też nie działa. W moim przypadkuViewPager
znajduje się wewnątrz a,Fragment
więc mogę przełączać zawartość w zależności od interakcji z szufladą. Oczywiście AppBar, zwijanie itp. Oraz wszystkie nowe funkcje biblioteki wsparcia muszą działać.Jeśli użytkownik przewija stronę w pagerze w pionie, chcę, aby inne strony przewijały się tak samo, aby użytkownik miał ogólne wrażenie, że przewijał się sam pager.
To, co zrobiłem, co działa, polega na tym, że nie osadzam już
ViewPager
wewnątrz aNestedScrollView
, zamiast tego osadzam zawartość zawartych fragmentów wNestedScrollView
.Następnie w przypadku przewijania w jednym fragmencie informuję kontener o nowej pozycji przewijania, która go przechowuje.
Na koniec, po przesunięciu palcem w lewo lub w prawo wykrytym na pagerze (przy użyciu
addOnPageChangeListener
wyszukiwania stanów przeciągania) informuję docelowy fragment w lewo lub w prawo, gdzie musi przewinąć (na podstawie wiedzy o kontenerze), aby wyrównać z fragmentu, z którego pochodzę.źródło
Znam jedno działające rozwiązanie: używasz Activity, z CoordinatorLayout i używasz FrameLayout, kontenera. Następnie. użyj menedżera fragmentów, aby umieścić fragment w kontenerze. Na przykład mój kod:
I fragment:
Następnie użyj FragmentManager
źródło
LinearLayout
wewnątrz Fragmentu jest tutaj niepotrzebny. Zobacz moją odpowiedź, użyłem aLinearLayout
zamiast aFrameLayout
w układzie mojego działania, a katalogiem głównym mojego fragmentu jest ViewPager (bez układu zawijania).Po spędzeniu wielu godzin wypróbowałem wszystkie powyższe sugestie, w końcu udało mi się. Kluczem jest umieszczenie
NestedScrollView
wewnątrzPageViewer
i ustawlayout_behavior
aby'@string/appbar_scrolling_view_behavior'
dla OBU widokami. Ostateczny układ jest podobnyźródło
właśnie usunąłeś NestedScrollView w swoim XML i dodałeś ten kod do swojej klasy
yourGridView.setNestedScrollingEnabled(true);
źródło
W rzeczywistości NestedScrollView nie musi być bezpośrednim elementem równorzędnym CollapsingToolbarLayout w CoordinatorLayout. Osiągnąłem coś naprawdę dziwnego. Appbar_scrolling_view_behavior działa w 2 zagnieżdżonych fragmentach.
Układ mojej aktywności:
W frameLayout "kontenera" napompowałem ten fragment:
A fragmenty wewnątrz tego ViewPagera wyglądają następująco:
Fakt, że NestedScrollView może być tak głęboko w hierarchii elementów podrzędnych CoordinatorLayout i zachowaniach przewijania, które nadal działa, był dla mnie zaskoczeniem.
źródło