Axure教程:如何用中继器实现列表添加数据案例?

访客3年前黑客文章654

编辑导语:日常事情中,我们常会碰着往列内外添加数据的环境,详细是怎么实现的呢?本文作者通过实际的操纵履历,总结分享了用Axure中继器添加数据的要领,供各人参考。

Axure教程:如何用中继器实现列表添加数据案例?

在许多b端产物中,常常会有添加数据的交互,这里呢,就是一个操作动态面板、中继器实现新增数据的小案例,案例原型可免费下载

预览交互如下:https://jipr1h.axshare.com

之一步 筹备元件

【添加按钮】、【中继器】、【动态面板】、【动态面板中的元件】

如下图(这里回收的表格元件是上一篇文章《中继器实现筛选列表》中的)

将动态面板中的文本框别离定名,留意要定名为字母或数字,不行为中文,各人可随意定名,这边不做限制。

Axure教程:如何用中继器实现列表添加数据案例?

Axure教程:如何用中继器实现列表添加数据案例?

第二步 为中继器添加模板

1、双击中继器,进入操纵页面

Axure教程:如何用中继器实现列表添加数据案例?

2、操纵页面中已有一个矩形框,这里我们可将它删掉,拖入一个矩形框(代表一行表格),拖入几个文本框,别离定名为xingming、xingbie、bianhao、shijian、leixing(留意:这里定名的文字必然要是数字或字母,不行为中文,我这里是拼音;且拖入后,文本框中的文字要删掉);

3、拖入元件后,举办边框、颜色的配置(这里为了雅观)

第三步 为中继器添加数据

Axure教程:如何用中继器实现列表添加数据案例?

如上图所示,在检视-属性页面,为数据集的表格添加数据,并举办定名

第四步 绑定

选中中继器,在检视-属性页面,双击【每项加载时】,添加【配置文本】的用例,将第二步中添加的文本框与第三步添加的数据列依次举办绑定,譬喻:将文本框“xingming”与数据列中的‘xingming’举办绑定,如下图:

Axure教程:如何用中继器实现列表添加数据案例?

Axure教程:如何用中继器实现列表添加数据案例?

绑定后点击确定即可。

绑定后预览图如下:可以看到,显示的数据就是我们在中继器中添加的。

第五步 添加交互

1、选中【确定按钮】,为它添加【鼠标单击时】的交互用例,添加行动【中继器——添加行】,举办配置,使动态面板中输入的文本添加到中继器中;如下图

Axure教程:如何用中继器实现列表添加数据案例?

点击底部【添加行】的按钮,在弹框中举办绑定,

Axure教程:如何用中继器实现列表添加数据案例?

点击中继器下每一列下边的fx,自界说局部变量,变量名称可随意配置为字母或数字,然后插入变量,输入函数公式[[xingming.text]],点击确定;如下图。

Axure教程:如何用中继器实现列表添加数据案例?

2、将动态面板埋没,并移动到符合的位置,选中【添加按钮】,为其添加【鼠标单击时】的交互用例,配置【显示】动态面板,动画选为“flip up”,其他结果为灯箱结果,颜色可自行配置呦。

3、选中【确定按钮】,添加【鼠标单击时】的用例,配置【埋没】动态面板,动画为无。

Axure教程:如何用中继器实现列表添加数据案例?

第六步 预览

配置完成后,生存,举办预览,输入数据后,点击确定,可以看到列表中新增了一行数据。这样就完成了呦!

Axure教程:如何用中继器实现列表添加数据案例?

Axure教程:如何用中继器实现列表添加数据案例?

以下为案例原型免费下载链接:

链接:https://pan.baidu.com/s/1wsI5DfMdBI5WY-uiibceRg

相关文章

管理后台:如何设计自动续订类虚拟商品的订单记录?

管理后台:如何设计自动续订类虚拟商品的订单记录?

编辑导读:当我们购置会员时,往往会有自动续费的选项。那么,你有没有对自动续订类虚拟商品举办过思考呢?本文作者就从自动续订类虚拟商品订单的业务场景、特征和设计这三个方面举办了具体的叙述,但愿看后可以或许...

社交电商明明“不受待见”,阿里、京东为何还要入局?

社交电商明明“不受待见”,阿里、京东为何还要入局?

编辑导读:一二线都市的红利逐渐封顶,许多企业将眼光转向了下沉市场,以拼多多为首的社交电商就是个中佼佼者。可是,也有许多人认为社交电商严重影响了社交干系,不堪其扰。本文将从两个方面,环绕社交电商展开阐明...

花式助力高考,百度滴滴们到底在图什么?

花式助力高考,百度滴滴们到底在图什么?

编辑导读:在方才已往的高考中,互联网大厂们各显神通,为高考生提供了优质的处事。本文将从三个方面,对这个现象展开阐明先容,但愿对你有辅佐。 本日,所有省区市的高考都将竣事。 这届高考与往年差异,首先是...

短视频涨粉技巧之“选题策划”:3大选题策略,做出让用户欲罢不能的内容!

短视频涨粉技巧之“选题策划”:3大选题策略,做出让用户欲罢不能的内容!

编辑导语:抖音的爆火敦促了短视频行业的迅速成长,以前的名流是明星、是网红,而此刻任何一个普通人都有时机通过短视频成为名流。在此次剧烈的竞争和复杂的用户群体之下,涨粉也变得越来越难。本文作者就总结了三大...

0-1搭建个性化推荐系统的设计思路

0-1搭建个性化推荐系统的设计思路

编辑导语:本性化推荐系统是互联网和电子商务成长的产品,它是成立在海量数据挖掘基本上的一种高级商务智能平台,向顾主提供本性化的信息处事和决定支持。本日,本文作者就团结本身的经验,为我们分享了从0到1搭建...

这些提升产品体验的小细节,你注意到了吗?(07)

这些提升产品体验的小细节,你注意到了吗?(07)

编辑导语:设计师往往会赋予产物一些人性化的小设计,有些产物的小细节用户在利用的进程中留意到了,而且深得消费者的青睐,而有些则被忽略了。本文作者通过日常的利用、思考与总结,为我们分享了一些既能美化界面,...