NestedScrollview 重叠 CollapsingToolbarLayout 像 gmusic 应用程序

Question

我想复制 google play music android 应用程序的行为。 在该应用程序中，当您使用“我的音乐”专辑选项卡时，专辑列表在操作栏（橙色部分）上方开始，因为它是“扩展的”。当您向上滚动专辑列表时，橙色部分向上滚动但比列表慢。 当您向下滚动列表时，“橙色块”也会向下滚动。 此行为与正在滚动的工具栏和选项卡无关。

我正在尝试使用新的材料设计库重现这种行为。 使用 Cheesquare 中的详细活动 xml 作为起点：

<android.support.design.widget.CoordinatorLayout 
    android:id="@+id/main_content"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">
    <android.support.design.widget.AppBarLayout
        android:id="@+id/appbar"
        android:layout_width="match_parent"
        android:layout_height="@dimen/detail_backdrop_height"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        android:fitsSystemWindows="true">

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

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

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
            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"
            android:paddingTop="24dp">
        <....>
       </LinearLayout>
    </android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>

我尝试将背景“imageview”与彩色背景一起使用，并尝试将其移动到嵌套视图旁边。 如果我将 imageview 放在具有视差效果的 CollapsingToolbarLayout 中，问题是我无法使其高度更大以位于nestedscrollview 之下。 如果我将 imageview 放在 collapsingToolbarLayout 之外但在 NestedScrollView 内，我无法更改 viewScrolling 的“速度”。 如果我将 imageview 放在 NestedScrollview 之外，即使工具栏被固定，它也会绘制在工具栏上。

在使用材料设计库之前，我使用了视图和对滚动视图的回调来上下移动它，但我想使用新库，因为它非常干净，删除了很多样板代码。

有什么想法吗？

Answer 1

事实上，用 AppBarLayout 覆盖滚动视图不需要任何这些：您可以使用 NestedScrollView 上的 app:behavior_overlayTop 属性来设置重叠量：

<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">

请注意，app:behavior_overlapTop 仅适用于具有 app:layout_behavior="@string/appbar_scrolling_view_behavior" 的视图，因为它是使用属性的行为（不是视图或父视图组，因为属性通常适用于），因此 behavior_ 前缀.

或者通过setOverlayTop()以编程方式设置：

NestedScrollView scrollView = ...
CoordinatorLayout.LayoutParams params = 
    (CoordinatorLayout.LayoutParams) scrollView.getLayoutParams();
AppBarLayout.ScrollingViewBehavior behavior =
    (AppBarLayout.ScrollingViewBehavior) params.getBehavior();
behavior.setOverlayTop(128); // Note: in pixels