数据绑定是一种强大的方式，可在编辑器元素、数据和代码之间创建响应式连接。例如，你可以：

• 将图标的颜色绑定到一个颜色数据属性，该属性可由开发人员在运行时调整
• 绑定动画对象的 X 位置，以便另一个对象可以跟随偏移量
• 监听两个按钮上的点击事件来递增和递减计数器

为什么使用数据绑定？

数据绑定通过引入双方都可以绑定的中间数据，将设计与代码解耦。这构成了设计师和开发人员之间的"契约"。一旦契约确定，双方可以独立迭代，从而加快交付新功能和实验可能性的速度。

在编辑器内，数据绑定允许设计中拥有更高的响应性。你可以在对象之间建立关系，并确保某些不变性始终成立，无论画板状态如何。数据绑定系统将确保这些关系在动画和来自代码的调用改变值时始终保持最新。

它还为将更多逻辑转移到 Rive 文件中并减少代码中的逻辑提供了机会。你需要根据具体用例决定逻辑是存在于代码中还是数据绑定中，但一个考虑因素是：任何数据绑定逻辑在所有运行时中都是通用的，而无需单独重新实现。

词汇表

数据绑定引入了许多你需要熟悉的概念。这些概念的名称大致源自软件开发中的模型-视图-视图模型（MVVM）模式。

编辑器元素

就数据绑定而言，"编辑器元素"仅指编辑器中可编辑的 UI 元素，其值可以附加绑定。

视图模型

视图模型是数据集合的蓝图。开发人员可能会将其视为面向对象编程中的类。视图模型通常描述与给定用例相关的所有数据——通常每个画板一个。视图模型本身没有具体值。为此，你需要一个实例。

视图模型属性

视图模型属性是视图模型中的一条数据。开发人员可能会将其视为面向对象编程中的字段。属性具有在创建时选择的数据类型，以及一个可在代码中引用的名称。每个属性可以绑定到相同类型的不同编辑器元素。

添加视图模型属性

在数据面板中，点击视图模型名称旁边的 添加视图模型属性 按钮，然后选择你的属性类型。

视图模型实例

视图模型实例是带有实际值的视图模型的活版本。开发人员可能会将其视为面向对象编程中的类实例。实例具有与其派生的视图模型相同的属性，但现在每个属性都有一个可以随时间变化的活值。

你可以从一个给定的视图模型创建任意数量的实例。每个实例可以有一个唯一的名称，与这些值所代表的内容相关联。每个实例可以有不同的属性初始值，代表一种设计时配置。例如，如果你有一个菜单，包含三个带图标的按钮：🏠 首页、👤 个人资料和 ❓ 关于，你可能有一个表示菜单项的画板，但有三个视图模型实例，每个实例包含菜单项的标签和相关图标，可以应用于该画板来配置按钮。

画板被分配一个实例来填充数据绑定。更改应用的实例将更改属性的初始状态以及所有相关的绑定元素。

为了使实例对开发人员可见，它必须标记为已导出。否则，它被视为文件内部。可能希望将其保持内部的一个原因是，你仅使用该实例来测试在给定值集（包括边界情况）下的设计。

这些导出的实例随后可以在运行时由开发人员分配给画板。或者，开发人员可以创建具有默认值（例如数字为 0，字符串为空字符串）的空实例。分配实例后，其值将根据绑定开始更新。

绑定

绑定是视图模型属性与编辑器元素之间的关联。例如，你可能有一个名为"name"的字符串属性绑定到文本运行。绑定后，文本运行将从视图模型属性获取值。有关其他选项，请参阅绑定方向。

绝对绑定与相对绑定

默认情况下，新的数据绑定连接创建为绝对绑定。

• 绝对绑定：将值指向视图模型树中特定的属性位置。例如，"第一个视图模型的第二个属性"。
• 相对绑定：根据属性名称查找值，无论它在视图模型树中的位置如何。例如，对"myNumber"的相对绑定将在可用的视图模型中查找该名称的属性。

绑定方向

绑定可以是源到目标、目标到源或双向的。这里，"源"指属性，"目标"指编辑器元素。

默认绑定是源到目标。这意味着对属性的更改会更新元素的值。例如，XPos 属性更新对象的 X 位置。

目标到源意味着对元素值的更改会更新属性。例如，对象的 X 位置更新 XPos 属性。

双向意味着更改在两个方向上都应用，即元素或属性都可以更新另一方。

此外，绑定可以标记为"一次性绑定"。这意味着初始值将被应用，之后绑定将不再应用任何更新。

视图模型嵌套

视图模型可以将另一个视图模型作为其属性之一。这称为"嵌套"。当父实例想要与特定子实例关联时，这很有用，类似于组件。

运行时 API

要继续阅读如何在代码中与数据绑定交互，请参阅运行时概述页面。

数据绑定运行时概述

深入了解如何在运行时使用数据绑定。