母板的触发事件
时长:
指导老师:Axure官网
困难程度:容易
主要内容
本课程学习学习使用母板的自定义事件,在不同的母板个例中添加自定义交互事件。
触发事件是在每个母板实例中添加不同交互事件的自定义事件,如果需要母板内的部件能够操作母板外页面上的部件时,也可以使用触发事件。母板内的部件交互引起触发事件的发生。
例如:创建“返回”或“上一个”按钮母板,在按钮上触发OnClick事件:当前正在使用该母板页面的链接。这样做的好处是,将按钮做为母板,可以集中在一个地方更新修改。
或者,页面中有一个母板和一个动态面板,母板中的按钮要隐藏动态面板。母板按钮的OnClick事件可以使用触发事件,在母板中定义交互行为隐藏动态面板。
它可以引发自定义事件,当你需要它时,它是一个强大的功能。
一、创建和使用触发事件
母板介绍
母板中可以触发任何交互事件,在用例编辑器中,选择“触发事件”动作。在步骤4对话框中,可以添加、管理触发事件和选择交互中触发的事件。给触发事件编辑名称,例如OnHelpButtonClick。
在主菜单栏的线框图->管理触发事件对话框中也可以管理触发事件
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
母板交互
在页面中添加母板,选择母板,在部件属性窗口的交互标签下,可以看到触发事件。与在默认事件下添加用例一样,在触发事件下添加用例行为。
案例:“Previous/Next链接”母板
本课程学习使用同一个母板和触发事件在每个页面中打开不同的前一个/下一个链接,在一个母板中的不同交互行为设置。
实现方法
步骤1:打开前一个/下一个链接母板
首先,打开PreviousNextLinkMaster.rp文档,母板窗口打开Previous/Next Links母板编辑页面。
在线框图窗口中,Previous/Next Links母板编辑页面被打开。
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
步骤2:添加Previous链接的OnClick事件
选择文本为“<< PREVIOUS”的文本面板,添加OnClick事件,打开用例编辑器。
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
步骤3:添加“触发事件”动作
在用例编辑器中,添加“触发事件”动作,触发事件动作在动作列表的最下面。
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
步骤4:添加新触发事件OnPreviousClick
在右边面板中,点击绿色的+号按钮,添加一个新的触发事件。命名事件为OnPreviousClick。勾选旁边的复选框确认选择。
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
步骤5:打开页面2,添加OnPreviousClick事件用例
打开页面2,在页面中己经拖入了Previous/Next Links母板,选择母板,在部件属性窗口的交互标签下,和其它默认的事件一样,可以看到OnPreviousClick事件。
添加OnPreviousClick事件用例,选择动作“在当前窗口中打开链接”,勾选配置打开页面1。
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
步骤6:添加Next链接的OnClick事件
返回母板编辑页,在Next链接上重复Previous链接的操作(步骤2到步骤5的操作),为ext链接添加OnNextClick触发事件。
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
步骤7:打开页面2,添加OnNextClick事件用例
返回页面2,选择母板,添加nNextClick事件用例动作为:打开页面3在当前窗口。
如果在其它页面添加了Previous/Next Links母板,OnPreviousClick和OnNextClick事件会执行不同的动作。链接样式修改或重新将“Previous”命名为“Back”时,只需要在母板中编辑一次。