编者按:通过Axure可以实现动态时钟旋转，但是如何快速简单地实现这个功能呢？本文作者通过实际操作为我们进行了论证和总结。

看到几个关于时钟动力学的原型设计，感觉很麻烦。我用了很多秒分针和时针之间的来回加减来计算旋转角度；本文将讲解不同的制作方法，简单易懂(工具:axure9)。

我觉得不涉及功能做原型很快(当然涉及到复读机还是有点深的，而且我玩了很久，差不多能实现一些复杂的交互，后面还有时间写)，知道原理就不会太复杂了。本文使用动态面板和简单的获取日期功能(右下角的时钟)。

该功能用于:

获取当前系统的小时：[[Now.getUTCHours()]];（这个函数用的时候发现总是比系统时间多4个小时，不知道是什么原因，需要减去才行，你们可以尝试一下获取当前系统的分钟：[[Now.getUTCMinutes()]]获取当前系统的秒数：[[Now.getUTCSecond()]]

一.基本要素

圆形*2（其实一个就够了，两个为了好看一点点）动态面板*3（3个状态命名为：秒针、分针、时针）线段*3（分别代表时针、分针、秒针）齿轮*1（可有可无）

第二，观念

获取当前系统的时间，使用动态面板进行来回交互，可以实时刷新获取的时间，然后指针可以连续旋转。注意:每个动态面板中的组件必须重合，否则指针会错位。

第三，详细添加交互

将时针、分针、秒针分别放入三个动态面板，然后先加入秒针的动作。加载时-设置动态面板(下一项，循环，1000毫秒)，设置时:状态改变-旋转(线段-[[现在。getutsecend()* 6]]-锚点:中间位置)，为什么要乘以6？

分针:和秒针一样，功能改为[[now . getutchminutes()* 6]]。分针为什么要乘以6？和秒针一样，分针代表6度，获取当前系统的时间分*6就是旋转角度。

时针:[[((((现在。getutchours ()-4) * 30)+((现在。getutchminutes()/60)* 5))。tofixed (0)]

这里减去，时针30度，加上点的值:(当前点除以60)乘以5；以下函数:。toFixed(0)，因为积分加的值可能是小时，所以这里需要四舍五入。

这是结尾，预览一下看看有没有实现；可以添加一些细节，比如表盘，颜色区分，美化。中间是我自己加的小齿轮，感觉有点机械。