Widok przewijania nakładki za pomocą AppBarLayout

Chcę zaimplementować wzór "elastycznej przestrzeni z nakładającą się zawartością" z Technik przewijania materiału , takich jak w ten film : Elastyczna przestrzeń z nakładającymi się treściami GIF

Mój układ XML wygląda teraz następująco:

<android.support.design.widget.CoordinatorLayout 
    android:layout_width="match_parent"
    android:layout_height="match_parent">

  <android.support.design.widget.AppBarLayout
      android:layout_width="match_parent"
      android:layout_height="192dp"
      android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

    <android.support.design.widget.CollapsingToolbarLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_scrollFlags="scroll|exitUntilCollapsed">

      <android.support.v7.widget.Toolbar
          android:layout_height="?attr/actionBarSize"
          android:layout_width="match_parent"
          app:layout_collapseMode="pin"/>
    </android.support.design.widget.CollapsingToolbarLayout>
  </android.support.design.widget.AppBarLayout>

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

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">
      <....>
    </LinearLayout>
  </android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>

Czy istnieje łatwy sposób, aby to osiągnąć za pomocą biblioteki Design? Czy też muszę zbudować własny Koordynatorlayout.Zachowanie aby to zrobić?

Author: Christopher Orr, 2015-06-25

2 answers

W rzeczywistości nakładanie widoku przewijania za pomocą AppBarLayout jest częścią biblioteki Android Design Support Library: możesz użyć atrybutu app:behavior_overlapTop na swoim NestedScrollView (lub dowolnego widoku za pomocą ScrollingViewBehavior), aby ustawić nakładkę:

<android.support.v4.widget.NestedScrollView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    app:behavior_overlapTop="64dp">

Zauważ, że app:behavior_overlapTop działa tylko na widokach, które mają app:layout_behavior="@string/appbar_scrolling_view_behavior", ponieważ jest to zachowanie, które używa atrybutu( nie widoku ani nadrzędnej grupy widoków, do której atrybuty Zwykle się odnoszą), stąd behavior_ prefiks.

Lub ustawić go programowo za pomocą setOverlayTop():

NestedScrollView scrollView = ...
CoordinatorLayout.LayoutParams params = 
    (CoordinatorLayout.LayoutParams) scrollView.getLayoutParams();
AppBarLayout.ScrollingViewBehavior behavior =
    (AppBarLayout.ScrollingViewBehavior) params.getBehavior();
behavior.setOverlayTop(128); // Note: in pixels
 116
Author: ianhanniballake,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2016-01-17 01:02:38

Oprócz zaakceptowanej odpowiedzi , wywołaj setTitleEnabled(false) na Twoim CollapsingToolbarLayout, aby Tytuł pozostał na górze, jak w przykładzie.

Tak:

CollapsingToolbarLayout.setTitleEnabled(false);

Lub dodając go w xml tak:

app:titleEnabled="false"

W przeciwnym razie tytuł może zniknąć za nakładającymi się treściami, chyba że oczywiście tego chcesz.

 19
Author: G.deWit,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-05-23 12:02:47