相关链接
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
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
