前言
Material Design 是一种全新的设计语言，由谷歌推出，旨在在视觉和用户体验上提供一致性。它概括了各种应用程序的标准设计原则，包括色彩、排版和移动端应用程序界面设计。
在 Android 应用程序中，谷歌推出了 Material Design 风格的 UI 组件，其中包括 CoordinatorLayout 以及 Behavior。这些组件可以帮助我们简单而轻松地实现复杂的 UI 动画效果。本文将介绍如何使用 CoordinatorLayout 和 Behavior 实现这些动画效果。
CoordinatorLayout
CoordinatorLayout 是一个 FrameLayout 的子类，它是一个自定义的布局，最早出现在 Support Design 库中。它的主要作用是处理每个子视图之间的互动关系。
在布局中使用 CoordinatorLayout 后，我们可以通过 Behaviour 来规定每个子视图的布局方式和交互方式。例如，当我们向下滚动时，这些子视图可以在页面的不同位置上对齐、缩放或变形。
实际使用时，CoordinatorLayout 中每个子视图都关联了一个 Behavior，这个 Behavior 可以处理与其它视图的互动关系，在完成复杂视图布局时非常有用。
示例代码
------------------------------------------------
------------------------------------
-----------------------------------
-------------------------------------
---- --- - ---
---------
-----------------------
-----------------------------------
------------------------------------
---------------------- --
---- --- - ---
---------
-----------------------
-----------------------------------
------------------------------------
----------------------
---------------------------------------------- --
--------------------------------------------------在上述代码中，我们定义了两个 TextView，分别代表每个子视图。在第二个 TextView 中，我们通过 app:layout_behavior 属性来定义了一个 Behavior，这个 Behavior 的具体实现将在下一节中进行讨论。
Behavior
在 CoordinatorLayout 中，每个子视图都与 Behavior 相关联。通过 Behavior，我们可以控制子视图的布局和交互方式。目前，在 Android 应用程序中大量使用的 Behavior 包括 AppBarLayout.Behavior，Fab.Behavior等。
Behavior 的主要作用是为布局中的每个子视图提供交互行为。无论是缩放、移动还是颜色变化，都应该通过 Behavior 来控制实现。在实际应用中，Behavior 是非常重要的，我们可以通过自定义 Behavior，控制子视图之间的交互，实现非常漂亮的动画效果。
示例代码
------ ----- --------------- ------- -------------------------------- -
------ ----------------- -
-
-- - -------- --- --------------------------------
---------
------ ------- ---------------------------------------- ------- ---- ------ ---- ----------- -
-- ------ ---------- -----
------ -----
-
-在这个示例代码中，我们重写了 CoordinatorLayout.Behavior 的 onDependentViewChanged 方法，它将控制子视图与 dependency 之间的交互关系；具体实现将在子视图中定义。
使用步骤
1. 定义 CoordinatorLayout
我们需要在布局中定义一个 CoordinatorLayout，它是所有子视图的父容器。
------------------------------------------------
------------------------------------
-----------------------------------
-------------------------------------
----------
--------------------------------------------------2. 定义子视图
在 CoordinatorLayout 布局中定义各种子视图，在每个子视图中定义对应的 behavior。
---------
-----------------------
-----------------------------------
------------------------------------
---------------------- --
---------
-----------------------
-----------------------------------
------------------------------------
----------------------
---------------------------------------------- --3. 定义 Behavior
根据场景，我们需要定义我们自己的 Behavior，以便控制具体交互效果。
------ ----- --------------- ------- -------------------------------- -
------ ----------------- -
-
-- - -------- --- --------------------------------
---------
------ ------- ---------------------------------------- ------- ---- ------ ---- ----------- -
-- ------ ---------- -----
------ -----
-
-4. 注册 Behavior
在子视图中，我们需要将自定义的 behavior 注册上去，以便执行具体的交互效果。
---------
-----------------------
-----------------------------------
------------------------------------
----------------------
---------------------------------------------- --注意：这里 app:layout_behavior="@string/behavior_example" 中 "@string/behavior_example" 的值是我们自定义的 behavior 的名称。
总结
本文介绍了 Material Design 风格的 CoordinatorLayout 和 Behavior 的使用方法。我们可以通过定义一个 CoordinatorLayout 布局，然后在其中定义各种子视图，并为每个子视图定义相应的 Behavior，以实现各复杂动画效果。
在实际使用过程中，我们可以自定义 Behavior，以适应更多复杂的动画场景。此外，在开发过程中，需要充分理解 CoordinatorLayout 和 Behavior 的相关属性，了解它们的原理和使用方法，以便更好地应用它们在实际项目中。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/65b765d4add4f0e0ffff4e01