在 CoordinatorLayout 的工具栏下方添加视图答案

【问题标题】：Add views below toolbar in CoordinatorLayout在 CoordinatorLayout 的工具栏下方添加视图
【发布时间】：2016-01-02 13:12:50
【问题描述】：

我有以下布局：

<android.support.design.widget.CoordinatorLayout
    android:id="@+id/main_content"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/appBar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/ThemeOverlay.AppCompat.ActionBar">

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

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

    <FrameLayout
        android:id="@+id/content"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        />
</android.support.design.widget.CoordinatorLayout>

我将Fragments 添加到FrameLayout 中，替换它们。我的Fragments 之一是一个列表，其布局如下：

<android.support.v7.widget.RecyclerView
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/recyclerView"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"/>

我的问题是 工具栏被绘制在列表上。我试图通过将CoordinatorLayout 的内容包装到LinearLayout 中来解决这个问题，这解决了过度绘制问题，但这样应用栏滚动行为不再起作用。

非常感谢任何帮助！

【问题讨论】：

标签： android android-toolbar android-coordinatorlayout androiddesignsupport

【解决方案1】：

取属性

app:layout_behavior="@string/appbar_scrolling_view_behavior"

关闭RecyclerView 并将其放在您尝试在Toolbar 下显示的FrameLayout 上。

我发现滚动视图行为所做的一件重要事情是将组件布置在工具栏下方。因为FrameLayout 有一个会滚动的后代（RecyclerView），所以CoordinatorLayout 将获得那些用于移动Toolbar 的滚动事件。

需要注意的另一件事：该布局行为将导致 FrameLayout 的高度被调整就好像 Toolbar 已经滚动，并且 Toolbar 完全显示整个视图被简单地向下推，使视图的底部低于CoordinatorLayout 的底部。

这对我来说是一个惊喜。我期待视图在工具栏上下滚动时动态调整大小。因此，如果您的视图底部有一个带有固定组件的滚动组件，则在完全滚动 Toolbar 之前，您不会看到该底部组件。

所以当我想在 UI 底部锚定一个按钮时，我通过将按钮放在 CoordinatorLayout (android:layout_gravity="bottom") 的底部并添加一个等于按钮高度的底部边距来解决这个问题工具栏下方的视图。

【讨论】：

非常感谢，这真的有效！之后我唯一的问题是，如果工具栏被移出，在将Fragment 包含替换为另一个Fragment 的列表后，它没有返回。我设法手动显示工具栏this 方式。
哇。我一直认为 Fragment 自己的布局完全取代了 FrameLayout “占位符”，但我发现情况并非如此。感谢您的回答！这对我帮助很大。
@Surendar D 如果可以的话请检查一下stackoverflow.com/questions/42968587/…
不错。谢谢！
如果您想在没有任何滚动事件的情况下以编程方式展开/折叠应用栏，那么将视图布局与滚动行为相结合是一个问题。

【解决方案2】：

我设法通过添加以下内容来解决此问题：

android:layout_marginTop="?android:attr/actionBarSize"

到 FrameLayout 像这样：

 <FrameLayout
        android:id="@+id/content"
        android:layout_marginTop="?android:attr/actionBarSize"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
       />

【讨论】：

不添加 marginTop 添加 app:layout_behavior="@string/appbar_scrolling_view_behavior"
@string/appbar_scrolling_view_behavior 不可用时的完美解决方案
请使用android:layout_marginTop="?android:attr/actionBarSize"
这有点奇怪，添加一个可能大小的边距（假设你总是有一个这样大小的工具栏）会在某个时候中断
如果你使用CollapsingToolbarLayout肯定会坏掉，这种情况下高度不会恒定

【解决方案3】：

从 Android Studio 3.4 开始，您需要将此行放在包含 RecyclerView 的布局中。

app:layout_behavior="android.support.design.widget.AppBarLayout$ScrollingViewBehavior"

【讨论】：

【解决方案4】：

使用折叠顶部工具栏或使用您自己选择的 ScrollFlags 我们可以这样：From Material Design摆脱FrameLayout

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">

<androidx.coordinatorlayout.widget.CoordinatorLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <com.google.android.material.appbar.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <com.google.android.material.appbar.CollapsingToolbarLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:contentScrim="?attr/colorPrimary"
            app:expandedTitleGravity="top"
            app:layout_scrollFlags="scroll|enterAlways">


        <androidx.appcompat.widget.Toolbar
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:layout_collapseMode="pin">

            <ImageView
                android:id="@+id/ic_back"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/ic_arrow_back" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="back"
                android:textSize="16sp"
                android:textStyle="bold" />

        </androidx.appcompat.widget.Toolbar>


        </com.google.android.material.appbar.CollapsingToolbarLayout>
    </com.google.android.material.appbar.AppBarLayout>

        <androidx.recyclerview.widget.RecyclerView
            android:id="@+id/post_details_recycler"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical"
            android:padding="5dp"
            app:layout_behavior="@string/appbar_scrolling_view_behavior"
            />

</androidx.coordinatorlayout.widget.CoordinatorLayout>

【讨论】：