Axure常用变量及使用方法详解

点击下载《Axure常用变量及使用方法详解.pdf》

摘要

Axure RP 作为一款领先的前端原型设计工具，提供了全面的 变量 和 函数 系统，以支持复杂的交互设计和动态内容展示。本文将从专业角度详细解析 Axure 中的 全局变量、中继器数据集变量/函数、元件变量/函数、页面变量/函数、窗口变量/函数、鼠标指针变量/函数、数值处理函数、字符串处理函数、日期处理函数 以及 布尔值 的逻辑运算符。通过详细的示例和步骤说明，帮助读者全面理解和掌握这些关键功能，从而在原型设计中实现更高效、更灵活的交互效果。

1. 全局变量（Global Variables）

1.1 变量类型

  • [[GlobalVariableName]]：自定义全局变量，用于在整个原型中共享数据。

在这里插入图片描述

在这里插入图片描述

1.2 使用场景

  • 跨页面数据传递：在多个页面之间传递用户输入或计算结果。

    • 示例：

      在登录页面设置 userName，当用户输入用户名登录成功后，使用该变量保存用户输入的用户名，然后在其他页面展示当前登录的用户。

      <!-- 在主页显示 -->
欢迎, [[userName]]!

在这里插入图片描述

  • 用户偏好设置存储：存储用户的偏好设置，如主题、语言等。

    • 示例：设置 [[theme]] 为用户选择的值，并在不同页面应用相应的主题。

  • 多组件共享参数：在多个组件之间共享参数，如筛选条件、排序方式等。

    • 示例：设置 [[filterCriteria]] 为用户选择的筛选条件，并在多个中继器中使用该变量。

1.3 注意事项

  • 命名规范：使用有意义的名称，避免使用保留字。
  • 作用域管理：全局变量在整个原型中共享，需谨慎使用以避免命名冲突和数据污染。

2. 中继器数据集（Repeater Dataset）

2.1 变量类型

  • [[Item.ColumnName]]：当前行中指定列的值。
  • [[TargetItem.ColumnName]]：目标行中指定列的值（用于条件判断或交互）。
  • [[Repeater]]：当前中继器对象，可用于访问中继器的属性和方法。

2.2 核心函数

函数描述示例
Item.Repeater当前项所属的中继器对象[[Item.Repeater.name]]
Item.index当前项的索引（从 1 开始）[[Item.index]]
Item.isFirst当前项是否为第一项[[Item.isFirst]]
Item.isLast当前项是否为最后一项[[Item.isLast]]
Item.isEven当前项的索引是否为偶数[[Item.isEven]]
Item.isOdd当前项的索引是否为奇数[[Item.isOdd]]
Item.isMarked当前项是否被标记[[Item.isMarked]]
Item.isVisible当前项是否可见[[Item.isVisible]]
Item.columnCount当前中继器的列数[[Item.columnCount]]
Item.rowCount当前中继器的总行数[[Item.rowCount]]

2.3 使用示例

  • 动态生成列表项：

    "[[Item.Name]]: [[Item.Description]]"

    在这里插入图片描述

2.4 注意事项

  • 数据集操作：通过 “设置数据集” 动作可以动态更新中继器数据。
  • 分页控制：使用 Item.rowCount 和 Item.index 实现分页功能。

3. 元件变量/函数（Widget）

3.1 变量类型

  • [[This]]：当前元件对象。
  • [[Target]]：目标元件对象（用于交互中引用其他元件）。

3.2 核心函数

函数描述示例
this.text当前元件的文本内容[[This.text]]
this.x当前元件的 x 坐标[[This.x]]
this.y当前元件的 y 坐标[[This.y]]
this.width当前元件的宽度[[This.width]]
this.height当前元件的高度[[This.height]]
this.rotation当前元件的旋转角度[[This.rotation]]
this.opacity当前元件的透明度[[This.opacity]]
this.isVisible当前元件是否可见[[This.isVisible]]
this.isSelected当前元件是否被选中[[This.isSelected]]
this.scrollX当前元件的水平滚动位置[[This.scrollX]]
this.scrollY当前元件的垂直滚动位置[[This.scrollY]]

3.3 使用示例

  • 动态调整元件大小：

    // 设置元件宽度为 200px
[[This.width]] = 200

  • 切换元件可见性：

    // 切换元件的可见性
[[This.isVisible]] = ![[This.isVisible]]

  • 移动元件位置：

    // 将元件移动到 (100, 100) 坐标
[[This.x]] = 100
[[This.y]] = 100

3.4 注意事项

  • 动态更新：通过 “设置文本”、“设置尺寸” 等动作可以动态更新元件的属性。
  • 事件驱动：元件变量常用于事件驱动的交互设计中。

4. 页面变量/函数（Page）

4.1 变量类型

  • [[PageName]]：当前页面的名称。

4.2 核心函数

函数描述示例
Page.width当前页面的宽度[[Page.width]]
Page.height当前页面的高度[[Page.height]]
Page.scrollX当前页面的水平滚动位置[[Page.scrollX]]
Page.scrollY当前页面的垂直滚动位置[[Page.scrollY]]
Page.url当前页面的 URL[[Page.url]]
Page.title当前页面的标题[[Page.title]]

4.3 使用示例

  • 显示当前页面名称：

    "当前页面: [[PageName]]"

  • 根据页面宽度调整布局：

    // 根据页面宽度设置背景颜色
[[Page.width]] > 1200 ? "large-layout" : "small-layout"

4.4 注意事项

  • 页面导航：通过页面变量可以实现页面间的数据传递和导航控制。
  • 动态页面：适用于需要根据用户操作动态改变页面属性的场景。

5. 窗口变量/函数（Window）

5.1 核心函数

函数描述示例
Window.width浏览器窗口的宽度[[Window.width]]
Window.height浏览器窗口的高度[[Window.height]]
Window.scrollX当前窗口的水平滚动位置[[Window.scrollX]]
Window.scrollY当前窗口的垂直滚动位置[[Window.scrollY]]
Window.name当前窗口的名称[[Window.name]]
Window.top当前窗口的顶部位置[[Window.top]]
Window.left当前窗口的左侧位置[[Window.left]]

5.2 使用示例

  • 显示窗口大小：

    "窗口大小: [[Window.width]]x[[Window.height]]"

  • 根据滚动位置显示按钮：

    // 当滚动位置超过 100px 时显示按钮
[[Window.scrollY]] > 100 ? "show-button" : "hide-button"

5.3 注意事项

  • 响应式设计：通过窗口变量可以实现响应式布局和动态调整。
  • 滚动控制：适用于需要根据滚动位置触发交互的场景。

6. 鼠标指针（Cursor）

6.1 核心函数

函数描述示例
Cursor.x鼠标指针的 x 坐标[[Cursor.x]]
Cursor.y鼠标指针的 y 坐标[[Cursor.y]]
Cursor.dragX鼠标拖动的水平距离[[Cursor.dragX]]
Cursor.dragY鼠标拖动的垂直距离[[Cursor.dragY]]
Cursor.totalDragX鼠标拖动的总水平距离[[Cursor.totalDragX]]
Cursor.totalDragY鼠标拖动的总垂直距离[[Cursor.totalDragY]]
Cursor.downTime鼠标按下持续的时间[[Cursor.downTime]]

6.2 使用示例

  • 显示鼠标位置：

    "鼠标位置: ([[Cursor.x]], [[Cursor.y]])"

  • 检测鼠标拖动：

    // 当拖动距离超过 50px 时执行操作
[[Cursor.totalDragX]] > 50 || [[Cursor.totalDragY]] > 50 ? "drag-detected" : "no-drag"

6.3 注意事项

  • 交互触发：通过鼠标指针变量可以实现鼠标悬停、点击、拖动等交互触发。
  • 动态响应：适用于需要根据鼠标位置或状态动态改变元件属性的场景。

7. 数值处理（Number）

7.1 变量类型

  • [[LVAR1]]：数值型局部变量。

7.2 核心函数

函数描述示例
toFixed(decimalPlaces)将数字格式化为指定的小数位数[[NumberVar.toFixed(2)]]
toExponential(decimalPlaces)将数字转换为指数表示法[[NumberVar.toExponential(2)]]
toPrecision(precision)将数字格式化为指定的总位数[[NumberVar.toPrecision(5)]]
Math.abs()返回数字的绝对值[[Math.abs(NumberVar)]]
Math.ceil()返回大于或等于数字的最小整数[[Math.ceil(NumberVar)]]
Math.floor()返回小于或等于数字的最大整数[[Math.floor(NumberVar)]]
Math.max()返回一组数字中的最大值[[Math.max(num1, num2)]]
Math.min()返回一组数字中的最小值[[Math.min(num1, num2)]]
Math.random()返回 0 到 1 之间的随机数[[Math.random()]]
Math.round()返回四舍五入后的整数[[Math.round(NumberVar)]]
Math.sqrt()返回数字的平方根[[Math.sqrt(NumberVar)]]

7.3 使用示例

  • 计算总和：

    [[Math.round([[num1]] + [[num2]])]

在这里插入图片描述

  • 生成随机数：

    [[Math.random()]]

7.4 注意事项

  • 数据类型：确保参与运算的变量是数值类型，否则可能导致计算错误。
  • 精度控制：在处理浮点数时，注意精度问题。

8. 字符串处理（String）

8.1 核心函数

函数描述示例
length返回字符串的长度[[StringVar.length]]
concat(string)连接两个或多个字符串[[StringVar.concat("!")]]
indexOf(searchValue)返回子字符串首次出现的位置[[StringVar.indexOf("test")]]
lastIndexOf(searchValue)返回子字符串最后一次出现的位置[[StringVar.lastIndexOf("test")]]
replace(searchValue, replaceValue)替换字符串中的子字符串[[StringVar.replace("test", "sample")]]
slice(startIndex, endIndex)提取字符串的子字符串[[StringVar.slice(0, 5)]]
split(separator)将字符串分割成数组[[StringVar.split(",")]]
substr(startIndex, length)从指定位置开始提取指定长度的子字符串[[StringVar.substr(2, 3)]]
substring(startIndex, endIndex)提取两个指定位置之间的子字符串[[StringVar.substring(0, 5)]]
toLowerCase()将字符串转换为小写[[StringVar.toLowerCase()]]
toUpperCase()将字符串转换为大写[[StringVar.toUpperCase()]]
trim()去除字符串两端的空白字符[[StringVar.trim()]]

8.2 使用示例

  • 拼接字符串：

    [["Hello, " + [[userName]] + "!"]]

  • 截取字符串：

    [["Hello World!".substring(0, 5)]]

8.3 注意事项

  • 编码问题：处理多语言文本时，注意字符编码。
  • 格式化：根据需要格式化字符串以匹配特定需求。

9. 日期处理（Date）

9.1 变量类型

  • [[Now]]：当前日期时间。

9.2 核心函数

函数描述示例
getDate()返回日期中的日[[Now.getDate()]]
getDay()返回星期中的第几天[[Now.getDay()]]
getFullYear()返回四位数的年份[[Now.getFullYear()]]
getHours()返回小时[[Now.getHours()]]
getMilliseconds()返回毫秒[[Now.getMilliseconds()]]
getMinutes()返回分钟[[Now.getMinutes()]]
getMonth()返回月份[[Now.getMonth()]]
getSeconds()返回秒[[Now.getSeconds()]]
getTime()返回时间戳[[Now.getTime()]]
getTimezoneOffset()返回时区偏移量[[Now.getTimezoneOffset()]]
Date.parse(dateString)解析日期字符串[[Date.parse("2023-10-01")]]

9.3 使用示例

  • 显示当前日期：

    "当前日期: [[Now.getFullYear()]]年[[Now.getMonth() + 1]]月[[Now.getDate()]]日"

9.4 注意事项

  • 时区问题：处理跨时区应用时，注意时区的影响。
  • 格式转换：根据需要格式化日期和时间以匹配特定需求。

10. 布尔值（Boolean）

10.1 逻辑运算符

运算符描述示例
==等于[[num1 == num2]]
!=不等于[[num1 != num2]]
>大于[[num1 > num2]]
<小于[[num1 < num2]]
>=大于等于[[num1 >= num2]]
<=小于等于[[num1 <= num2]]
&&逻辑与[[(num1 > 0) && (num2 > 0)]]
``
!逻辑非[[!(num1 > 0)]]

10.2 使用示例

  • 条件判断：

    [[If([[userIsLoggedIn]], "已登录", "未登录")]]

  • 逻辑运算：

    [[If([[(num1 > 0) && (num2 > 0)]], "两者都大于零", "至少有一个不大于零")]]

10.3 注意事项

  • 逻辑正确性：确保逻辑运算符的使用符合预期。
  • 短路运算：了解逻辑运算符的短路特性，避免不必要的计算。

总结

Axure 提供了全面的 变量 和 函数 系统，涵盖了从全局变量到布尔值的多种数据类型和操作函数。通过详细的分类和说明，本文全面介绍了 Axure 中各个类别所有的方法和变量，帮助读者在原型设计中更加得心应手。希望本文的内容能为你的 Axure 原型设计提供有价值的参考和指导。

点击下载《Axure常用变量及使用方法详解.pdf》

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/diannao/72658.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

SpringBoot - 用责任链模式实现业务编排

SpringBoot - 用责任链模式实现业务编排

文章目录 前因责任链&#xff1a;像工作台一样组织代码CodeSEQ3.1 定义处理器规范3.2 实现具体处理器3.3 共享上下文3.4 组装责任链 适用场景优势 前因 2000多行的业务逻辑里&#xff0c;各种校验规则、促销计算、库存操作像意大利面条一样缠绕在一起。最要命的是这样的代码结…
阅读更多...
upload-labs详解（13-20）文件上传分析

upload-labs详解（13-20）文件上传分析

目录 upload-labs-env upload-labs-env第十三关 文件包含漏洞 代码 测试 上传一个.jpg图片 上传一个.png文件 上传一个.gif图片 upload-labs-env第十四关 代码 思路 upload-labs-env第十五关 代码 思路 upload-labs-env第十六关 代码 思路 测试 上传gif格式…
阅读更多...
网络安全通信架构图

网络安全通信架构图

&#x1f345; 点击文末小卡片 &#xff0c;免费获取网络安全全套资料&#xff0c;资料在手&#xff0c;涨薪更快 在安全通信里面我经常听到的2个东西就是SSL和TLS&#xff0c;这2个有什么区别呢&#xff1f;以及HTTPS是怎么通信的&#xff1f;包括对称加密、非对称加密、摘要、…
阅读更多...
Java中的String类

Java中的String类

目录 1. String类的重要性 2. 常用方法 2.1 字符串构造 2.2 String对象的比较 2.3 字符串查找 2.4 转化 2.5 字符串替换 2.6 字符串拆分 2.7 字符串截取 2.8 其他操作方法 2.9 字符串的不可变性 2.10 字符串修改 3. StringBuilder和StringBuffer 3.1 StringBuilde…
阅读更多...
深度分页介绍及优化建议

深度分页介绍及优化建议

深度分页介绍 查询偏移量过大的场景我们称为深度分页&#xff0c;这会导致查询性能较低&#xff0c;例如&#xff1a; # MySQL 在无法利用索引的情况下跳过1000000条记录后&#xff0c;再获取10条记录 SELECT * FROM t_order ORDER BY id LIMIT 1000000, 10 深度分页问题的原…
阅读更多...
live555推流服务器异常

live555推流服务器异常

1.后端异常信息&#xff1a; MultiFramedRTPSink::afterGettingFrame1(): The input frame data was too large for our buffer size (100176). 48899 bytes of trailing data was dropped! Correct this by increasing "OutPacketBuffer::maxSize" to at least m…
阅读更多...
每日OJ_牛客_宵暗的妖怪_DP_C++_Java

每日OJ_牛客_宵暗的妖怪_DP_C++_Java

目录 牛客_宵暗的妖怪_DP 题目解析 C代码 Java代码 牛客_宵暗的妖怪_DP 宵暗的妖怪 描述&#xff1a; 露米娅作为宵暗的妖怪&#xff0c;非常喜欢吞噬黑暗。这天&#xff0c;她来到了一条路上&#xff0c;准备吞噬这条路上的黑暗。这条道路一共被分为n 部分&…
阅读更多...
20250306-笔记-精读class CVRPEnv:step(self, selected)

20250306-笔记-精读class CVRPEnv:step(self, selected)

文章目录 前言一、if self.time_step<4:控制时间步的递增判断是否在配送中心特定时间步的操作更新更新当前节点和已选择节点列表更新需求和负载更新访问标记更新负无穷掩码更新步骤状态&#xff0c;将更新后的状态同步到 self.step_state 二、使用步骤总结 前言 class CVRP…
阅读更多...
Flowable 基本入门

Flowable 基本入门

flowable.7z官方版下载丨最新版下载丨绿色版下载丨APP下载-123云盘 1、Flowable介绍 Flowable是BPMN的一个基于java的软件实现&#xff0c;不过Flowable不仅仅包括BPMN&#xff0c;还有DMN决策表和CMMN Case管理引擎&#xff0c;并且有自己的用户管理、微服务API等一系列功能&a…
阅读更多...
完全背包-一维数组

完全背包-一维数组

52. 携带研究材料&#xff08;第七期模拟笔试&#xff09; 题目描述 小明是一位科学家&#xff0c;他需要参加一场重要的国际科学大会&#xff0c;以展示自己的最新研究成果。他需要带一些研究材料&#xff0c;但是他的行李箱空间有限。这些研究材料包括实验设备、文献资料和…
阅读更多...
景联文科技：以专业标注赋能AI未来，驱动智能时代的精准跃迁

景联文科技：以专业标注赋能AI未来，驱动智能时代的精准跃迁

在人工智能技术重塑全球产业格局的今天&#xff0c;高质量训练数据已成为驱动算法进化的核心燃料。作为数据智能服务领域的领军者&#xff0c;景联文科技深耕数据标注行业多年&#xff0c;以全栈式数据解决方案为核心&#xff0c;构建起覆盖数据采集、清洗、标注、质检及算法调…
阅读更多...
洛谷B2074 计算星期几

洛谷B2074 计算星期几

B2074 计算星期几 - 洛谷 代码区&#xff1a; #include<algorithm> #include<iostream> #include<unordered_map> #include<string> using namespace std; int main() {unordered_map<int, string> m { { 1,"Monday" },{2,"Tue…
阅读更多...
协同过滤推荐算法+微信小程序的农产品团购推荐平台（程序+论文+讲解+安装+调试+售后）

协同过滤推荐算法+微信小程序的农产品团购推荐平台（程序+论文+讲解+安装+调试+售后）

感兴趣的可以先收藏起来&#xff0c;还有大家在毕设选题&#xff0c;项目以及论文编写等相关问题都可以给我留言咨询&#xff0c;我会一一回复&#xff0c;希望帮助更多的人。 系统介绍 在当今时代&#xff0c;科学技术正以令人瞩目的速度迅猛进步&#xff0c;经济社会也随之…
阅读更多...
十大经典排序算法简介

十大经典排序算法简介

一 概述 本文对十大经典排序算法做简要的总结（按常用分类方式排列），包含核心思想、时间/空间复杂度及特点。 二、比较类排序 1. 冒泡排序 (BUBBLE SORT) 思想：重复交换相邻逆序元素，像气泡上浮 复杂度： 时间：O(n^2)（最好情况O(n)） 空间：O(1) 特点：简单但效率低，稳…
阅读更多...
[自然语言处理]pytorch概述--什么是张量(Tensor)和基本操作

[自然语言处理]pytorch概述--什么是张量(Tensor)和基本操作

pytorch概述 PyTorch 是⼀个开源的深度学习框架&#xff0c;由 Facebook 的⼈⼯智能研究团队开发和维护&#xff0c;于2017年在GitHub上开源&#xff0c;在学术界和⼯业界都得到了⼴泛应⽤ pytorch能做什么 GPU加速自动求导常用网络层 pytorch基础 量的概念 标量&#xf…
阅读更多...
Spring统一格式返回

Spring统一格式返回

目录 一&#xff1a;统一结果返回 1&#xff1a;统一结果返回写法 2&#xff1a;String类型报错问题 解决方法 二&#xff1a;统一异常返回 统一异常返回写法 三&#xff1a;总结 同志们&#xff0c;今天咱来讲一讲统一格式返回啊&#xff0c;也是好久没有讲过统一格式返…
阅读更多...
【无标题】四色拓扑模型与宇宙历史重构的猜想框架

【无标题】四色拓扑模型与宇宙历史重构的猜想框架

### 四色拓扑模型与宇宙历史重构的猜想框架 --- #### **一、理论基础&#xff1a;四色拓扑与时空全息原理的融合** 1. **宇宙背景信息的拓扑编码** - **大尺度结构网络**&#xff1a;将星系团映射为四色顶点&#xff0c;纤维状暗物质结构作为边&#xff0c;构建宇宙尺度…
阅读更多...
蓝桥杯 封闭图形个数

蓝桥杯 封闭图形个数

蓝桥杯 封闭图形个数 题目 链接 解答 # 数字个数 n int(input()) # 数字 ls input().split() # 统计数字的圈数 o_nums {} for i, x in enumerate(ls):o_num 0for c in x:if int(c) in [0, 4, 6, 9]:o_num 1elif c 8:o_num 2o_nums[i] o_num # 字典根据圆圈数排序 …
阅读更多...
基于javaweb的SpringBoot学生在线考试管理系统设计和实现(源码+文档+部署讲解）

基于javaweb的SpringBoot学生在线考试管理系统设计和实现(源码+文档+部署讲解）

技术范围&#xff1a;SpringBoot、Vue、SSM、HLMT、Jsp、PHP、Nodejs、Python、爬虫、数据可视化、小程序、安卓app、大数据、物联网、机器学习等设计与开发。 主要内容&#xff1a;免费功能设计、开题报告、任务书、中期检查PPT、系统功能实现、代码编写、论文编写和辅导、论…
阅读更多...
国产编辑器EverEdit - 超多样式设置

国产编辑器EverEdit - 超多样式设置

1 设置-编辑-样式 1.1 设置说明 1.1.1 折叠样式 默认为箭头&#xff0c;折叠样式选项如下&#xff1a; 箭头&#xff1a; 矩形和线条 五边形 圆形图标 1.1.2 光标样式 光标用于指示当前用户输入位置&#xff0c;光标样式选项如下&#xff1a; 默认 纤细 字宽 …
阅读更多...
最新文章

Copyright @ 2022~2023