CollapsingToolbarLayout 设计失败答案

【问题标题】：CollapsingToolbarLayout design failureCollapsingToolbarLayout 设计失败
【发布时间】：2016-08-27 22:12:33
【问题描述】：

我正在创建一个 CollapsingToolbarLayout，它应该如下所示：

但它下面有一个丑陋的蓝色“东西”：

这里是 XML（它在一个 coordinatorlayout 中，但它被剪掉了。）：

<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|exitUntilCollapsed"
        android:fitsSystemWindows="false"
        app:contentScrim="?attr/colorPrimary"
        app:expandedTitleMarginStart="48dp"
        app:expandedTitleMarginEnd="64dp">

        <ImageView
            android:id="@+id/post_view_photo"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:scaleType="centerCrop"
            android:fitsSystemWindows="true"
            android:transitionName="@string/transition_image"
            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">

        <android.support.v7.widget.CardView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_margin="@dimen/card_margin">

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

                <TextView
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:text="Info"
                    android:textAppearance="@style/TextAppearance.AppCompat.Title" />

                <TextView
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:text="test" />

            </LinearLayout>

        </android.support.v7.widget.CardView>





    </LinearLayout>

</android.support.v4.widget.NestedScrollView>

<android.support.design.widget.FloatingActionButton
    android:layout_height="wrap_content"
    android:layout_width="wrap_content"
    android:src="@android:drawable/stat_notify_chat"
    app:layout_anchor="@id/appbar"
    app:layout_anchorGravity="bottom|right|end"
    android:layout_margin="@dimen/fab_margin"
    android:clickable="true"/>

可能是什么错误？我还尝试了垂直图像。谢谢！

【问题讨论】：

您是否尝试从您的CollapsingToolbarLayout 中删除android:fitsSystemWindows="true" 属性？
您是否将 CollapsingToolbarLayout 放置在 AppBarLayout 中？
@Yasin Kaçmaz 是的，我试过了。
@Robbe 是的，我有。
@user6586661 我在您的图片中遇到了问题。您也可以发布您的 RecyclerView xml 代码吗？

标签： android xml android-activity toolbar

【解决方案1】：

我有一个像你这样的布局，你可以试试这个布局结构吗，我认为添加android:layout_below="@+id/profileactivity_appbar" 解决了我的问题

您的Toolbar 中也没有滚动标志

我看到的另一件事；确保您的过渡正确地转换图像：

<?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/apk/res-auto"
    android:id="@+id/profileCoordinatorLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

<android.support.design.widget.AppBarLayout
    android:id="@+id/profileactivity_appbar"
    android:layout_width="match_parent"
    android:layout_height="360dp"
    android:theme="@style/AppTheme3.AppBarOverlay">

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

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

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:layout_scrollFlags="scroll|enterAlways|snap|enterAlwaysCollapsed"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
            app:layout_collapseMode="pin" />

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

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

<android.support.v7.widget.RecyclerView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/profile_recyclerview"
    android:layout_below="@+id/profileactivity_appbar"
    app:layout_behavior="@string/appbar_scrolling_view_behavior" />


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

【讨论】：