axure9.0 如何打造一个计时器(简单版)

原理:在 Axure 9.0 中制作计时器,核心思路是利用"页面载入时"事件形成一个循环。

🕹️ 第一步:创建变量与界面

  1. 创建全局变量 :点击顶部菜单「项目 」→「全局变量」。

  2. 在弹出的窗口中,点击"添加 ",新建一个名为 CounterVar 的变量。

如果你做正计时 (从0开始增加),将 CounterVar默认值 设为 0

如果你做倒计时 (从N开始减少),将 CounterVar默认值 设为你想要的秒数,例如 60

⚙️ 第二步:实现核心计时逻辑

  1. 选中页面 :点击画布空白处,在右侧"交互"面板中为"页面载入时"事件添加用例。

  2. 设置显示文本 :在用例中,添加"设置文本 "动作,目标选为显示时间的元件。在"设置为"下拉菜单中选择" "或"文本 ",然后点击输入框旁的 fx 按钮,输入 [[CounterVar]]

  3. 更新变量值 :再次点击"插入动作",添加"设置变量值"动作。

(1)目标选择 CounterVar

(2)在"值"的 fx 编辑器中,输入决定计时方向的表达式:

正计时(增加)[[CounterVar + 1]]

倒计时(减少)[[CounterVar - 1]]

4. 设置等待时间 :继续添加"等待 "动作,在"ms"字段中输入 1000(代表1000毫秒,即1秒)。

5. 形成无限循环 :最后,添加"触发事件"动作。

目标选择"页面"。

事件选择"页面载入时"。

完成以上步骤,一个最基础的计时器就做好了。预览页面,你会发现数字会每秒自动变化。

📌 预览

相关推荐
IMPYLH2 小时前
HTML 的 <pre> 元素
前端·javascript·html
tsumikistep3 小时前
【前端】Vue + Axios 跨域问题实战:7070 代理转发 8080 + 401 报错分析(黑马外卖)
前端·javascript·vue.js
lichenyang4533 小时前
鸿蒙首页从等高商品 Grid 到双列瀑布流:同一张图也能做出小红书式浏览节奏
前端
里欧跑得慢3 小时前
Flutter主题与样式详解
前端·css·flutter·web
计算机魔术师3 小时前
TPU推理性价比翻50%,NVIDIA的护城河要见底了?
前端
IT_陈寒3 小时前
Python的多线程就是个假把式,我算是体验到了
前端·人工智能·后端
OpenTiny社区4 小时前
【直播分享】GenUI SDK 技术公开课第二讲 | GenuiChat 核心配置深度解析
前端·github
计算机魔术师4 小时前
kernel.org 每天 600 万次请求,98% 不是人点的
前端
dong_junshuai4 小时前
每天一个开源项目#93 HyperFrames:4.69万星的 HTML 视频渲染框架
开源·html·github