Axure 9.0高级教程:理清原型逻辑,与开发沟通更有底气

一 、条件逻辑概述

看过连载前文的都知道,在Axure中完成一个基本的交互设置其实很简答,我们只要按照提示与引导一步步的选择事件和动作,做好元件和情形(用例)的命名即可。当你熟悉了,情形的命名也可以省略了。

我们知道有些事件的发生是有前提条件的,不同的条件会导致事件发生不同的动作,这就是事务的内在逻辑。“逻辑”一词最早由古希腊学者亚里士多德提出。狭义上逻辑既指思维的规律,也指研究思维规律的学科即逻辑学。广义上逻辑泛指规律,包括思维规律和客观规律。逻辑包括形式逻辑与辩证逻辑,形式逻辑包括归纳逻辑与演绎逻辑,辩证逻辑包括矛盾逻辑与对称逻辑。对称逻辑是人的整体思维(包括抽象思维与具象思维)的逻辑。

在思考逻辑?.jpg


二、如果或否则

当我们为事件添加第1个情形时,如果符合情形1的条件,则执行设定的交互动作;添加第2个情形时,则变成了否则这样的句式,则执行设定的交互动作,变成了与第1个情形对立的情况,即除第1个情形之外的条件下,执行情形2的动作。很多时候我们并不希望这样,比如我们希望在选择省份下拉列表时,选项中选择不同的省,下方显示该省的城市列表。这个时候就需要为省份下拉列表添加”选项改变时“事件,将各省的城市列表转换为动态面板不同的状态。在为省份下拉列表这一元件选择不同的选项时,设置动态面板显示不同的状态,将下拉列表的各项作为情形的逻辑条件。这个时候,其实我们希望每个情形的执行是并列关系,互不干扰。因此,在这里我们手动将其他情形切换为如果的逻辑句式。右击情形,选择“切换为[如果]或[否则]"。


如果或否则.png

三、条件关系-全部和任何

全部:当全部条件都满足时,才能执行设置的动作,每个条件之间是“与”的关系,需要同时成立。我们以登录为例,点击登录按钮时,我们需要判断账号、密码,只有当账户和密码都正确,才提示“登录成功”。账号和密码的条件表达式,他们之间的逻辑关系就是全部。
任何:当其中一个条件满足时,就可以执行设置的动作,每个条件之间是“或”的关系,即只要求其中一项成立。还是以登录为例,点击登录按钮时,判断账号和密码,如果其中一个不正确,则提示“账号与密码不匹配,登录失败”。

假设正确的账号为13333333333,密码为mima333

全部.png

任何.png

四、运算符和表达式

一个完整的条件语句由表达式和运算符构成,表达式的内容可以是文本、变量值、变量值长度、元件文字、元件文字长度、选项、选中状态、面板状态、元件的可见性、元件范围、键盘按键、指针等一切可以通过外在形式表达的内容。运算符包含了算数运算符、关系运算符和逻辑运算符。


表达式.png

运算符.png

4.1 算数运算符

连接两个表达式的算数运算符为==和!=。前一个为赋值符号,即将符号右侧的内容赋值给左侧表达式;第二表示不相等,即运算符两侧的内容不相等。

4.2 关系运算符

条件表达式中间的关系运算符包含了大于(>)、小于(<)、小于等于(<=)、大于等于(>=)。代表了两侧表达式之间的大小关系,表达式的内容通常是可以量化的数值或变量。

4.3 逻辑运算符

条件表达式中,可供选择的逻辑运算符有:包含、不包含、是、不是。主要表达运算符两侧内容的包含关系和是非关系。

五、多条件用例

一个事件下可以添加多个情形。比如,你有一个下拉列表框,其中的项是不同的省份,你可以为给“选项改变时”事件添加多个不同的情形,通过不同的下拉列表项,执行不同的动作。
默认情况下,从第二个情形开始都是否则形式的语句,可以手动点击切换为如果形式的语句。在原型中,用例是从上至下按顺序执行的。我们也可以让每个满足条件的情形都被执行。要做到这一点其实很简单,右击情形,并选择“切换为[如果]或[否则]”,将否则切换为如果。
例如,在注册表单中,对每个文本输入项的内容进行单独验证。当点击注册按钮时,可以为每个文本框添加一个如果结构的条件情形,如果不符合条件,情形就动态显示不同的错误提示。


注册提示.png

六、条件逻辑案例

6.1 登录验证

  1. 使用矩形、文本框、按钮及文本标签等元件,完成登录界面线框图的搭建。文本框作为输入项元件(账号、密码)、按钮为登录,两个文本标签作为登录成功和登录失败的提示信息,注意做好各元件的命名工作。

  2. 为登录按钮添加“鼠标单击时”事件,选中登录按钮,在元件事件列表中选择“鼠标单击时”事件,元件动作列表选择”显示/隐藏“,目标元件选择“登录成功提示”,插入第二个动作“等待”,设置等待1000毫秒(1秒),插入第三个动作“显示/隐藏”,目标元件选择“登录成功提示”。


    登录成功-动作配置.png
  3. 为情形添加条件,我们期望实现的效果是:当输入的账号和密码都正确时,提示“登录成功”;当账号或密码有一个错误时,则提示“账号与密码不匹配,登录失败”。

假设正确的账号为13333333333,密码为mima333

  1. 为第一个情形添加条件,点击添加条件,弹出条件创建弹框,运算符左侧分别下拉选择“元件文字”和“账号输入”,运算符右侧选择文本,填写13333333333,运算符选择==;点击表达式右侧的添加行,添加第二个条件,运算符左侧分别下拉选择“元件文字”和“密码输入”,运算符右侧选择文本,填写mima333,运算符选择==,表达式上方的符合选择“全部”,点击确定,完成条件设置。


    登录成功-条件表达式.png
  2. 为事件添加第二个情形,点击添加情形,点击添加条件,弹出条件创建弹框,运算符左侧分别下拉选择“元件文字”和“账号输入”,运算符右侧选择文本,填写13333333333,运算符选择!=;点击表达式右侧的添加行,添加第二个条件,运算符左侧分别下拉选择“元件文字”和“密码输入”,运算符右侧选择文本,填写mima333,运算符选择!=,表达式上方的符合选择“任何”,点击确定,完成条件设置。点击插入动作,动作列表中选择“显示/隐藏”,目标元件选择“登录失败提示”,选择显示;插入动作“等待”,等待时间设置1000毫秒(1秒),插入动作“显示/隐藏”,目标元件选择“登录失败提示”,选择隐藏。


    登录失败-条件表达式.png

    登录失败-动作配置.png

6.2 城市信息

  1. 拖动下拉列表框至设计区域,添加列表项,项的内容为省份名称,命名为省份;拖动一个列表框至设计区域,添加列表项,项的内容为省城市名称;将列表框右键转换为动态面板,复制多个状态(注意每个状态的命名,建议以省命名),每个状态的列表框显示不同省份的城市,动态面板命名为城市。

  2. 我们期望实现的效果是,当下拉列表框选择不同的省份时,下方的列表框显示对应省份的城市列表。

  3. 选中省下拉列表,在元件事件列表中选择“选项改变时”事件,选择“设置面板状态”动作,目标元件选择动态面板,选择对应的面板状态,点击完成,完成动作设置。


    广东-设置动作.png
  4. 为刚才的情形1设置条件,点击添加条件,在条件创建弹框中,运算符左侧分别选择被选项和当前,运算符右侧分别选择选项和广东,点击确定,完成条件设置。


    广东-设置条件.png

5.为事件添加第2个情形,添加逻辑条件,在条件创建弹框中,运算符左侧分别选择被选项和当前,运算符右侧分别选择选项和浙江。点击插入动作,动作列表选择”设置面板状态”,选中“城市”动态面板,面板状态切换为“浙江”,点击完成,完成动作设置。


浙江-设置条件.png

浙江-设置动作.png
  1. 其他省份的城市列表切换显示同上一步一致。
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 205,386评论 6 479
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 87,939评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 151,851评论 0 341
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,953评论 1 278
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,971评论 5 369
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,784评论 1 283
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,126评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,765评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 43,148评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,744评论 2 323
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,858评论 1 333
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,479评论 4 322
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,080评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,053评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,278评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,245评论 2 352
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,590评论 2 343

推荐阅读更多精彩内容