-1

一个人如何启动两个显示相同初始时间的动画模拟时钟，然后让一个比另一个快两倍，使一秒变成半秒，等等，以便它超越“实时”时钟？诀窍是他们都需要开始显示当前时间。

我知道这可能很简单，但是每次我向时钟 2 的变量添加一个乘数时，它都会在不正确的时间开始并跳过滴答声。

这是我用作起点的 ActionScript（两个时钟相同）：

var now:Date;
var ct:Timer = new Timer(1);
ct.addEventListener(TimerEvent.TIMER, onTick);
ct.start();

function onTick(event:TimerEvent):void {
now = new Date();
var s:uint = now.getSeconds();
var m:uint = now.getMinutes();
var h:uint = now.getHours();
/*CLOCK ONE*/
one_second_hand_mc.rotation = 180 + (s * 6);
one_minute_hand_mc.rotation = 180 + (m * 6);
one_hour_hand_mc.rotation = 180 + (h * 30) + (m / 2);
/*CLOCK TWO*/
two_second_hand_mc.rotation = 180 + (s * 6);
two_minute_hand_mc.rotation = 180 + (m * 6);
two_hour_hand_mc.rotation = 180 + (h * 30) + (m / 2);
}
4

2 回答 2

1

  1. 将计时器延迟设置为小于 20 毫秒是一种不好的做法：http: //help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/flash/utils/Timer.html#delay

  2. 尝试这样的事情（为简单起见，我只显示几秒钟）：

现在变：日期；
var ct:Timer = new Timer(500);
ct.addEventListener(TimerEvent.TIMER, onTick);

现在 = 新日期（）；
var s:uint = 180 + 6 * now.getSeconds();
/ CLOCK ONE /
one_second_hand_mc.rotation = s;
/时钟二/
two_second_hand_mc.rotation = s;

ct.start();

var secondStep:Number = 6; // 360 / 60 (钟面上的分度)
var minutStep:Number = 0.1; // 6 / 60（以分钟为单位的秒数）
var hourStep:Number = 1/ 600; // 6 / 3600（以小时为单位的秒数）

函数onTick（事件：TimerEvent）：无效{

/ CLOCK ONE /
if (!(ct.currentCount % 2)){
one_second_hand_mc.rotation += secondStep;
one_minute_hand_mc.rotation += minuteStep;
one_hour_hand_mc.rotation += hourStep;
}

/时钟二/
two_second_hand_mc.rotation += secondStep;
two_minute_hand_mc.rotation += minuteStep;
two_hour_hand_mc.rotation += hourStep;
}

于 2012-10-04T21:32:09.413 回答
1

这是另一种方法。这个想法是将当前开始时间存储一次。然后，每次您想更新时钟 (onTick) 时，您检查自开始时间以来已经过去了多少时间，并创建一个新的日期对象，该对象表示开始时间 + 所经过的时间，用一个因子缩放。如果因子大于 1，则时钟比实时移动得更快，如果它更低，则移动得更慢。

如果你经常运行 onTick，你会得到一个流畅的动画，但你可以每秒运行一次或任何你想要的间隔。

// store current start time in milliseconds
var startTime : Number = new Date().getTime();

// the delay in the Timer doesn't affect the time
// displayed by the clocks, but only determines
// how often the clocks should be updated (redrawn)
var ct:Timer = new Timer(50);
ct.addEventListener(TimerEvent.TIMER, onTick);
ct.start();


function onTick(event:TimerEvent):void {
    // first clock should run at normal speed so we send in 1 as scale factor
    var timeDataOne : Object = calculateTime(1);
    // second clock at double speed (send in 0.5 to run at half speed)
    var timeDataTwo : Object = calculateTime(2);

    one_second_hand_mc.rotation = 180 + (timeDataOne.s * 6);
    one_minute_hand_mc.rotation = 180 + (timeDataOne.m * 6);
    one_hour_hand_mc.rotation = 180 + (timeDataOne.h/12) * 360;

    two_second_hand_mc.rotation = 180 + (timeDataTwo.s * 6);
    two_minute_hand_mc.rotation = 180 + (timeDataTwo.m * 6);
    two_hour_hand_mc.rotation = 180 + (timeDataTwo.h/12) * 360;
}


function calculateTime(clockSpeed : Number = 1):Object {
    // current time in milliseconds
    var nowTime : Number = new Date().getTime();

    // how many milliseconds have passed from the start time
    var timePassed : Number = nowTime - startTime;

    // create a new date object which should hold the time to display
    var displayTime : Date = new Date();

    // here we set the date object, which is based on the start time
    // plus the time passed multiplied with a scale factor clockSpeed.
    // When clockSpeed is one, displayTime will match the current time.
    displayTime.setTime(startTime + timePassed * clockSpeed);

    // calculate seconds, minutes and hours (and since the clock is analog
    // we use Number so we don't get discreet steps for the clock hands)
    var s : Number = displayTime.getSeconds() + (displayTime.getMilliseconds()/1000);
    var m : Number = displayTime.getMinutes() + s / 60;
    var h : Number = (displayTime.getHours() % 12) + m / 60;

    return { s: s, m: m, h: h };
}
于 2012-10-04T23:12:55.253 回答