快速滚动时图层重新排序

Question

我有一个使用协调器布局和视差滚动图像的布局。当我滚动得相当慢时，一切都按照我想要的方式工作，但是如果我快速滚动或轻拂屏幕滚动，那么图像就会出现在标题栏的顶部。然后我可以向上滚动，它将从图像下方出现并再次回到顶部。

我已经制作了我的意思的屏幕录像，您应该能够在此处查看：链接

下面是布局的 xml：

<?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/detail_coordinator_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:context="app.com.example.android.bulletpoints.ui.DetailActivityFragment">
    <android.support.design.widget.AppBarLayout
        android:id="@+id/app_bar_layout"
        android:layout_width="match_parent"
        android:background="@color/white"
        android:layout_height="@dimen/detail_photo_height">
        <android.support.design.widget.CollapsingToolbarLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_scrollFlags="scroll|enterAlways">
            <ImageView
                android:id="@+id/article_photo"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="?actionBarSize"
                android:scaleType="centerCrop"
                app:layout_collapseMode="parallax" />
        </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:id="@+id/title_bar"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="@color/colorPrimary"
                android:elevation="@dimen/bulletpoint_elevation"
                android:orientation="vertical">
                <TextView
                    android:id="@+id/detail_title"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:paddingEnd="@dimen/detail_bar_text_margin"
                    android:paddingLeft="@dimen/detail_bar_text_margin"
                    android:paddingRight="@dimen/detail_bar_text_margin"
                    android:paddingStart="@dimen/detail_bar_text_margin"
                    android:paddingTop="@dimen/detail_bar_title_top"
                    android:textColor="@color/white"
                    android:textSize="@dimen/detail_title_text_size" />
                <TextView
                    android:id="@+id/detail_subtitle"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:paddingBottom="@dimen/detail_bar_subtitle_bottom"
                    android:paddingEnd="@dimen/detail_bar_text_margin"
                    android:paddingLeft="@dimen/detail_bar_text_margin"
                    android:paddingRight="@dimen/detail_bar_text_margin"
                    android:paddingStart="@dimen/detail_bar_text_margin"
                    android:textColor="@color/white"
                    android:textSize="@dimen/detail_subtitle_text_size" />
            </LinearLayout>
            <FrameLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="@color/white">
                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginBottom="@dimen/bulletpoint_block_bottom"
                    android:layout_marginEnd="@dimen/bulletpoint_margin"
                    android:layout_marginLeft="@dimen/bulletpoint_margin"
                    android:layout_marginRight="@dimen/bulletpoint_margin"
                    android:layout_marginStart="@dimen/bulletpoint_margin"
                    android:background="@color/white"
                    android:elevation="@dimen/bulletpoint_elevation"
                    android:orientation="vertical">
                    <include
                        android:id="@+id/bulletpoint_1"
                        layout="@layout/bulletpoint_item" />
                    <include layout="@layout/divider" />
                    <include
                        android:id="@+id/bulletpoint_2"
                        layout="@layout/bulletpoint_item" />
                    <include layout="@layout/divider" />
                    <include
                        android:id="@+id/bulletpoint_3"
                        layout="@layout/bulletpoint_item" />
                    <include layout="@layout/divider" />
                    <include
                        android:id="@+id/bulletpoint_4"
                        layout="@layout/bulletpoint_item" />
                    <include layout="@layout/divider" />
                    <include
                        android:id="@+id/bulletpoint_5"
                        layout="@layout/bulletpoint_item" />
                </LinearLayout>
            </FrameLayout>
        </LinearLayout>
    </android.support.v4.widget.NestedScrollView>
    <include layout="@layout/ad_fab" />
</android.support.design.widget.CoordinatorLayout>

有人能够看到我在布局中出错的地方吗？任何帮助将不胜感激。

编辑：我错过了xml文件的顶层，所以我已经重新添加了它。

Answer 1

这需要很多移动的东西，但我已经解决了它，所以我想我会发布解决方案，以防其他人遇到类似的问题。

归根结底是我错误地考虑了分组。我不确定为什么它会滚动图像下方的栏，但我认为它与 NestedScrollView 有关（如果有人对为什么会这样有见解，请发表评论）。

为了解决这个问题，我将栏调到CollapsingToolbarLayout中，并将其放在Imageview下方的FrameLayout中。

<?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/detail_coordinator_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:context="app.com.example.android.bulletpoints.ui.DetailActivityFragment">
    <android.support.design.widget.AppBarLayout
        android:id="@+id/app_bar_layout"
        android:layout_width="match_parent"
        android:layout_height="@dimen/detail_photo_height">
        <android.support.design.widget.CollapsingToolbarLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_scrollFlags="scroll|enterAlways">
            <ImageView
                android:id="@+id/article_photo"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_marginTop="?actionBarSize"
                android:scaleType="centerCrop"
                app:layout_collapseMode="parallax"/>
            <FrameLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:orientation="vertical" >
                <LinearLayout
                    android:id="@+id/title_bar"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:background="@color/colorPrimary"
                    android:elevation="@dimen/bulletpoint_elevation"
                    android:layout_gravity="bottom"
                    android:orientation="vertical">
                    <TextView
                        android:id="@+id/detail_title"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:paddingEnd="@dimen/detail_bar_text_margin"
                        android:paddingLeft="@dimen/detail_bar_text_margin"
                        android:paddingRight="@dimen/detail_bar_text_margin"
                        android:paddingStart="@dimen/detail_bar_text_margin"
                        android:paddingTop="@dimen/detail_bar_title_top"
                        android:textColor="@color/white"
                        android:textSize="@dimen/detail_title_text_size" />
                    <TextView
                        android:id="@+id/detail_subtitle"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:paddingBottom="@dimen/detail_bar_subtitle_bottom"
                        android:paddingEnd="@dimen/detail_bar_text_margin"
                        android:paddingLeft="@dimen/detail_bar_text_margin"
                        android:paddingRight="@dimen/detail_bar_text_margin"
                        android:paddingStart="@dimen/detail_bar_text_margin"
                        android:textColor="@color/white"
                        android:textSize="@dimen/detail_subtitle_text_size" />
                </LinearLayout>
            </FrameLayout>
        </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">
        <FrameLayout
            android:id="@+id/bulletpoint_block"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/white">
            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginBottom="@dimen/bulletpoint_block_bottom"
                android:layout_marginEnd="@dimen/bulletpoint_margin"
                android:layout_marginLeft="@dimen/bulletpoint_margin"
                android:layout_marginRight="@dimen/bulletpoint_margin"
                android:layout_marginStart="@dimen/bulletpoint_margin"
                android:background="@color/white"
                android:elevation="@dimen/bulletpoint_elevation"
                android:orientation="vertical">
                <include
                    android:id="@+id/bulletpoint_1"
                    layout="@layout/bulletpoint_item" />
                <include layout="@layout/divider" />
                <include
                    android:id="@+id/bulletpoint_2"
                    layout="@layout/bulletpoint_item" />
                <include layout="@layout/divider" />
                <include
                    android:id="@+id/bulletpoint_3"
                    layout="@layout/bulletpoint_item" />
                <include layout="@layout/divider" />
                <include
                    android:id="@+id/bulletpoint_4"
                    layout="@layout/bulletpoint_item" />
                <include layout="@layout/divider" />
                <include
                    android:id="@+id/bulletpoint_5"
                    layout="@layout/bulletpoint_item" />
            </LinearLayout>
        </FrameLayout>
    </android.support.v4.widget.NestedScrollView>
    <include layout="@layout/ad_fab" />
</android.support.design.widget.CoordinatorLayout>