什么是 CoordinatorLayout？

Posted 2023-02-23

【中文标题】什么是 CoordinatorLayout？

【英文标题】：What is CoordinatorLayout?

【发布时间】：2015-08-12 17:50:28

【问题描述】：

刚刚查看了新的 android 支持设计库的演示应用程序。它由 Chris Banes 在github 上提供。通过应用程序，CoordinatorLayout 被大量使用。此外，许多支持设计库类，如FloatingActionButton、SnackBar、AppBarLayout 等在CoordinatorLayout 中使用时表现不同。

有人可以解释一下CoordinatorLayout 是什么以及它与android 中的其他ViewGroups 有何不同，或者至少提供学习CoordinatorLayout 的正确途径。

【问题讨论】：

android-developers.blogspot.com/2015/05/… 它在 JavaDocs 中也有广泛的描述，尽管令人困惑（目前不提供直接链接形式，但您可以从 developer.android.com/preview/download.html 下载 ZIP）。

使用CordinatorLayout 的实际优势是什么？它比其他人有什么优势？

【参考方案1】：

这就是你要找的。​​p>

来自文档

Design 库引入了 CoordinatorLayout，这是一种布局，可对子视图之间的触摸事件提供额外级别的控制，Design 库中的许多组件都利用了这一点。 p>

https://android-developers.googleblog.com/2015/05/android-design-support-library.html

在此链接中，您将看到上述所有视图的演示视频。

希望这会有所帮助:)

【讨论】：

链接已损坏。

【参考方案2】：

CoordinatorLayout 本质上是具有许多功能的框架布局，从名称中可以明显看出，它可以自动协调其子项之间的协调并帮助构建美丽的视图。它的实现可以在 Google Play Store App 中看到。工具栏是如何折叠和改变颜色的。

CoordinatorLayout 最棒的地方在于我们给予其直接或间接后代的行为。您一定已经在滚动时看到所有 UI 都开始运动了。这种行为很可能正在发挥它的魔力。

【参考方案3】：

还有一点需要注意。由于OP特别要求

此外，许多支持设计库类，如 FloatingActionButton、SnackBar、AppBarLayout 等行为不同 在 CoordinatorLayout 中使用时。

我猜是因为这个。

CoordinatorLayout 是一个超级强大的 FrameLayout。

FAB Button，SnackBar 工作在 FrameLayout 的概念上，由于 CoordinatorLayout 本身具有 FrameLayout 的功能，它可能会使其他视图表现不同！。

【参考方案4】：

快速了解Android Documentation 中有用的内容：

使用 CoordinatorLayout 来简单地控制视图的关系行为，

例如，如果您希望工具栏折叠或隐藏。 Google 通过引入 AppBarLayout 和 CollapsingToolbarLayout 让这一切变得非常简单，它们都在 CoordinatorLayout 下工作得最好。

另一种最常用的情况是，当您希望 FloatingActionButton 粘在 CollapsingToolbar 的底部并随其移动时，将它们放在 coordinatorLayout 下并使用 app:layout_anchor="@id/YourAppBarId" 作为胶水（！）和 app:layout_anchorGravity="bottom|end" 作为位置足以让你看到神奇的作品！

通过使用此布局作为上下文，子视图将有更好的协作并以智能的方式运行，因为它们将通过 CoordinatorLayout 上下文相互了解，这意味着您的 FloatingAction 按钮将不再被小吃条重叠等等

这些只是对最有用部分的快速总结，因此如果您想节省更多时间来为您的应用制作动画，那么对这个主题进行更深入的研究是值得的。

见Google Scrolling view activity template

【参考方案5】：

什么是 CoordinatorLayout？不要让花哨的名字欺骗了你，它只不过是类固醇上的 FrameLayout

为了更好地理解CoordinatorLayout 是/做什么，您必须首先理解/记住它对协调意味着什么。

如果你用谷歌搜索这个词

坐标

这就是你得到的：

我认为这些定义有助于描述 CoordinatorLayout 自身的作用以及其中的视图的行为方式。

一个 CoordinatorLayout（一个 ViewGroup）将一个 (̶a̶ ̶c̶o̶m̶p̶l̶e̶x̶ ̶a̶c̶t̶i̶v̶i̶t̶y̶ ̶o̶r̶ ̶a̶n̶ ̶o̶r̶g̶a̶n̶i̶z̶a̶t̶i̶o̶n̶)̶ 布局的不同元素（子视图）引入一种和谐或高效的关系：

在 CoordinatorLayout 的帮助下，子视图可以和谐地协同工作以实现令人敬畏的行为，例如

拖动、滑动、甩动或任何其他手势。

CoordinatorLayout 中的视图与其他视图协商，以便通过指定这些Behaviors 有效地协同工作

CoordinatorLayout 是 Material Design 的一项超酷功能，有助于创建有吸引力且协调的布局。

您所要做的就是将您的子视图包裹在 CoordinatorLayout 中。

<?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:layout_
 android:layout_
 android:fitsSystemWindows="true"
 tools:context="com.byte64.coordinatorlayoutexample.ScollingActivity">

 <android.support.design.widget.AppBarLayout
    android:id="@+id/app_bar"
    android:layout_
    android:layout_
    android:fitsSystemWindows="true"
    android:theme="@style/AppTheme.AppBarOverlay">

    <android.support.design.widget.CollapsingToolbarLayout
        android:id="@+id/toolbar_layout"
        android:layout_
        android:layout_
        android:fitsSystemWindows="true"
        app:contentScrim="?attr/colorPrimary"
        app:layout_scrollFlags="scroll|exitUntilCollapsed">



        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_
            android:layout_
            app:layout_collapseMode="pin"
            app:popupTheme="@style/AppTheme.PopupOverlay" />
        <TableLayout
            android:layout_
            android:layout_/>

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

<include layout="@layout/content_scolling" />

<android.support.design.widget.FloatingActionButton
    android:id="@+id/fab"
    android:layout_
    android:layout_
    android:layout_margin="@dimen/fab_margin"
    app:layout_anchor="@id/app_bar"
    app:layout_anchorGravity="bottom|end"
    app:srcCompat="@android:drawable/ic_dialog_email" />

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

和 content_scrolling：

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.NestedScrollView     
 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:layout_
 android:layout_
 app:layout_behavior="@string/appbar_scrolling_view_behavior"
 tools:context="com.byte64.coordinatorlayoutexample.ScollingActivity"
 tools:showIn="@layout/activity_scolling">

 <TextView
    android:layout_
    android:layout_
    android:layout_margin="@dimen/text_margin"
    android:text="@string/large_text" />

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

这给了我们一个布局，可以滚动折叠工具栏并隐藏 FloatingActionButton

打开：

关闭：

【讨论】：

相对或约束布局不会在视图之间也有关系吗？如果一个向上移动，则相关视图向上移动。为什么协调器更好？

@Snake 1. CoordinatorLayout 有助于将一个视图排列在另一个视图之上，这是 ConstraintLayout 或 RelativeLayout 都无法做到的。 2. 它还有助于动画视图的转换。一个很好的例子是 Whatsapp 应用程序中“查看联系人”活动/片段的转换。

类固醇上的 FrameLayout ?。喜欢它！

【参考方案6】：

需要注意的重要一点是，CoordinatorLayout 对 FloatingActionButton 或 AppBarLayout 的工作没有任何天生的理解——它只是以 Coordinator.Behavior 的形式提供了一个额外的 API，它允许子视图更好地控制触摸事件和手势以及声明彼此之间的依赖关系并通过 onDependentViewChanged() 接收回调。

视图可以通过使用 CoordinatorLayout.DefaultBehavior(YourView.Behavior.class) 注释来声明默认行为，或者通过 app:layout_behavior="com.example.app.YourView$Behavior" 属性在布局文件中设置它.该框架使任何视图都可以与 CoordinatorLayout 集成。

现已上市！ 设计库现已可用，因此请确保在 SDK 管理器中更新 Android 支持存储库。然后，您可以开始使用具有单个新依赖项的设计库：

编译'com.android.support:design:22.2.0' 请注意，由于设计库依赖于 Support v4 和 AppCompat 支持库，因此当您添加设计库依赖项时，它们将自动包含在内。我们还注意这些新小部件可在 Android Studio 布局编辑器的设计视图中使用（在 CustomView 下找到它们），让您可以更轻松地预览其中一些新组件。

设计库、AppCompat 和所有 Android 支持库都是重要的工具，它们提供了构建现代、美观的 Android 应用所需的构建块，而无需从头开始构建所有内容。

【参考方案7】：

CoordinatorLayout 是一个超级强大的FrameLayout。

默认情况下，如果您将多个子代添加到 FrameLayout，它们会相互重叠。 FrameLayout 应该最常用于保存单个子视图。 CoordinatorLayout 的主要吸引力在于它能够协调其中视图的动画和过渡。仅使用 XML，您可以描述一个布局，其中一个 FAB 移出传入的 Snackbar，例如，或者有一个显然附加到另一个小部件并在屏幕上移动的 FAB（或任何其他视图）小部件。

这里是主要来源tutorial。