-1

同じ初期時刻を表示する2つのアニメーション化されたアナログ時計を開始し、一方をもう一方の2倍の速さにして、1秒が0.5秒になるなど、「リアルタイム」時計を追い越すにはどうすればよいでしょうか。秘訣は、両方が現在の時刻の表示を開始する必要があるということです。

これは簡単かもしれませんが、クロック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 now：Date;
var ct：Timer = new Timer（500）;
ct.addEventListener（TimerEvent.TIMER、onTick）;

now = new Date（）;
var s：uint = 180 + 6 * now.getSeconds（）;
/ CLOCK ONE /
one_second_hand_mc.rotation = s;
/ CLOCK TWO /
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（event：TimerEvent）：void {

/ CLOCK ONE /
if（！（ct.currentCount％2））{
one_second_hand_mc.rotation + = secondStep;
one_minute_hand_mc.rotation + = minutesStep;
one_hour_hand_mc.rotation + = hourStep;
}

/ CLOCK TWO /
two_second_hand_mc.rotation + = secondStep;
two_minute_hand_mc.rotation + = minutesStep;
two_hour_hand_mc.rotation + = hourStep;
}

于 2012-10-04T21:32:09.413 に答える
1

別のアプローチがあります。アイデアは、現在の開始時刻を1回保存することです。次に、時計（onTick）を更新するたびに、開始時刻から経過した時間を確認し、開始時刻+係数でスケーリングされた経過時間を表す新しい日付オブジェクトを作成します。係数が1より大きい場合、時計はリアルタイムより速く移動し、小さい場合は遅く移動します。

onTickを頻繁に実行すると、スムーズなアニメーションが得られますが、1秒に1回、または任意の間隔で実行できます。

// 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 に答える