2016-12-22 11 views
9

Poniżej znajduje się mój kod snipet.Jak sprawić, aby jeden z widoków podrzędnych nestedscrollview był lepki?

<?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" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:id="@+id/coordinate" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:background="@android:color/background_light" 
    tools:context="com.ajinkyabadve.mywatchlist.movie_detail_new.MovieActivity"> <ProgressBar 
     android:id="@+id/progressBar" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_gravity="center" 
     android:visibility="gone" /> 

    <include 
     android:id="@+id/retryLayoutNoInternet" 
     layout="@layout/no_internet_retry_layout" 
     android:visibility="gone" /> 
    <android.support.design.widget.AppBarLayout 
     android:id="@+id/appbar" 
     android:layout_width="match_parent" 
     android:layout_height="400dp" 
     android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"> 

     <android.support.design.widget.CollapsingToolbarLayout 
      android:id="@+id/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|enterAlwaysCollapsed"> 

      <ImageView 
       android:id="@+id/poster" 
       android:layout_width="match_parent" 
       android:layout_height="match_parent" 
       android:contentDescription="@string/poster_of_movie" 
       android:fitsSystemWindows="true" 
       android:scaleType="centerCrop" 
       app:layout_collapseMode="parallax" /> 

     </android.support.design.widget.CollapsingToolbarLayout> 

    </android.support.design.widget.AppBarLayout> 
<include 
     android:id="@+id/content" 
     layout="@layout/content_movie" /> 

    <android.support.v7.widget.Toolbar 
     android:id="@+id/toolbar" 
     android:layout_width="match_parent" 
     android:layout_height="112dp" 
     android:background="@color/colorPrimary" 
     android:elevation="4dp" 
     app:layout_anchor="@id/appbar" 
     app:layout_anchorGravity="bottom" 
     app:layout_collapseMode="pin" 
     app:theme="@style/ThemeOverlay.AppCompat.Light"> 

     <LinearLayout 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:layout_gravity="center" 
      android:layout_marginBottom="8dp" 
      android:minHeight="?android:attr/actionBarSize" 
      android:orientation="vertical"> 

      <TextView 
       android:id="@+id/movieTitle" 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:text="Title" 
       android:textAppearance="@style/TextAppearance.AppCompat.Widget.ActionBar.Title.Inverse" /> 

      <TextView 
       android:id="@+id/movieOrignalTitle" 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:layout_marginTop="4dp" 
       android:text="subtitle" 
       android:textAppearance="@style/TextAppearance.AppCompat.Widget.ActionBar.Subtitle.Inverse" /> 
     </LinearLayout> 
    </android.support.v7.widget.Toolbar> 

A poniżej jest content_movie.xml

<?xml version="1.0" encoding="utf-8"?> 
<android.support.v4.widget.NestedScrollView 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/content_movie" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:paddingBottom="@dimen/activity_vertical_margin" 
    android:paddingLeft="@dimen/activity_horizontal_margin" 
    android:paddingRight="@dimen/activity_horizontal_margin" 
    android:paddingTop="@dimen/activity_vertical_margin" 
    app:layout_behavior="@string/appbar_scrolling_view_behavior" 
    tools:context="com.ajinkyabadve.mywatchlist.movie_detail_new.MovieActivity" 
    tools:showIn="@layout/activity_movie"> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:orientation="vertical"> 

     <include layout="@layout/overview" /> 

     <include layout="@layout/cast" /> 

     <include layout="@layout/facts" /> 


<!-- Below tablayout I want to work as a sticky header --> 
     <!--<android.support.design.widget.TabLayout--> 
     <!--android:layout_width="match_parent"--> 
     <!--android:layout_height="100dp"--> 
     <!--android:background="@color/colorPrimary" />--> </LinearLayout> 
</android.support.v4.widget.NestedScrollView> 

komentowanym tablayout powinien działać jako lepkiej nagłówku (co oznacza, że ​​nie należy przewinąć kiedy dotrze do góry podczas przewijania) .Jak do osiągnąć ten efekt za pomocą układu współrzędnych? LUB w jakikolwiek inny sposób.Czy możemy użyć niestandardowego zachowania czy coś takiego?

Odpowiedz

5

można wykorzystywać następujące biblioteki, aby osiągnąć ten efekt.

https://github.com/emilsjolander/StickyScrollViewItems

Jest to w zasadzie widok niestandardowy przewijania oraz w tym widoku przewijania można dokonać żadnego widoku dziecko lub układ jako lepki dodając tag:

android:tag="sticky"

Nadzieję, że to pomaga!

+0

Tak, dziękuję. Ale używając widoku przewijania, po prostu skopiuj kod z biblioteki i rozszerz go za pomocą Nestedscrollview. – Ajinkya

1

Wszystko, co musisz zrobić, to przenieść TabLayout do AppBarLayout.

Ponieważ TabLayout nie ma zdefiniowanych znaczników przewijania, podczas przewijania będzie trzymać się górnej części układu.

Po wykonaniu tej czynności należy zmienić wysokość paska aplikacji na wrap_content, a wysokość 400 dp musi zostać zmieniona na CollapsingToolbarLayout.

Właśnie wziął AppBarLayout fragment z całego XML wykazać:

<android.support.design.widget.AppBarLayout 
    android:id="@+id/appbar" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"> 

    <android.support.design.widget.CollapsingToolbarLayout 
     android:id="@+id/collapsingToolbarLayout" 
     android:layout_width="match_parent" 
     android:layout_height="400dp" 
     app:contentScrim="?attr/colorPrimary" 
     app:expandedTitleMarginEnd="64dp" 
     app:expandedTitleMarginStart="48dp" 
     app:layout_scrollFlags="scroll|enterAlwaysCollapsed"> 

     <ImageView 
      android:id="@+id/poster" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:contentDescription="@string/poster_of_movie" 
      android:fitsSystemWindows="true" 
      android:scaleType="centerCrop" 
      app:layout_collapseMode="parallax" /> 

    </android.support.design.widget.CollapsingToolbarLayout> 

    <android.support.design.widget.TabLayout 
     android:layout_width="match_parent" 
     android:layout_height="100dp" 
     android:background="@color/colorPrimary" /> 

</android.support.design.widget.AppBarLayout> 
+0

tablayout i viewpager powinna zakończyć się do zagnieżdżonego widoku przewijania i kiedy przewijać w górę powinien trzymać poniżej toolbar.In ta sprawa zawsze wyświetla się pod paskiem narzędzi. – Ajinkya

0

Trzeba umieścić Toolbar wewnątrz CollapsingToolbarLayout

<android.support.design.widget.CoordinatorLayout           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/coordinate" 
android:layout_width="match_parent" 
android:layout_height="match_parent" 
android:background="@android:color/background_light" 
      tools:context="com.ajinkyabadve.mywatchlist.movie_detail_new.MovieActivity">  

<ProgressBar 
    android:id="@+id/progressBar" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_gravity="center" 
    android:visibility="gone" /> 

<include 
    android:id="@+id/retryLayoutNoInternet" 
    layout="@layout/no_internet_retry_layout" 
    android:visibility="gone" /> 
<android.support.design.widget.AppBarLayout 
    android:id="@+id/appbar" 
    android:layout_width="match_parent" 
    android:layout_height="400dp" 
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"> 

    <android.support.design.widget.CollapsingToolbarLayout 
     android:id="@+id/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|enterAlwaysCollapsed"> 

     <ImageView 
      android:id="@+id/poster" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:contentDescription="@string/poster_of_movie" 
      android:fitsSystemWindows="true" 
      android:scaleType="centerCrop" 
      app:layout_collapseMode="parallax" /> 

     <android.support.v7.widget.Toolbar 
    android:id="@+id/toolbar" 
    android:layout_width="match_parent" 
    android:layout_height="112dp" 
    android:background="@color/colorPrimary" 
    android:elevation="4dp" 
    app:layout_anchor="@id/appbar" 
    app:layout_anchorGravity="bottom" 
    app:layout_collapseMode="pin" 
    app:theme="@style/ThemeOverlay.AppCompat.Light"> 

     <TextView 
      android:id="@+id/movieTitle" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:text="Title"    android:textAppearance="@style/TextAppearance.AppCompat.Widget.ActionBar.Title.Inverse" /> 

     <TextView 
      android:id="@+id/movieOrignalTitle" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:layout_marginTop="4dp" 
      android:text="subtitle" 
        android:textAppearance="@style/TextAppearance.AppCompat.Widget.ActionBar.Su  btitle.Inverse" /> 
    </LinearLayout> 
</android.support.v7.widget.Toolbar> 


    </android.support.design.widget.CollapsingToolbarLayout> 

</android.support.design.widget.AppBarLayout> 
<include 
    android:id="@+id/content" 
    layout="@layout/content_movie" /> 

Powiązane problemy