事件、案例和动作 #

交互决定了元件和页面的动态行为。点击一个按钮以导航到原型中的另一个页面是一种交互,就像用鼠标在一个元件上移动以显示页面上的另一个元件一样。

你将在 Interactions 面板中创建和管理你的原型的交互。你可以从面板底部选定的元件的最常见的交互中选择,或者你可以点击 New Interaction ,建立你自己的交互。

提示

如果你需要更多的空间来处理你的交互,点击 Interactions 面板右下角的窗口图标,或者双击任何事件或元件的名称,打开 Interaction Editor 对话框。

交互的结构 #

交互由三个部分组成:

  • 元件和页面事件
  • 被添加到事件中的案例
  • 添加到案例中的动作

活动 #

事件是对应于特定页面和元件行为的触发器。当触发行为在浏览器中发生时,事件被 “触发”,任何与之相连的情况都被响应地执行。例如,如果你点击一个按钮以导航到原型中的不同页面,你就触发了它的 Click or Tap 事件。

要查看一个页面或元件的可用事件,选择它并在 Interactions 面板中点击 New Interaction 。然后在列表中选择一个事件,在它下面设置一个交互。

要删除一个事件及其所有的案例和动作,在 Interactions 面板中选择它,然后按 DELETE。

案例 #

案例是网页浏览器中为响应页面或元件事件而发生的动作的有序列表。当你为一个事件指定一个或多个动作时,一个案例会自动添加到该事件中,尽管第一个案例的名字默认是隐藏的。将光标悬停在事件的名称上,点击右边的 Enable Cases ,就可以看到第一个案例的名称。

如果需要,你可以通过点击事件名称右边的 Add Case 图标来为事件添加额外的案例。当事件在浏览器中启动时,你可以在出现的菜单中选择执行哪些案例。

要从一个事件中删除一个案例,在 Interactions 面板中选择它并按 DELETE。

你可以通过向上和向下拖动事件下的案例来重新排序。

动作 #

动作是响应页面或元件事件的发生而在浏览器中发生的变化。例如,如果你点击一个按钮以导航到原型中的不同页面,那么响应按钮的 Click or Tap 事件,就发生了一个 Open Link 动作。

当你在 New Interaction 菜单中选择一个事件时,你会看到 活跃的动作列表 (opens new window) 。选择一个动作后,你会被提示配置它。然后,你可以将光标悬停在动作的名称上,点击右边的 Add Target ,为动作添加额外的目标(对于采取目标的动作)。

要在一个案例中增加更多的动作,请点击案例底部的 Insert Action 图标。要从一个案例中删除一个动作,在 Interactions 面板中选择它,然后按 DELETE。

你可以通过上下拖动案例中的动作来重新排序。动作是按从上到下的顺序进行的,所以必须按照你希望它们在浏览器中发生的确切顺序来安排它们。