1.4_5 Axure RP 9 for mac 高保真原型图 - 案例4 【旋转的唱片2】计时器

本文链接：https://blog.csdn.net/qq_43529621/article/details/126506362

一、成品效果

版本更新

一、播放
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 【旋转的唱片】

三、制作方法

主要使用到了1.变量、2.交互->载入时、3.交互->情形（或者叫case）、4.逻辑计算

需要明确的是，当一个元件交互功能中，使用了情形时，最多执行其中一种情形。程序执行与情形的顺序有关。

例如：下图中的元件s2，使用了【交互-载入时】，【情形-正在暂停、播放结束、s2+1、s2进位】，每种情形中又包含各自的动作。

举例：
如果【情形-正在暂停】、【情形-播放结束】不满足条件、【情形-s2+1】满足条件：那么会执行【情形-s2+1】中的动作。
如果同时满足【情形-正在暂停】、【情形-播放结束】：那么只会执行【情形-正在暂停】中的动作，因为程序是按照顺序判断的。
如果全都不满足：那么不会执行任何动作。

四、操作步骤（简略介绍）

4.1 拆分开始时间

原案例2 【旋转的唱片】中的开始和结束时间，分别使用了两个矩形，内容为00:00和04:29，如果想实现计时功能。则需要将开始时间拆分为5个矩形块。

设五个矩形块分别为ab:cd。并定义四个矩形块的名称分别为m1、m2、s1、s2，方便一会区分。
m1：表示分钟的第一个数字，即ab:cd中的a，默认值为-1。
m2：表示分钟的第二个数字，即ab:cd中的b，默认值为-1。
s1：表示秒钟的第一个数字，即ab:cd中的c，默认值为-1。
s2：表示秒钟的第二个数字，即ab:cd中的d，默认值为0。