Axure 7.0教程_小楼作品(十六)多值单变量的页面传值

简介: axure7.0教程_小楼作品(十六)多值单变量的页面传值作者: 小楼一夜听春语 分类: Axure7.0教程 时间: 2013-08-20 12:00 ė4,822 浏览数 62条评论今天这篇Axure教程,主要讲的是字符串函数的应用。


axure7.0教程_小楼作品(十六)多值单变量的页面传值


作者: 小楼一夜听春语 
分类: Axure7.0教程 
时间: 2013-08-20 12:00  ė4,822 浏览数  62条评论

今天这篇Axure教程,主要讲的是字符串函数的应用。在我们做一些Axure原型的时候,经常需要实现在两个或多个页面传递一些信息的效果,比如:将一件商品选择并点击购买按钮后,跳转到另一个页面中进行结算,这个时候就要把选中的商品信息在另外一个页面中显示。在Axure6.5中这种效果也可以实现,但是需要使用与信息数量相等的变量来实现,比如名称一个变量,价格一个变量,数量一个变量。Axure官方的建议在一个原型中变量不要超过25个,所以变量的资源是紧俏的,就好像我们痛恨有钱人搞二三四五六七八奶,其实你搞不搞我管不着,但是妹纸都让你一个人搞了,一个都不给我留我就不干了。变量也一样,一个模块占用了大量的变量,等其他模块有需求的时候发现没有了,就会想搞不上妹纸一样郁闷。所以,感谢天、感谢地、感谢Axure7,只要通过一个字符串函数,我们就能N个信息同时使用一个变量……好像有内涵…..,我是不是又邪恶了。

好了,闲话不多说,让我们来看看怎么来实现。

本教程使用的函数:substring和indexof

说明:substring用来截取字符串,indexof用来获取分隔符的位置。

本教程示例原型下载:axure7.0教程_小楼作品(十六)多值单变量的页面传值.rp

首先,还是准备元件:

1、  准备三个文本框,分别设置好标签xingming、xingbie、nianling;

2、  准备好一个按钮,用来触发事件;

3、  打开跳转页,放进去一个2行3列表格,第一行写上数据名称,第二行的三个单元格分别写好标签,准备接受数据。

4、  将表格转换为动态面板,因为要用到动态面板的加载事件,避免使用页面加载事件。

元件准备完毕,就直接开始制作了,这个是技术活,不需要思路。

1、  我们新增一个变量叫xinxi,然后在按钮的onclick事件中设置这个变量的值,我们需要把三个文本框的值都赋给这个变量,这时候就需要在fx里面设置3个局部变量(局部变量只在单个事件范围内有效,对全局无影响),来获取这3个文本框的值,并把三个局部变量掉取出来,和分隔符一起组成一个字符串。如图所示,我们在三个局部变量中间插入了2个分隔符|1|和|2|,分隔符是自定义的,只要不与局部变量值相同就可以。

16

 

16-1

2、  设置完变量的值后,再添加一个跳转到列表页的事件。

3、  在动态面板的加载事件中添加事件,来分解字符串,并将分解出来的字符串添加到不同的单元格。

分解过程:

我们知道变量里的字符串结构是:xingming值|1|xingbie值|2|nianling值

第一个单元格的文字,我们需要取到xingming值,在这里我们使用substring进行截取,

Substring(from,to)的两个参数分别是截取的起始位置和截取的最终位置+1,我们知道字符串的起始位置是0,但是最终位置就难以确定,因为每次输入的值得长度都可能不一样,所以这里我们需要用到indexof通过确定分隔符的位置,来确定截取的位置。

Indexof的使用方法,变量.indexof(’字符串参数’),一定要有两个单引号,否则会出错。

16-2

如图所示:

Ximing值截取的位置:0,xinxi.indexof(‘|1|’)

Xingbie值截取的位置:xinxi.indexof(‘|1|’)+3,xinxi.indexof(‘|2|’)

说明:起始位置+3是因为要从|1|之后的位置开始截取,而xinxi.indexof(‘|1|’)的位置是|1|中前面那个竖线的位置,所以要在取到的位置上+3。

Nianling值得截取位置:xinxi.indexof(‘|2|’)+3

说明:使用substring截取字符串,如果只输入一个参数,意思就是从输入的参数的位置一直截取到末尾。

最后我们就把上面的这三组参数都分别放在xinxi.substing(,)中,并添加到相应的单元格:

单元格xingming文字= [[xinxi.substring(0, xinxi.indexof('|1|'))]]

单元格xingbie文字= [[xinxi.substring(xinxi.indexof('|1|')+3, xinxi.indexof('|2|'))]]

单元格nianling文字= [[xinxi.substring(xinxi.indexof('|2|')+3))]]

 

好了,教程到此结束,下面就是鉴证奇迹的时刻!你做对了吗?

----------------------------------------------我是分割线---------------------------------------------- 

小楼老师倾力打造AxureRP7.0精品课程系列,内容细腻而风骚,声音甜美而动人,非一般的技术加上淫荡的思路,各种姿势涨的你受不鸟,想进入?想深入?想高.......超?想要就从下面进去! 

《AxureRP7.0从入门到精通》从零向高手蜕变的必修课            马上偷窥>>
 

本文出自 Axure原创教程网,转载时请注明出处及相应链接。

本文永久链接: http://www.iaxure.com/454.html






目录
相关文章
|
5月前
|
JSON JavaScript 前端开发
Axure函数与属性速查
Axure函数与属性速查
|
11月前
|
前端开发
前端学习笔记202304学习笔记第六天-对象语法绑定css样式
前端学习笔记202304学习笔记第六天-对象语法绑定css样式
53 0
|
Android开发 索引 iOS开发
第二十四章:页面导航(十七)
像现实生活中的应用程序理想情况下,用户在终止并重新启动应用程序时不应该知道。应用程序体验应该是连续且无缝的。即使程序没有一直运行,一个半月进入的条目从未完成也应该在一周后处于相同的状态。NoteTaker程序允许用户记录由标题和一些文本组成的注释。
524 0
|
JavaScript 前端开发 Android开发
第二十四章:页面导航(十六)
保存和恢复导航堆栈 许多多页面应用程序的页面体系结构比DataTransfer6更复杂,您需要一种通用的方法来保存和恢复整个导航堆栈。此外,您可能希望将导航堆栈的保存与系统方式集成,以保存和恢复每个页面的状态,特别是如果您不使用MVVM。
463 0
|
XML JSON Android开发
第二十四章:页面导航(十五)
保存和恢复页面状态特别是当您开始使用多页面应用程序时,将应用程序的页面视为数据的主要存储库非常有用,而仅仅是作为底层数据的临时可视化和交互式视图。这里的关键词是暂时的。如果您在用户与之交互时保持基础数据是最新的,那么页面可以显示和消失而不必担心。
629 0
|
JavaScript Android开发
第二十四章:页面导航(十四)
切换到ViewModel此时应该很明显,Information类应该真正实现INotifyPropertyChanged。 在DataTransfer5中,Information类已成为InformationViewModel类。
572 0
|
Android开发 索引
第二十四章:页面导航(十二)
事件在方法调用方法和消息中心通信方法中,信息页面需要知道主页的类型。 如果可以从不同类型的页面调用相同的信息页面,这有时是不合需要的。这个问题的一个解决方案是info类实现一个事件,这就是DataTransfer3中采用的方法。
491 0
|
Android开发 索引
第二十四章:页面导航(十一)
消息中心您可能不喜欢两个页面类直接相互调用方法的想法。 它似乎适用于小样本,但对于具有大量类间通信的大型程序,您可能更喜欢一些不需要实际页面实例的更灵活的东西。这样的工具是Xamarin.Forms MessagingCenter类。
524 0
|
JavaScript Android开发
第二十二章:动画(十四)
你自己的等待动画在本章的下一节中,您将看到Xamarin.Forms实现的基础动画基础结构。这些底层方法允许您定义自己的动画函数,这些函数返回Task对象,并且可以与await一起使用。在第20章“异步和文件I / O”中,您了解了如何使用静态Task.Run方法创建执行的辅助线程,以执行像Mandelbrot计算这样的密集后台作业。
711 0
|
JavaScript Android开发
第二十二章:动画(十一)
入口动画实际编程中的一种常见类型的动画是在页面首次可见时发生的。 页面上的各种元素可以在进入最终状态之前进行简要动画处理。 这通常被称为入口动画,可能涉及: 翻译,将元素移动到最终位置。 缩放,将元素放大或缩小到最终尺寸。
843 0