产品-Axure9英文版,使用Repeater中继器实现下拉多选框

文章目录

1.演示

在这里插入图片描述

2.操作

用默认default制作样式
在这里插入图片描述
在这里插入图片描述

拉入repeater,将其中的形状删除,拉入一个Label,

在这里插入图片描述
调整repeater中的间距以及排版问题
在这里插入图片描述
这就意味着repeater内一行放置4个元素
在这里插入图片描述

repeater中行删除
在这里插入图片描述
选择repeater进行赋值,并将repeater重命名”已选择项 列表“
在这里插入图片描述
在旁边拉入一个label,命名”计数器“ 键盘输入0 (后面会说原因)
在这里插入图片描述
选择下面的跳舞选项,添加interaction
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
到此为止,跳舞所含有的interaction如下
在这里插入图片描述

接下来给计数器设定interaction
(大致含义是:勾选爱好后,默认提示语会自动消失,没有爱好时,自动出现,借助计数器这个媒介,勾选爱好时,计数器>0,否则计数器为0)
在这里插入图片描述
在这里插入图片描述
去跳舞那里出发这个计数器时间,两者需要进行联动
在这里插入图片描述
这里fireEvent事件的具体操作如下
Event后面之所以是Loaded事件,是因为我们设置默认提示语时,就是Loaded(可以自行查看”默认提示语“的interaction以验证)
在这里插入图片描述
此时的制作效果如下
在这里插入图片描述
下面就开始解决选择框内的自适应高度问题
在这里插入图片描述
函数式子是这样的:[[LVAR1.y+LVAR1.height+15]]
之所以设置rotated事件,是因为对于这个组件来讲,这是一个永不会触发到的事件,你用哪一个都可以,只要保证在这个页面上不要被触发即可。
(图中解释了含义,蓝色是自己量出来的,粉色就是LVAR1.y,repeater的高就是LVAR1.height。如果理解有误,请指正)
在这里插入图片描述
把下面的部分设置为dynamic panel (方便自适应)在这里插入图片描述
再回到下拉背景框,设置让下面的也自适应大小
[[background.height]]
在这里插入图片描述
再回到跳舞,需要触发下拉背景的rotated才能让其生效
在这里插入图片描述

在unselected中也设置
在这里插入图片描述
将跳舞的这事件,复制给其他乒乓音乐等选项
在这里插入图片描述
在三角位置增加一个hotspot
在这里插入图片描述

增添的interaction如下
在这里插入图片描述
在这里插入图片描述
到了最后阶段,全选所有为一个dynamic panel
在这里插入图片描述
把计数器随便放个位置send to back 隐藏即可
在这里插入图片描述
到此,所有功能全部完成 。
这里说一下为何要设置计数器,有个这个后,就避开了全局变量,你就可以复用作为控件了,如果不信,你可以省区计数器,采用全局变量的模式,复制粘贴到另一个文档,就不管用了…


原创不易,也是为了自己更好的学习,时间久了防止遗忘。
若有错误或者更好的方法,欢迎批评指正。

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Axure RP 9中的中继器是一种非常有用的功能,可以帮助我们快速和轻松地进行表格查询搜索。中继器可以将表格数据和搜索输入进行匹配,然后返回匹配结果。以下是使用Axure RP 9中的中继器进行表格查询搜索的步骤: 1. 准备数据:首先,我们需要有一个包含要搜索的数据的表格。可以在Axure RP 9中创建一个表格,然后填充数据。确保表格的每一列都包含了需要搜索的内容。 2. 创建中继器:在Axure RP 9的“交互”选项卡中,可以找到中继器功能。点击“中继器”按钮,然后在弹出的对话框中选择要使用的表格。Axure RP 9会根据表格的列头自动创建一个中继器。 3. 配置搜索字段:在中继器的配置界面,可以选择想要进行搜索的字段,并设置搜索的匹配条件。例如,可以选择在用户名字段中搜索包含特定关键词的数据。 4. 设计搜索界面:在Axure RP 9的页面上,可以创建一个搜索输入框和搜索按钮,并将其与中继器进行关联。当用户输入搜索关键词并点击搜索按钮时,中继器将会根据配置的搜索条件进行匹配,并返回匹配结果。 5. 显示搜索结果:在Axure RP 9中,可以使用动态面板、数据列表或重复区域等组件来展示搜索结果。根据中继器返回的匹配数据,我们可以在页面上展示查询到的数据。 通过使用Axure RP 9中的中继器-表格查询搜索功能,我们可以轻松地创建一个交互式的搜索功能,帮助用户快速找到他们需要的信息。无论是构建网页设计还是应用原型,这种功能都是非常实用的。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值