Listeners
sidebar_position: 5
监听器(Listeners)
监听器让设计师直接在 Rive 中创建交互行为——例如点击、悬停和拖拽——无需编写代码。例如,你可以为按钮附加"指针进入"、"指针退出"和"点击"监听器。当被触发时,这些监听器可以更新数据绑定、设置输入、触发事件等——从而在运行时实现动态的交互体验。
创建新监听器
- 在"动画"选项卡中,选择你的状态机。
- 在"监听器"选项卡中,点击加号图标。
如果在创建监听器时已选中某个对象,则该对象会自动被指定为目标。

选中新监听器后,你会在状态机图底部以及图右侧的新面板中看到其选项。
监听器的组成
监听器由三部分组成:目标、监听器条件和监听器动作。
目标(Target)
目标决定了在哪里监听监听器条件。
点击区域(Hit Areas)
在大多数情况下,目标定义了响应用户交互的交互区域——类似于游戏开发中的碰撞盒。当用户与该区域交互(例如点击或悬停)时,关联的监听器被触发。
通常最好使用形状作为目标——例如透明度为 0% 的椭圆或矩形。如果你使用组作为目标,组内的形状将作为交互区域。
要选择目标,请点击目标图标,然后从画板或层级面板中选择一个对象。

注意,如果在创建监听器时已选中对象,该对象会自动被分配为监听器的目标。
监听组件上的事件
我们强烈建议使用数据绑定在画板之间通信,而不是依赖嵌套事件。
将画板或组件设置为目标,可以让你监听从该画板触发的事件。
不透明目标(Opaque Target)
不透明目标选项决定指针事件是否穿透点击区域,可能同时触发多个监听器。

监听器条件(Listener Condition)
监听器条件定义了监听器在监听什么。这包括基于指针的交互以及数据驱动的触发器,例如视图模型属性的变化。目标按钮下方的下拉菜单允许你更改监听器检查的条件。

可用的条件包括:
指针按下(Pointer Down) – 鼠标按下或手指按压。
指针抬起(Pointer Up) – 释放鼠标点击或手指按压。
指针进入(Pointer Enter) – 鼠标或手指进入目标区域。
指针退出(Pointer Exit) – 鼠标或手指退出目标区域。
指针移动(Pointer Move) – 鼠标或手指在目标区域内的任何移动。
点击(Click) – 在同一目标区域内先指针按下 再指针抬起。
监听事件(Listen for Event) – 仅当目标为画板或组件时显示。如果存在多个事件,请使用下拉菜单选择具体事件。
视图模型属性变化(View Model Property Change) – 当选定的视图模型属性发生变化时触发。仅当画板被设置为目标时可用。使用下拉菜单选择要监听的特定属性。
注意,无法指定期望值——监听器会在属性发生变化时触发,无论变化方向如何。例如,布尔类型监听器会在值从 true 变为 false 或从 false 变为 true 时触发。

由于通用事件已被弃用,视图模型属性变化是响应状态机内部变化的推荐方式。特别是,触发器可以直接替代事件:可以在状态机内部触发触发器(例如在状态转换时),而设置为该触发器属性的视图模型属性变化监听器将响应触发——无需依赖事件即可实现相同的通知模式。
监听器动作(Listener Action)
监听器动作定义了用户交互发生时执行的操作。
要添加监听器动作,请点击状态机图下方面板中的加号图标。你可以为单个监听器添加多个动作。

视图模型更改(View Model Change)
更新视图模型实例中的值。这是从 Rive 文件与运行时代码通信的首选方式。默认情况下,监听器设置为视图模型更改,除非监听器的目标是画板或组件实例。
视图模型下拉菜单
视图模型下拉菜单让你选择监听器要更改的视图模型属性。

注意,监听器可以更改文件中任何视图模型的属性,即使它未分配给画板。
值 vs 属性
选择监听器要修改的属性后,你可以将其设置为特定值,或等于另一个视图模型属性。
值(Value)
如果选择值,你可以使用输入字段将属性设置为所需的具体值。值类型因属性而异。

视图模型属性(View Model Property)
选择属性会将监听器中的视图模型属性设 置为等于另一个属性。

注意,我们可以将视图模型属性设置为等于自身。
添加转换器(Adding a Converter)
如果我们选择将一个视图模型属性设置为等于另一个视图模型属性,则转换器图标会出现在视图模型属性的右侧。这允许我们为属性应用转换器。

例如,我们可以将数字属性设置为数字属性,但附加一个加一转换器。每次此监听器触发时,我们可以将数字属性增加一。
报告事件(Report Event)
每次监听器条件满足时触发一个事件。当监听器的目标是画板或组件实例时,这是默认选项。
对齐目标(Align Target)
对齐目标动作会将目标对象定位到跟随指针,当监听器条件在监听区域内满足时。
使用目标选择器选择要对齐的对象。
启用保留偏移以保持动作触发时对象与指针之间的原始距离。未选中时,对象将直接对齐到指针中心。
输入更改(Input Change)
允许监听器更改定义的输入——例如切换布尔值、触发触发器或将数字输入设置为特定值。
这对于直接在画板上创建交互行为(如悬停状态或点击效果)非常有用。