开学特惠 会员低至4.4折 限时加赠 10000 AI积分 立即前往 arrow

原型交互变量怎么用?墨刀文本、数字与布尔值教程

文章目录
免费使用墨刀
更新时间: 2026年10月09日

原型变量用来记住用户输入和操作结果,再让界面随之变化。昵称和提示语用文本变量,数量与金额用数字变量,开关或禁用状态用布尔值变量。做一个动态原型时,先确定要保存什么,再设置初始值、绑定界面属性,最后添加改变变量的交互。

在墨刀原型中,可以用变量、条件判断和预览把这些规则做成可操作的页面。下面沿着注册欢迎页、购物车和活动设置三个场景,分别看变量怎样发挥作用。

墨刀变量是什么

墨刀原型交互面板中的变量入口与变量列表

变量是存储信息的小容器,界面元素通过绑定读取它,交互事件通过赋值修改它。例如,“数量”文本显示的是数字变量的当前值;单击加号后,修改的是变量,显示结果随之更新。

类型本例保存的信息建议初值绑定的界面属性
文本用户输入的昵称空文本输入框内容、欢迎语中的昵称
数字购物车商品数量1商品数量显示
布尔值活动是否开启、子开关是否禁用活动关闭,子开关禁用开关状态、禁用状态

不要只看一个值长得像什么。“00123”若是商品编号,通常应按文本保留前导零;“3”若要参与数量加减,则应是数字。变量命名也要表达含义,例如“商品数量”“活动已开启”,比“变量1”更便于查错。

文本变量:把输入昵称显示在欢迎页

注册欢迎页需要把用户刚输入的名字带到下一页。输入“露露”后,欢迎语应显示“露露,第一次见面很高兴认识你”;输入其他名字时,欢迎语也要同步变化。

昵称输入页与欢迎页之间设置文本变量的交互
  1. 为昵称输入框建立文本变量“输入昵称”,将输入框的文本属性与它绑定;欢迎页的昵称文本绑定“欢迎页昵称”。
  2. 给“确定”按钮添加单击事件,先把“欢迎页昵称”设为“输入昵称”,再跳转到欢迎页。
  3. 进入预览,输入“露露”并确认,检查欢迎页显示;返回后换一个名字,再走一次,确认没有继续使用上次的值。

空昵称需要另定规则:可以提示“请输入昵称”,也可以允许跳过并显示通用欢迎语。不要让结果出现“,第一次见面很高兴认识你”这样的残缺句。需要比较其他工具的跨页面配置思路时,可参考Axure登录欢迎页传值教程。

数字变量:购物车数量不能超过上限

这个练习把可购买数量上限设为10,起始数量设为1。10是练习里的业务规则,并非墨刀变量的上限。重点是把“允许加购”和“已达上限”分成两个分支。

购物车加号交互按商品数量小于10进行条件判断
  1. 创建数字变量“商品数量”,初始值为1,绑定商品数量的文本显示。
  2. 准备“库存不足”提示,默认隐藏。
  3. 为加号设置条件判断:数量小于10时,把数量设为“商品数量+1”;否则保持数量不变,显示提示。
  4. 若还提供减号,明确最小值是1还是0。最小值为1时,在数量大于1的分支里才减1;允许减到0时,还要说明是否移除商品。
预览动作本例预期发现问题时先查哪里
从1连续增加到9每次增加1,显示与变量一致是否给同一点击重复配置了加1
从9点一次加号数量变为10条件是在修改前判断,还是先加再判断
在10时再次点加号仍为10,出现库存不足提示否则分支是否还执行了赋值
在最小值1时点减号仍为1是否遗漏最小值条件
刷新预览后重测回到设置的初始状态载入交互是否又覆盖了初始值

如果只把文字手动改成“10”,变量仍可能是9,后续判断就会失真。临时放一个文本框绑定“商品数量”,把实际值显示出来,是定位这类问题的直接办法。与价格联动时,再增加单价与总价的绑定,避免数量与金额各自维护一套结果。

布尔值变量:主开关控制下级功能

“精选活动”关闭时,“奖励发放”和“权益过期”不能操作;开启后,下级开关才可用。这里至少要区分两个含义:主活动是否开启,以及子开关是否禁用。它们的值正好相反,但不能因为名字相近就混为一个状态。

活动推送设置中用布尔值控制奖励发放和权益过期开关的禁用状态
  1. 给“精选活动”的开关状态绑定布尔变量,默认关闭。
  2. 给两个下级开关的禁用状态绑定布尔变量,默认禁用。文字的淡化用于辅助表达,不能代替真正的禁用设置。
  3. 开启主活动时,将下级禁用状态设为false;关闭主活动时,将其设为true。
  4. 再确定关闭主活动后,是否保留下级原先的选择。保留时,下次开启可恢复配置;清空时,要同时把下级开关状态复位。

这项选择应写在活动规则里:关闭只暂停执行,还是清空整组设置,会影响用户再次开启时看到什么。预览时至少走一遍“开主开关→开子开关→关主开关→重新开启”,才能看出联动是否完整。

变量没有生效时,按这条线排查

先看变量值,再看绑定位置,最后看事件顺序。变量值没变,检查触发对象和条件;值变了但界面没变,检查目标属性的绑定;界面一闪又恢复,检查是否有后续事件重新赋值。墨刀帮助中心说明,无延迟的多条交互会按自上而下的顺序执行,首次载入或刷新演示会重置变量。

如果要在打开演示时固定一个状态,可在页面“载入时”设置变量值;需要自动响应多个输入变化时,再使用监听变量制作动态表单。创建、绑定与交互入口可查阅墨刀变量使用指南。

墨刀原型画布中连接旅游应用页面并设置交互

第一次练习不必做完整APP。先完成一个会记住昵称的欢迎页、一组有边界的数量按钮和一组可反复切换的开关,再把它们放回业务页面。进入墨刀工作区建立练习项目时,把变量初值和每条分支的预期结果写在画布旁,评审者就能按同一套规则试用。

免费在线原型设计工具

内容丰富组件拖拽即用

多人在线编辑实时协作

海量模板素材快速复用

一键分享交付在线评论互动