2015-06-30 19 views
10

W bibliotece wsparcia projektowania (z I/O) Google wprowadził AppBarLayout. Próbuję uczynić pasek narzędzi animowanym poza ekranem, gdy użytkownik przewija stronę internetową w WebView w Fragmentie. To działa, gdy umieszczam mój element WebView wewnątrz NestedScrollView, ale to powoduje przewijanie przez bug WebView i sprawia, że ​​"szczypta-zoom" jest niemożliwy. Jak mogę odpowiedzieć AppBarLayout (animacja daleko podczas przewijania w dół, powrót po przewinięciu w górę, podobnie jak w NestedScrollView) do WebView? To są moje pliki XML: Główny układ:Uczyń AppBarLayout odpowiedzią na przewijanie w WebView

<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:fitsSystemWindows="true" 
android:id="@+id/main_coordinatorlayout"> 
<android.support.design.widget.AppBarLayout 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" 
    android:id="@+id/appBarLayout"> 
    <android.support.v7.widget.Toolbar 
     android:layout_width="match_parent" 
     android:layout_height="?attr/actionBarSize" 
     android:background="?attr/colorPrimary" 
     android:id="@+id/toolbar" 
     app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" 
     app:popupTheme="@style/Theme.AppCompat.Light" 
     app:layout_scrollFlags="scroll|enterAlways"/> 
    <android.support.design.widget.TabLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:id="@+id/tabLayout"/> 
</android.support.design.widget.AppBarLayout> 

<android.support.v4.view.ViewPager 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:id="@+id/viewPager" 
    app:layout_behavior="@string/appbar_scrolling_view_behavior" /> 
<android.support.design.widget.FloatingActionButton 
    android:id="@+id/fab" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    app:layout_anchor="@id/viewPager" 
    app:layout_anchorGravity="bottom|right|end" 
    app:borderWidth="0dp" 
    android:layout_margin="16dp" 
    android:src="@drawable/ic_action_autorenew" /> 

Kod mojego fragmentu zawierającego webview:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
xmlns:app="http://schemas.android.com/apk/res-auto" 
android:orientation="vertical" 
android:layout_width="match_parent" 
android:layout_height="match_parent"> 

<WebView 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:id="@+id/webView" 
    android:layout_gravity="center_horizontal" 
    app:layout_behavior="@string/appbar_scrolling_view_behavior" /> 

Z góry dzięki!

+0

Wszelkie postępy w tej sprawie? Również chce podłączyć widok z przeglądarki za pomocą paska narzędzi. – nilsi

+0

Nie, przepraszam, na razie zrezygnowałem z tego. Jeśli znajdziesz rozwiązanie, bardzo chciałbym to usłyszeć, ponieważ nadal jestem zainteresowany. –

+2

Potrzebowałem czegoś takiego. Podczas wyszukiwania w Internecie znalazłem ten [projekt github] (https://github.com/takahirom/webview-in-coordinatorlayout). Potrzebujesz tylko klasy 'NestedWebView'. Działa całkiem dobrze, chociaż przewijanie nie wydaje się bardzo płynne. – torque203

Odpowiedz

11

Dzięki @torque203 za udzielenie tej odpowiedzi. Przerzucam to, aby zwrócić na to więcej uwagi.

Możesz rozszerzyć przeglądanie i implementację NestedScrollingChild. Na przykład można użyć obiektu NestedWebView znajdującego się w this Github project.

Stamtąd można zachowywać się jak to jest normalny widok, który obsługuje zagnieżdżone przewijany jak RecyclerView:

<your.package.name.NestedWebView 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    app:layout_behavior="@string/appbar_scrolling_view_behavior" /> 

W moim przypadku użycia, to działało w porządku.

Znów przyznano @torque203 za znalezienie tego projektu Github.

+0

Program NestedWebView nie działał poprawnie, gdy testowałem go za pomocą 'CollapsingToolbarLayout'. Najpoważniejszym problemem jest to, że zoom przybliżenia w ogóle nie działa poprawnie; przeskakuje w inne miejsce na stronie po każdym zbliżeniu. Dodatkowe problemy polegają na tym, że animacja przewijania aplikacji jest przerywana, a klasa nie wydaje się poprawnie śledzić pochodzenia w przypadku zagnieżdżonych wysyłek przewijania. (Testowałem z obsługą 23.2.0 i 23.3.0.) –

+0

@LorneLaliberte Dodałem żądanie ściągnięcia do projektu [github] (https://github.com/takahirom/webview-in-coordinatorlayout) wspomnianego w odpowiedzi, że naprawia skok podczas gestów wielodotykowych, takich jak uszczypnięcie, aby powiększyć. – Pete

0

Rzeczy umieszczone wewnątrz CoordinatorLayout muszą być zaprojektowane i wdrożone do pracy z nim lub nie będą koordynować z innymi widokami rodzeństwa. Ale cóż ... Toolbar nie jest do tego przystosowany. AppBarLayout jest tylko komponentem, który jest przygotowany, aby Toolbar działał idealnie z CoordinatorLayout.

LinearLayout nie jest przeznaczony do pracy z CoordinatorLayout.It jest bardziej proste, wystarczy dodać atrybut do LinearLayout mówi jego zachowanie przewijania

<LinearLayout 
... 
app:layout_behavior="@string/appbar_scrolling_view_behavior" 
... 
> 

można spróbować zrobić AppBarLayout odpowiedzi na WebView przez to jest teraz bezpośrednim potomkiem CoordinatorLayout.

<android.support.v4.widget.NestedScrollView 
android:layout_width="match_parent" 
android:layout_height="match_parent" 
android:fillViewport="true" 
app:layout_behavior="@string/appbar_scrolling_view_behavior" 
> 
<LinearLayout 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:orientation="vertical" 
    > 
    ... 
</LinearLayout> 

Scrollview nie został zaprojektowany do pracy z CoordinatorLayout (ponownie). Musisz użyć kolejnej, NestedScrollView, dostępnej w Bibliotece Wsparcia Androida v4, zaprojektowanej do współpracy z CoordinatorLayout od urodzenia.

Z tego samego powodu, należy pamiętać, że klasyczny ListView nie działa również z CoordinatorLayout. Działa tylko RecyclerView.

+0

Dziękuję za odpowiedź, ale jak wspomniałem w moim początkowym wpisie, robi to ukrywanie paska narzędzi podczas przewijania, ale także powoduje przewijanie/nieprzewidywalność i uniemożliwia uszczypnięcie w celu powiększenia. Poszukuję rozwiązania, dzięki czemu nadal mogę uszczypnąć lub powiększyć. Czy możesz zaproponować jakieś? Ponieważ to uniemożliwia, ale wciąż dziękuję za odpowiedź. –

+0

Kluczem było dla mnie dodanie 'app: layout_behavior =" @ string/appbar_scrolling_view_behavior "' do mojego layoutu zaraz po układzie paska aplikacji, ale aby całkowicie USUNĄĆ atrybut 'app: layout_scrollFlags =" scroll | enterAlways "' z paska narzędzi . Umożliwiło to przewijanie bez zmiany wysokości paska narzędzi i bez żadnego problemu z widokiem zawartości strony/zawinięcia widoku przewijania. – Breeno

Powiązane problemy