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

问题描述：

我有以下布局:

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

我将 Fragment 添加到 FrameLayout 中，替换它们.我的 Fragment 之一是一个列表，它具有以下布局:

I add Fragments into the FrameLayout, replacing them. One of my Fragments is a list, which has the following layout:

<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 中来解决这个问题，这解决了过度绘制，但这样 appbar 滚动行为不再起作用.

My problem here that the toolbar is drawn over the list. I tried to solve that by wrapping the content of the CoordinatorLayout into a LinearLayout, that solved the overdraw, but that way the appbar scrolling behavior no longer work.

非常感谢任何帮助！

答

取属性

app:layout_behavior="@string/appbar_scrolling_view_behavior"

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

off the RecyclerView and put it on the FrameLayout that you are trying to show under the Toolbar.

我发现滚动视图行为所做的一件重要事情是将组件布局在工具栏下方.因为 FrameLayout 有一个将滚动的后代 (RecyclerView)，CoordinatorLayout 将获得那些滚动事件以移动 Toolbar代码>.

I've found that one important thing the scrolling view behavior does is to layout the component below the toolbar. Because the FrameLayout has a descendant that will scroll (RecyclerView), the CoordinatorLayout will get those scrolling events for moving the Toolbar.

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

One other thing to be aware of: That layout behavior will cause the FrameLayout height to be sized as if the Toolbar is already scrolled, and with the Toolbar fully displayed the entire view is simply pushed down so that the bottom of the view is below the bottom of the CoordinatorLayout.

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

This was a surprise to me. I was expecting the view to be dynamically resized as the toolbar is scrolled up and down. So if you have a scrolling component with a fixed component at the bottom of your view, you won't see that bottom component until you have fully scrolled the Toolbar.

因此，当我想在 UI 底部锚定按钮时，我通过将按钮置于 CoordinatorLayout (android:layout_gravity="bottom") 并向工具栏下方的视图添加等于按钮高度的底部边距.

So when I wanted to anchor a button at the bottom of the UI, I worked around this by putting the button at the bottom of the CoordinatorLayout (android:layout_gravity="bottom") and adding a bottom margin equal to the button's height to the view beneath the toolbar.

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

相关推荐