欢迎来到天天文库
浏览记录
ID:43378770
大小:3.75 MB
页数:78页
时间:2019-09-30
《原型设计基础与案例实战第5章》由会员上传分享,免费在线阅读,更多相关内容在工程资料-天天文库。
1、第5章数据操作在Axure中,可以很方便地设置常用的交互动画。有了交互动画,原型可以动起来了,但原型里的数据并不会真正变化。本章会介绍如何通过设置变量、函数和中继器,来控制、修改原型中的数据。5.1变量变量是Axure屮存储数据的抽象概念。可以通过变量名称引用变量,使用变量屮存储的数据。Axure中元件的位置、宽度等元件数据是变量,页面的名称、窗口大小等系统数据也是变量。用户还可以输入数据并定义变量。5.1.1使用变量变量主要应用于动作和条件的设置中。在配置动作时,通常可以在直接输入数值來修改参数、改变特定的变量。例如,配置“移动
2、”动作时,可以直接输入数字,改变元件的位置;配置“设置文本”动作时,可以直接输入文字,改变元件上的文本。但在有些时候,直接输入数值不能满足我们的需求。例如,希望把元件移动到另一个元件底部;或希望将“矩形”上的文字设为“输入框”里的文字。无论是获得元件底部的坐标值,还是获得“输入框”里的文字,都需要使用变量。使用变量就需要用到fx功能。(1)在配置动作界面、设置条件界面等许多需要输入“值”的界面都可以看到fx按钮。图5・1仪按钮(2)单击fx按钮,进入“编辑文本”界面,如图5-2所示。•界而上第1个输入框可以插入变量或包含变量的表达
3、式。•界而上第2个输入框可以添加局部变量,后文会有详细介绍。图5-2fx输入界面提示:变量名或包含变量名的表达式,必须写在括号“[[]]”内。括号外的都会被当成普通文字。(3)单击“插入变量或函数”按钮,会弹出如图5-3所示菜单。其中包含了Axure中所有种类的变量和函数,前6类是变量,后5类是函数。>全局变量
4、>中继器/数据集变量函数>元件>页面>窗口
5、>就示指针>Number>字符串>数学>日期>布尔图5・3插入变量或函数卜•面具体介绍Axure中的每种变量和函数。5.1.2全局变量通常,全局变量是用来临时存储数据的。使用全局
6、变量前,需要先创建全局变量。创建后,即可将要存储的数据赋值给全局变量。1•案例说明下面通过一个案例,来说明全局变量的用法。图5-4所示这个原型中,用户先在搜索框中输入“xxx”,单击“搜索”按钮后,下面的文字元件显示结果提示“找不到xxx”。这个过程需要用全局变量存储用户输入的文字。图5・4搜索实现的思路是:将“搜索框”元件上的文字内容传给全局变量,再将全局变量的数据加工后传给“文字提示”元件。2.设置全局变量的值(1)在“搜索”按钮的“鼠标单击时”中添加动作一一设置变量值,如图5-5所示。图5-5设置全局变量提示:界面中可以看到
7、已经有一个变量OnLoadVariableo这个变量是系统自动创建的。(2)单击右上角的“添加全局变量”按钮,进入全局变量界面。添加一个变fiinput,如图5-6所示。•单击绿色加号,可以添加新的变量•单击红色叉号,可以删除变量•单击箭头,可以调整顺序■金IV交RX创it全局3EI3用于测删中3536切換时EUIE・SUH在疋淤艺SW奶®HP?便用2"成!6少的变鼠变■名必刹■字毋如・少于2P>弼・并且不他含空格.+fX*»(a)不能输入屮文(b)可以输入英文IB仝觸交足創变■用于浏删中斑切損时存储銘療.如■在IE那»»洞览原型
8、mi9V用2H1I®少的变5LStl■名必剥■字母如・少于2"字符.并且不S含空恬・1八》IQ■名栋«UOIOnLoadVanaWe用户81入X图5-6添加全局变量提示:输入新变量名称时需要注意字数限制,而且只能是英文字母或数字。如图5■所示中输入中文是不行的。(3)在配置动作界面选中input,设置input值为“搜索框”元件上的文字,如图5-7所示。配口动作图5・7添加全局变量3•使用全局变量(1)添加动作一一设置文本,如图5-8所示。设置“搜索结果”(文字元件)的值为“找不到[[input]]”,其中,“找不到”是一段文字,
9、[[input]]是变量。图5・8设置文本(2)预览原型,可以在浏览器中查看原型的效果。在输入框中输入“王者荣耀”,点击“搜索”按钮,会出现文字提示“找不到王者荣輝”,如图5-9所示。“王者荣輝”四个字通过全局变量,从输入框传给了文字捉示元件。找不到匚者荣縫图5-9原型预览4.全局变量的生命周期全局变量这个名称是翻译的有问题的。它并不存在于“全局”。全局变量只在当前页面有效。当跳转到其他页面,或者页面刷新之后,全局变量就会清零。貝有一种情况例外,如图5-10所示。打开链接动作有一个特殊的配置选项一一“重新打开页而”(变量修改有效)
10、。选择这个选项刷新页面后,页面中的变量保持当时的值不变。图5-10重新加载当前页面(变量修改有效)5.1.3元件变量元件变量分为代表“某个元件”的变量,和代表元件某个“属性”的变量。1•元件本身也是变量元件本身也是一个变量。如图5T1中,This和
此文档下载收益归作者所有