ささきち流 Suzuka & ParaDraw 講座
Suzuka & ParaDraw
TOP
PROFILE
ActionScript Editor
LINK
BBS


フリーのFlash作成ソフト SuzukaParaDraw でFlashな生活を楽しもうというサイトです。
アナログ時計 サンプル&作成方法解説



サンプルダウンロード
PDRファイル・CSFファイル在中
「analog.zip」 5.00 KB (5,121 バイト)



アナログ時計 作成方法解説

ParaDraw Ver.0.3a4 で作成した絵を,Suzuka Ver.0.6.5 で動作させています。
Flash と言えばアナログ時計が定番かなと思ったので,作ってみました。絵は「アクアなボタン」の発展編という感じです。

とりあえずは文字盤や針などの絵を,ParaDraw で作成しておき,針をスプライトの中に入れて,ActionScript で針を動かします。

回転の中心や座標の基準となる点は「基準点」とよばれていて,シンボルリストのスプライトを選択し,「右クリック」→「プロパティ」より調節することが可能です。
Suzuka の操作上は,この基準点の座標を決める部分が一番難しいかもしれません。

スプライトインスタンスの階層構造は次のようになっています。

 _root
   ├ byou(秒針)
   ├ tyou(長針(分針))
   └ tan(短針(時針))

以上のような,図画工作的な山を乗りこえればやっとスクリプト記述にたどり付けます。
_root のタイムラインの フレーム1 には,次のように書いています。

// 1フレーム進む時間ごとに毎回実行
this.onEnterFrame=function(){
	// 現在の時刻オブジェクト now を作成
	now = new Date();
	// 変数 h に時刻を取得
	h = now.getHours();
	// 変数 m に分を取得
	m = now.getMinutes();
	// 変数 s に秒を取得
	s = now.getSeconds();
	// 秒針 byou を1秒で6度回転
	byou._rotation = (s*6);
	// 長針 tyou (1分で6度回転)+(1秒で0.1度回転)
	tyou._rotation = (m*6)+(s/10); 
	// 短針 tan を(1時間で30度回転)+(1分で0.5度回転)
	tan._rotation = (h*30)+(m/2); 
};
// 即onEnterFrameを実行
this.onEnterFrame();

図画工作の時間の後は,算数の時間という感じです。
算数と言ってもかなり頭を使う算数ですが,なぜそういう式になるのかは,じっくりと考えればわかると思います(おそらく)。

 

---2007年7月1日-----
初回アップ 

---2007年12月15日---
スクリプトを一部修正