在原型设计中,有条件的执行交互动作是比较常见的。
例如对一个年龄输入框中的文字进行判断,从而给出对应的提示。
首先,一个输入框内容的验证,有基本的两种情形:输入正确与输入错误。
那么,我们就需要分析输入正确需要符合什么条件,或者输入错误符合什么条件。
一、从输入正确的角度分析
1、输入的内容必须是大于0;
2、输入的内容必须小于等于150(目前公认的年龄极限)。
当同时符合上面的两个条件时,我们认为输入是正确的,否则就是错误的。
我们在用户完成输入时,正确的输入,给出正确的提示;错误的输入,给出错误的提示。
接下来,我们在画布中放入文本框和文本标签元件,进行相应的设置。
文本标签需要双击进入编辑状态,删除原有的文字。
并且,为文本框和文本标签元件分别命名。
温馨提示:元件的名称可以在交互、样式以及说明面板的顶部输入,也可以在概要面板中单点两次名称进行编辑。
提示是在用户输入完毕后出现,这个交互事件的触发是[失去焦点时]。
我们选中画布中的文本框元件,[新建交互],选择[失去焦点时]。
警告:用户是对文本框进行了操作,交互要添加给文本框,不要傻呵呵的给文本标签添加交互。
此时,需要先添加某一种情形的反馈,也就是动作。
Axure的交互事件是由上至下执行的。
我们既然是以输入正确的角度进行的分析,这里就先添加输入正确的反馈。
选择动作[设置文本],设置的目标是[提示]元件,将它的文本设置为“输入正确”。
完成这个交互事件的设置之后,我们在交互事件的名称后方点击[启用情形]按钮,进行情形的设置。
在情形设置的窗口中,我们先输入情形的名称“输入正确时”。
再进行[添加条件]的设置。
第一个条件依次选择[元件文本][当前][>][文本],文本之后的输入框中输入“0”。
点击[添加行]按钮,添加第二个条件,依次选择[元件文本][当前][<=][文本],文本之后的输入框中输入“150”。
这样,我们就完成了第一种情形的添加。
点击[添加情形]按钮(就是刚才的启用情形按钮),添加另一种情形。
情形的名称是“输入错误时”。
因为与第一种情形条件互斥,我们不用添加任何条件,直接点击确定按钮。
系统会自动将这种情形设置为否则的逻辑关系。
然后,我们添加这种情形的反馈。
点击[添加动作]按钮,[设置文本]到[提示]元件,文本内容为“输入错误”。
到这里,我们就实现了想要的交互效果。
二、从输入错误的角度分析
1、输入的内容小于等于0;
2、输入的内容大于150。
温馨提示:文本框未输入任何内容时,它的值是空值,空值等同于0,符合小于等于0的条件。
当符合以上任何一个条件时,都是输入错误的情形,否则是输入正确的情形。
所以,从输入错误的角度进行分析时,情形的添加顺序正好相反。
并且,条件设置上略有变化。
需要注意的是,这种满足任一条件的情形,需要在情形设置窗口的右上方,将匹配类型更改为[匹配以下任何条件]。
最后,还有一个关于情形之间逻辑关系的操作。
就是通过右键菜单中的[切换]选项,可以对多个情形的逻辑关系进行改变。
也就是说,在同一个交互事件中,可以出现多个[如果(if)]的情形,即多组条件判断。
例如下面的示例,同样能够实现我们的交互需求。
假设用户输入了某个正确或错误的数值,模拟交互事件的执行过程,从上至下阅读,你能看懂它的逻辑吗?
不习惯看文字教程?还有《Axure RP 9萌新修炼视频》奉上!
转载请注明:iaxure.com » 情形(条件)的设置