Android–设计库视差标题

我无法想出一个XML布局来达到预期的效果.

>工具栏应始终保持固定在顶部. (绿色矩形)
>当回滚视图滚动时,视差区域(红色矩形)应具有视差滚动效果(由向上/向下箭头指示为红色).

这就是我当前的XML布局


android:id="@+id/appbar"
android:layout_
android:layout_
android:fitsSystemWindows="true"
android:orientation="vertical"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
android:id="@+id/toolbar"
android:layout_
android:layout_
android:background="?attr/colorPrimary"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
android:layout_
android:layout_
android:orientation="vertical"
app:layout_scrollFlags="scroll"
app:layout_collapseMode="parallax">
android:layout_
android:layout_
android:padding="8dp"
android:text="This is a test widget" />
android:layout_
android:layout_
android:padding="8dp"
android:text="This is a test widget" />
android:layout_
android:layout_
android:padding="8dp"
android:text="This is a test widget" />
android:layout_
android:layout_
android:padding="8dp"
android:text="This is a test widget" />
android:layout_
android:layout_
android:padding="8dp"
android:text="This is a test widget" />


android:id="@+id/recyclerView"
android:layout_
android:layout_
app:layout_behavior="@string/appbar_scrolling_view_behavior" />



我的XML布局完全将内容向上滚动并滚出窗口&返回时(向下滚动)它会下拉大约56dp的appbarlayout(我的工具栏的大小),然后经过一些更多的滚动,剩下的就下来了.

如何实现1& 2？

—–编辑：我将我的XML布局修改为以下内容. —–


xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_
android:layout_>
android:id="@+id/appbar"
android:layout_
android:layout_
android:fitsSystemWindows="true"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
android:id="@+id/collapsing_toolbar"
android:layout_
android:layout_
android:fitsSystemWindows="true"
app:cOntentScrim="?attr/colorPrimary"
app:expandedTitleTextAppearance="@style/ExpandedAppBar"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:titleEnabled="false">
android:id="@+id/toolbar"
android:layout_
android:layout_
android:background="?attr/colorPrimary"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:layout_collapseMode="pin"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
android:layout_
android:layout_
android:layout_marginTop="?attr/actionBarSize"
android:orientation="vertical"
app:layout_collapseMode="parallax">
android:layout_
android:layout_
android:padding="8dp"
android:text="This is a test widget" />
android:layout_
android:layout_
android:padding="8dp"
android:text="This is a test widget" />
android:layout_
android:layout_
android:padding="8dp"
android:text="This is a test widget" />
android:layout_
android:layout_
android:padding="8dp"
android:text="This is a test widget" />
android:layout_
android:layout_
android:padding="8dp"
android:text="This is a test widget" />



android:id="@+id/recyclerView"
android:layout_
android:layout_
app:layout_behavior="@string/appbar_scrolling_view_behavior" />



它大部分都有效,但视差部分内的视图覆盖了工具栏.

—– EDIT2：这个XML布局有效！确保您的工具栏位于CollapsingToolbarLayout的底部,以便在其他视图之上绘制！


xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_
android:layout_>
android:id="@+id/appbar"
android:layout_
android:layout_
android:fitsSystemWindows="true"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
android:id="@+id/collapsing_toolbar"
android:layout_
android:layout_
android:fitsSystemWindows="true"
android:background="@color/primary"
app:expandedTitleTextAppearance="@style/ExpandedAppBar"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:titleEnabled="false">
android:layout_
android:layout_
android:orientation="vertical"
android:layout_marginTop="?attr/actionBarSize"
app:layout_collapseMode="parallax">
android:layout_
android:layout_
android:padding="8dp"
android:text="This is a test widget" />
android:layout_
android:layout_
android:padding="8dp"
android:text="This is a test widget" />
android:layout_
android:layout_
android:padding="8dp"
android:text="This is a test widget" />
android:layout_
android:layout_
android:padding="8dp"
android:text="This is a test widget" />
android:layout_
android:layout_
android:padding="8dp"
android:text="This is a test widget" />

android:id="@+id/toolbar"
android:layout_
android:layout_
android:background="@color/primary"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:layout_collapseMode="pin"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />


android:id="@+id/recyclerView"
android:layout_
android:layout_
app:layout_behavior="@string/appbar_scrolling_view_behavior" />



解决方法:

这就是我设法让它发挥作用的方式.

android:id="@+id/appbar"
android:layout_
android:layout_
android:fitsSystemWindows="true"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
android:id="@+id/collapsing_toolbar"
android:layout_
android:layout_
android:fitsSystemWindows="true"
android:background="@color/primary"
app:expandedTitleTextAppearance="@style/ExpandedAppBar"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:titleEnabled="false">
android:layout_
android:layout_
android:orientation="vertical"
android:layout_marginTop="?attr/actionBarSize"
app:layout_collapseMode="parallax">
android:layout_
android:layout_
android:padding="8dp"
android:text="This is a test widget" />
android:layout_
android:layout_
android:padding="8dp"
android:text="This is a test widget" />
android:layout_
android:layout_
android:padding="8dp"
android:text="This is a test widget" />
android:layout_
android:layout_
android:padding="8dp"
android:text="This is a test widget" />
android:layout_
android:layout_
android:padding="8dp"
android:text="This is a test widget" />

android:id="@+id/toolbar"
android:layout_
android:layout_
android:background="@color/primary"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:layout_collapseMode="pin"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />


android:id="@+id/recyclerView"
android:layout_
android:layout_
app:layout_behavior="@string/appbar_scrolling_view_behavior" />


确保您的工具栏位于CollapsingToolbarLayout的底部,以便在其他视图之上绘制！