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

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

   
   
   登录成功-条件表达式.png

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

   
   
   登录失败-条件表达式.png
   
   
   登录失败-动作配置.png

6.2 城市信息

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

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

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

   
   
   广东-设置动作.png

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

   
   
   广东-设置条件.png

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

浙江-设置条件.png

浙江-设置动作.png

6. 其他省份的城市列表切换显示同上一步一致。