10.1 元素交互
现在,大多数元素都具有交互行为,因此您可以更改复选框状态,键入“编辑框”并在“列表框”条目中进行光标移动等。
单击某个元素将使其具有键盘焦点(如果可以接受),您也可以使用Tab键在交互式元素之间移动。使用自顶向下,从左至右的方法自动确定跳位顺序。尽管这在每种情况下都不是理想的,但通常情况下还不错,并且避免了在原型中手动设置跳位顺序的情况。
当许多元素具有键盘焦点时,可以使用空格键更改它们的状态。例如,复选框将更改状态,而按钮将**。
Enter键现在将执行“关闭并接受”操作。尽管在Microsoft Windows中这并不是严格正确的,但是因为当非默认按钮具有焦点时,应该将其**,它应该足以用于原型设计,并且可以始终使用空格键来**按钮。
和以前一样,退出键将执行“关闭并取消”操作。
10.1.1 单选按钮组
单选按钮需要特殊处理,因为它们在组内而不是单独地起作用。 当您选择一个单选按钮时,组中的其他单选按钮必须取消选择。
要标识哪些单选按钮属于一起,请多次选择相关的单选按钮,然后使用右键单击上下文菜单中的“创建选择组”命令:
每当您选择单选按钮时,组中的所有其他按钮将以黄色框突出显示:
如果需要将单选按钮添加到组中,请使用该组中已经存在的一个或多个单选按钮(以任意顺序)多次选择它,然后从上下文菜单中选择“添加到选择组”命令。
同样,您可以使用上下文菜单中的“从选择组中删除”命令从与其关联的组中删除任何选定的单选按钮。
10.2 交互变量
仅限专业版
适当元素的“原型”属性选项卡允许指定命名的“变量”。在运行原型时,与元素交互时,此变量的值会更改。
元素可以共享同一变量,因此使用同一变量更改一个元素将影响所有其他元素。例如,可以为“滑块”和“编辑框”分配相同的变量,以便移动“滑块”将更改“编辑框”中的值,而在“编辑框”中键入新值将移动“滑块”。
您可以使用诸如“单击按钮”之类的操作,通过“故事板”面板中的“设置数据”框来更改变量值。
多值变量
大多数元素只有一个与变量关联的值,但是某些元素(例如列表和树)具有附加值。这些使用“点符号”命名。例如,如果您有一个包含类别名称的列表框,并将其变量设置为“类别”,则:
“类别”提供了一个逗号分隔的列表,列出了列表中所有选定的类别,并且
“ Categories.count”提供列表中的类别数。
有关可应用于每个元素的变量的完整列表,请参见《元素变量参考》。
大多数文本元素允许将变量值包含在文本中。例如,您可能想显示一条短信中列表中的项目总数。有关详细信息,请参见“文本替换”部分。
重要说明:为每个元素分配变量可能会浪费时间。仅在需要使用该值影响原型的另一部分或根据该值做出导航决定时才添加它们。
10.2.1 项目变量
仅限专业版
除了在元素“原型”属性中定义变量外,还可以在项目选项中创建变量集(“项目|项目选项...”菜单命令)。
每个数据集均包含变量名及其对应值的列表。所有变量值均视为文本,因此可以包含任何内容。当需要数字解释时(例如,设置Slider值时),任何非数字的值将为零(0)。
运行原型时,您可以选择将每个集合用于初始数据值。除了设置原型的初始条件外,这也是设置任何常规文本替换的好地方,尽管这是很少使用的高级功能。
资料设定档
项目数据集是设置运行原型时可以从菜单随时分配的信息配置文件的理想选择。
例如,您可以为提议的应用程序的不同用户创建数据集,其中包含其名称,登录详细信息和任何其他信息。然后,当您到达原型中的适当位置时,可以**数据集,而不必手动输入所有信息。
这将消除键入错误,并大大提高您呈现和测试原型中不同场景的能力。
10.3 文本替换
仅限专业版
设计中的任何文本都可以在文本本身内嵌入变量值。例如,您可以使用此功能轻松地将文本覆盖在进度条上以显示完成的百分比(假设进度条范围为100)。
基本格式是将变量名称括在大括号中:
{{变量名}}
例子1
可能通过“编辑框”条目或“设置数据”框创建了一个名为“ FlightDistance”的变量,其值为“ 248”。具有以下内容的Text元素:
“距离:{{FlightDistance}}英里”
将显示为:
“距离:248英里”
例子2
放在进度栏顶部的Text元素的内容值可能设置如下:
“ {{InstallProgress}}%”
如果变量“ InstallProgress”设置为“ 75”,那么它将显示为:
“ 75%”
重要的提示
有时在单文本控件(例如组合框或编辑框)中包含替代文本以进行可视化很有用。请注意,如果将变量分配给控件元素,尽管它会按预期显示,但该变量将接收原义文本值,而不是替换值。
例如,如果变量“ MyDataVariable”的值为“ 42”,并且将变量“ MyCombo”分配给文本设置为“ {{MyDataVariable}}”的组合框,则“ MyCombo”将被分配值为“ {{MyDataVariable}}”而不是“ 42”。
由于文本替换,它将显示为“ 42”。但是表达式“ MyCombo = 42”将为假!
如果需要进行这种值测试,则正确的方法是预先为控制变量分配一个适当的值,而不要在控件“文本”字段中使用文本替换。例如,使用“设置数据”将“ MyCombo”设置为“ {{MyDataVariable}}”。
10.3.1 处理缺省变量
仅限专业版
如果变量不存在,或者只是尚未设置,而您需要显示一些替代文本,则可以设置默认值来显示:
{{VariableName = DefaultValue}}
'='周围的空格是可选的,如果存在,将被忽略。
范例1:
“欢迎{{UserName = Guest}}”
如果已通过一些登录操作将“ UserName”设置为“ Peter”,则将显示:“ Welcome Peter”。
如果尚未设置“用户名”,则将显示“欢迎来宾”。
范例2:
当然,默认值也可以是具有其自身默认值的变量。这是一个来自可重用的“消息框”组件的真实示例,该组件使用文本替换来设置标题文本:
“ {{MessageTitle = {{AppName =应用程序名称}}}}”
如果已设置“ MessageTitle”,则将使用该名称。
否则,如果已设置“ AppName”(可能作为项目变量),则将使用该名称。
否则,将使用默认的“应用程序名称”标题。
10.3.2 复杂文本替换
仅限专业版
一个高级但非常强大的功能是可以在变量本身内使用变量文本替换的功能。变量名称和默认值都可以取决于一个或多个其他变量的值!
作为一个可能在其中有用并举例说明一般技术的示例,复选框将其变量值设置为0、1或2。因此,如果使用如下所示:
我的选择是:{{MyOption}}
根据“ MyOption”的值,结果将是:
0->“我的选择是:0”
1->“我的选择是:1”
2->“我的选择是:2”
为了使显示更有意义,可以使用“翻译变量”将其翻译为可读的文本。使用“设置数据”操作或项目变量,如下设置三个“ CheckStateX”变量:
将“ CheckState0”设置为“未选中”
将“ CheckState1”设置为“已检查”
将“ CheckState2”设置为“不确定”
现在,您可以使用以下内容:
我的选择是:{{CheckState {{MyOption}}}}
根据“ MyOption”的值,结果将是:
0->“我的选项是:未选中”
1->“我的选项是:已选中”
2->“我的选择是:不确定”
但是,如果未设置转换变量,则将找不到“ CheckStateX”变量。在所有情况下,这将导致显示空白值:
0->“我的选择是:”
1->“我的选择是:”
2->“我的选择是:”
如果需要,可以通过设置默认值来解决此问题:
我的选择是:{{CheckState {{MyOption}}} = {{MyOption}}}}
现在,如果未设置转换变量,则将显示以下内容,就像原始示例中一样:
0->“我的选择是:0”
1->“我的选择是:1”
2->“我的选择是:2”
或者,您可以创建一些更奇特的东西作为默认值,如下所示:
我的选择是:{{CheckState {{MyOption}}} = ==>({{MyOption}})<==}}
如果未设置转换变量,则显示以下结果:
0->“我的选择是:==>(0)<==“
1->“我的选择是:==>(1)<==“
2->“我的选择是:==>(2)<==“
10.4 表达式替代
仅限专业版
从版本4.3.135.0开始,类似于可变文本替换,设计中的任何文本都可以将计算出的表达式值嵌入文本本身。例如,您可以使用此功能添加输入的值并显示总和或平均值。
基本格式是将变量名称括在大括号中:
{[表达]}
注意:与可变文本替换不同,表达式替换不能相互嵌套。换句话说,您不能在表达式本身内放置{[expression]}。但是,解析器完全有能力直接处理复杂的表达式,因此永远都不需要这样做。
例子1
分别通过“编辑框”条目或“设置数据”框,分别创建了两个名为“Income”和“Expenditure”的变量,其值分别为“ 52000”和“ 38000”。具有以下内容的Text元素:
“利润:$ {[Income-Expenditure]}”
将显示为:
“利润:$ 14000”
例子2
放在进度栏顶部的Text元素的内容值可能设置如下:
“ {{InstallProgress}}%”
如果变量“ InstallProgress”设置为“ 75”,那么它将显示为:
“ 75%”
10.5 通过用户操作设置数据值
仅限专业版
通过连接到“故事板”面板上的“设置数据”框,您可以更改任何变量值,以响应鼠标单击或其他导航事件。
您可以从一个“设置数据”框中设置任意数量的变量,并且“to”值可以包含数字值,文本或基于其他数据的表达式。
最好将文本值括在引号中("My Value")。这使它无法作为表达式或数据变量进行求值。但是,如果不使用引号,并且该值作为表达式没有任何意义,那么无论如何它将被视为简单文本。有关表达式中可能包含的内容的详细信息,请参见表达式参考。
当原型运行时,如果将设置的数据变量与某个元素相关联,则该元素将立即更新以反映值的变化。
版本4.3中的更改:如果从使用“模态选择弹出”显示的窗口或屏幕导航到“设置数据”框,则该弹出窗口将关闭。例如,这允许设计中的“弹出菜单”命令**用户界面更改,并将“设置数据”作为关闭菜单的操作。
版本4.3.135.0中的更改:“设置”框中的“变量名称”现在可以包含文本替换,因此要设置的变量可以取决于一个或多个其他变量的值。例如:Result {{Option}},如果“ Option”的值为“ A”,则将为变量“ ResultA”设置数据。
例
更改Ribbon Bar元素(其变量设置为“ RibbonContext”)的活动上下文,以在用户单击文档中表中的图像时显示关联的上下文选项卡:
注意:要重置上下文并删除上下文选项卡,必须使用另一个“设置数据”操作将RibbonContext值设置为空白(“”)。
10.6 条件导航
仅限专业版
条件框属性包括每个方案的“条件”条目:
有关条件表达式中可能包含的内容的详细信息,请参见元素变量参考和表达式参考。
在设计画布上,具有关联条件的方案用“#”符号标记:
情景评估
可能会同时发生多个场景条件评估为“真”的情况,但是可能仅**其中之一。运作方式如下...
1.将条件评估为“ True”的所有方案都添加到列表中。
2.如果没有带条件的方案评估为True,则所有其余方案(无条件)都将添加到列表中。否则,将忽略无条件的方案。有条件的人总是优先考虑的。
3.如果列表中只有一个方案,则选择该方案。
4.如果列表中存在多个场景,则根据“原型选项”,可使用常规选择规则,该规则可从“运行|原型选项...”菜单命令获得: