携帯Flashの作製方法 アナログ時計を作ろう

今回はアナログ時計(長針、短針、秒針)の携帯Flashを作ってみましょう。デジタルもイイけど、やっぱりアナログDA・YO・NE!とかいう人もいるかもしれませんので。こんな感じの携帯Flashね。

とりあえずはテキトーに、長針、短針、秒針のグラフィックオブジェクトを作成します。まずは長針mcというムービークリップを作りさきほどのグラフィック「長針」を配置します。そしてインスタンス名に「minute」とつけます。短針用も同じように、ムービークリップにグラフィックを配置して「hour」(インスタンス名)とつけます。秒針用も同じ感じで配置し、「second」(インスタンス名)とつけて下さい。

06-1

そうしたら、長針、短針、秒針のムービークリップをシーン1のステージ上に配置します。それぞれのムービークリップは、ActionScriptで回転させることになるのですが、その回転の基準となるのがオブジェクトの中心点ですので、中心点を任意の位置に移動させます。

06-1

あとは今までの時計と同じように、シーン1に1フレーム目にActionScriptを書きます。

/* ----時間の取得---- */
hr = fscommand2("GetTimeHours");
/* ----分の取得---- */
min = fscommand2("GetTimeMinutes");
/* ----秒の取得---- */
sec = fscommand2("GetTimeSeconds"); 

/* ----アナログ時計を動かすScript---- */
hour._rotation = hr*30+min*0.5;
minute._rotation = min*6;
second._rotation = sec*6;

/* ----桁を追加---- */
if (hr<=9 and hr>=0) {
	hr = 0 add hr;
}
if (min<=9 and min>=0) {
	min = 0 add min;
}
if (sec<=9 and sec>=0) {
	sec = 0 add sec;
} 

今回は取得した時間、分数、秒数をそれぞれの変数に代入し、その数値を利用して「_rotation」でオブジェクトを回転させています。

時計の針は360度の盤面を回転しますので、360を60(秒)で割ると1秒は6度になります。つまり取得した秒数に6度を掛ければ、現在の秒針の回転度数となります。分数も同じように360を60(分)で割った角度で掛けます。時間は、単純に360を12(時間)で割った数値を掛けても、1時間にごとに針が移動するだけになってしまいます。ですので、360を12で割った1時間ごとの角度にプラスして、現在の分数分も動かすようにします。1時間は60分ですので、60x12=720が12時間の分数になります。あとは360度を720で割ると0.5度になり、、短針が1分で回転する距離がでます。そしたら、1時間で回転する角度に1分で回転する角度を足したものが現在の短針の角度となります。

これでアナログ時計の携帯Flash作成は終了です。

サンプルのFlashは、下の映り込みの時計の針を逆回転で表現しています。それぞれに掛ける数値をマイナスにしてあげれば出来ちゃいますです。

今回は時計のデザインもflaファイルに収められているんで、色を変えてみたり大きさを変えてみたりと、テキトーにRemixして遊んでみてください…。自分好みの携帯Flashにしちゃってくださいな。

今回作製したflaファイル