1.4_7 Axure RP 9 for mac 高保真原型图 - 案例6 【旋转的唱片4】进度条_拖拽、点击
相关链接
- 目录
- Axure中文学习网
- AxureShop
- AxureShop-QA
1. 熟悉 动态面板 的 拖拽、点击动作的使用场景
2. 掌握 动态面板 中配置 拖拽 功能实现原理（只有动态面板才支持拖拽功能）
3. 掌握 变量 获取鼠标横坐标公式 Cursor.x
4. 掌握 动态面板 中配置 边界的方式
一、成品效果
Axure Cloud 案例6 -【旋转的唱片4】进度条_拖拽、点击
一、进度条
1.1 通过拖拽方式，可以改变进度条位置。
1.2 通过点击方式，可以改变进度条位置。
历史版本：Axure Cloud 案例5 -【旋转的唱片3】进度条_滚动
一、进度条
1.1 进度条按时间比例向右滚动。
历史版本：Axure Cloud 案例4 -【旋转的唱片2】计时器
一、播放
2.1 点击播放按钮，计时器开始计时。
2.2 点击暂停按钮，计时器暂停计时。
2.3 每次点击播放按钮，继续时间，并等于上次暂停的时间。
二、计时器
1.1 播放状态：计时器每秒钟变化一次。
1.2 播放状态：秒数个位范围[0-9]，到10自动进一位，并归0。
1.3 播放状态：秒数十位范围[0-6]，到6自动进一位，并归0。
1.4 播放状态：分钟个位范围[0-9]，到10自动进一位，并归0。
1.5 播放状态：分钟十位范围[0-6]，到6自动进一位，并归0。
1.6 播放状态：总时间 = 结束时间时，自动暂停。
1.7 暂停状态：计时器停止变化。
历史版本：Axure Cloud 案例2 -【旋转的唱片】
一、播放
1.1 点击播放按钮，唱片开始旋转。
1.2 点击播放按钮，播放按钮变为暂停按钮。
1.3 点击暂停按钮，唱片停止旋转。
1.4 点击暂停按钮，暂停按钮变为播放按钮。
二、收藏
2.1 未收藏状态：点击收藏按钮，出现收藏动效
2.2 未收藏状态：点击收藏按钮，切换为已收藏状态
2.3 已收藏状态：点击收藏按钮，出现弹窗，提示取消收藏
2.4 已收藏状态：点击收藏按钮，切换为未收藏状态
二、素材准备
需要先依次完成：
案例2 【旋转的唱片】、
案例4 【旋转的唱片2】计时器、
案例5 【旋转的唱片3】进度条_滚动
三、制作方法
主要通过给动态面板 - 进度条增加交互功能：点击、拖拽。通过获取当前鼠标的x轴坐标【Cursor.x】来设置进度条位置。
另外，需要把进度条的两条线移出动态面板，因为互动一般只能对圆点生效，不对进度线生效。
其中：6是进度条圆的半径，45是进度条x轴位置坐标
22/08/29
M
1.4_7 Axure RP 9 for mac 高保真原型图 - 案例6 【旋转的唱片4】进度条_拖拽、点击相关推荐
- 1.4_8 Axure RP 9 for mac 高保真原型图 - 案例7 【旋转的唱片5】进度条计时器 关联
相关链接 目录 Axure中文学习网 AxureShop AxureShop-QA 案例目标 1. 了解 进度条绑定时间 的实现原理 2. 掌握 变量 的高级使用技巧 一.成品效果 Axure C ...
- 1.4_6 Axure RP 9 for mac 高保真原型图 - 案例5 【旋转的唱片3】进度条_滚动
相关链接 目录 Axure中文学习网 AxureShop AxureShop-QA 案例目标 1. 了解 进度条 的实现原理 2. 熟悉 设置尺寸 动作的使用场景 3. 掌握 变量值 实现复杂的 ...
- 1.4_5 Axure RP 9 for mac 高保真原型图 - 案例4 【旋转的唱片2】计时器
相关链接 目录 Axure中文学习网 AxureShop AxureShop-QA 案例目标 1. 了解 计时功能 的实现原理 2. 熟悉 交互 功能中,情形(case) 的使用场景 3. 掌握 ...
- 1.4_10 Axure RP 9 for mac 高保真原型图 - 案例9 【按钮】单选按钮组
相关链接 目录 Axure中文学习网 AxureShop AxureShop-QA 案例目标 1. 了解 单选 功能的实现原理 2. 掌握 按钮 的常见使用方式 3. 掌握 指定单选按钮的组 功 ...
- 1.4_17 Axure RP 9 for mac 高保真原型图 - 案例16 【动态面板-滚动条6】手动制作滚动条
相关链接 目录 Axure中文学习网 AxureShop AxureShop-QA 案例目标 1. 了解 手动制作滚动条 的原理 2. 掌握 鼠标悬停 在本案例中的用法 一.成品效果 Axure ...
- 1.4_18 Axure RP 9 for mac 高保真原型图 - 案例17 【js-echarts官网】
相关链接 目录 Axure中文学习网 AxureShop AxureShop-QA 最开始只是想尝试一下,在Axure RP9中引用echarts图片.访问了一下echarts官网 ,后来对官网的 ...
- 1.4_16 Axure RP 9 for mac 高保真原型图 - 案例15 【动态面板-滚动条5】深色模式 - 按钮效果升级
相关链接 目录 Axure中文学习网 AxureShop AxureShop-QA 案例目标 1. 了解 元件库,会使用元件库中的成品进行改造 2. 掌握 在 概要 模块的使用技巧 一.成品效果 ...
- 1.4_15 Axure RP 9 for mac 高保真原型图 - 案例14 【动态面板-滚动条4】深色模式 - 图层处理
相关链接 目录 Axure中文学习网 AxureShop AxureShop-QA 案例目标 1. 了解 深色模式 的实现原理 2. 掌握 在 概要 模块中,显示/隐藏 对象 3. 掌握 置于顶 ...
- 1.4_9 Axure RP 9 for mac 高保真原型图 - 案例8 【动态面板】浏览、翻页、回弹
相关链接 目录 Axure中文学习网 AxureShop AxureShop-QA 案例目标 1. 了解 手机端app 浏览的实现原理 2. 掌握 回弹效果 的交互配置方式 3. 掌握 动态面板 ...
最新文章
- linux做预警机制,预警通告：Linux内核中TCP SACK机制远程DoS
- python打包安卓的方法_30个你想打包带走的Python技巧（下）
- 外部中断实验 编写程序学习外部中断的电平触发方式。无中断时发光让发光二极管从左到右依次点亮，有外部中断请求时，4位数码管从0000开始加1显示(加到9999后复位为0000)，同时蜂鸣器报警。
- 【Python】Sklearn创建三种仿真数据集
- 【Oracle】并行等待之PX Deq Credit: need buffer
- 用js代码判断质数_在 JS 中判断，并不是都要用 ===
- 生产环境mysql主主同步主键冲突处理
- PIL Error, TypeError: Cannot handle this data type:(1, 1), ＜i8
- iBarcoder如何在给定位置打印顺序标签？
- 手机操作系统学习总结
- Hackintool 3.4.7中文版 (黑苹果必备工具箱神器)
- java抖音字符视频_代码生成抖音文字视频
- 金代文化是中华民族文化的重要组成部分
- oracle停止 sparc,我现在可以清楚地看到云已经消失了:Oracle 12c on-premises for Linux,SPARC...
- Android安全相关
- 解决Illegal unquoted character ((CTRL-CHAR, code 13)): has to be escaped using backslash to be include
- 计算机应用基础上册周测7,计算机应用基础(第3版)周南岳(win7+office10)期末复习及答案-20210614221003.docx-原创力文档...
- 2---理解正余弦、复数求模、反正切和乘除运算的CORDIC算法实现
- 需求分析+辽阳市水库大坝安全检测平台+志豪未来科技有限公司+陈志豪
- tkinter窗口布局pack方法详解