« ActionScript 3.0 で時計を作る2 | トップページ | 制作実績「鶴一屋」さん »

2008.10.19

ActionScript 3.0 で時計を作る3

ActionScript 3.0で始めるオブジェクト指向スクリプティング

前々回から紹介している「連載:ActionScript 3.0で始めるオブジェクト指向スクリプティング|gihyo.jp … 技術評論社」というページを読み進めて、時計を完成させてみます。

…とは言っても、表示要素としてはほとんど完成しています。今回は、Stringクラスにより文字列を操作し、日付の表示方法を修正。そして、その処理を関数として定義するというコトをやってみます。

まず、日付のフォーマットを「YY/MM/DD」のように各2桁になるように文字列を操作します。
文字列の文字数はString.lengthプロパティで調べ、文字列から文字の一部を取出すには、String.substring()メソッドが使えます。これで、年の表示は下2桁を取り出すコトが出来ます。

次は月日のフォーマットです。1桁の場合は、先頭に0を付けて2桁にしたいのですが、条件判定をするのは少し面倒です。
サンプルでは、それぞれに100を加えて下2桁を取り出すという方法をとっています。これは簡単で使いやすいです。

これで年月日、それぞれを2桁で表示できるようになります。
ただ、今回はもう一歩踏み込んで、2桁より大きな数値は下2桁を取出し、2桁以下の数値は2桁の文字列に変換する関数を定義してみます。

ここまでをまとめたのが、下記のスクリプトです。MC:clock_mcの1フレーム目を下記のスクリプトに書き換えてみてください。

---------------------
// 時刻を調べる関数を定義
function xSetTime(eventObject:Event):void {
    // Dateインスタンスから時刻と日付のプロパティ値を取得
    var my_date:Date = new Date();
    var nHours:Number = my_date.hours;
    var nMinutes:Number = my_date.minutes;
    var nSeconds:Number = my_date.seconds;
    var nYear:Number = my_date.fullYear;
    var nMonth:Number = my_date.month+1;
    var nDate:Number = my_date.date;
    var nDay:Number = my_date.day;
   
    // 時計の針のアニメーション
    second_mc.rotation = nSeconds*6;
    minute_mc.rotation = nMinutes*6;
    hour_mc.rotation = nHours*30 + nMinutes/2;
   
    // 曜日の変換
    var day_str:String
   
    if(nDay == 1){
        day_str = "mon";
    }else if(nDay == 2){
        day_str = "tue";
    }else if(nDay == 3){
        day_str = "wed";
    }else if(nDay == 4){
        day_str = "thu";
    }else if(nDay == 5){
        day_str = "fri";
    }else if(nDay == 6){
        day_str = "sat";
    }else{
        day_str = "sun";
    }
   
    // 日付のフォーマットを設定
    var year_str:String = xSetDigits(nYear);
    var month_str:String = xSetDigits(nMonth);
    var date_str:String = xSetDigits(nDate);
   
    // 日付と曜日をTextFieldインスタンスに設定
    my_txt.text = year_str+"."+month_str+"."+date_str;
    my_txt2.text = day_str;
   
    // 数値を2桁の文字列に変換する関数定義
    function xSetDigits(n:int):String {
        var temp_str:String = String(n+100);
        var n_str:String = temp_str.substring(temp_str.length-2);
        return n_str;
    }
}

// イベントリスナーでxSetTime関数を呼び出す
addEventListener(Event.ENTER_FRAME, xSetTime);
---------------------

↑このFlashデータはこちらからダウンロードできます。

|

« ActionScript 3.0 で時計を作る2 | トップページ | 制作実績「鶴一屋」さん »

コメント

この記事へのコメントは終了しました。

トラックバック


この記事へのトラックバック一覧です: ActionScript 3.0 で時計を作る3:

« ActionScript 3.0 で時計を作る2 | トップページ | 制作実績「鶴一屋」さん »