「時計の学習ソフト」の作り方


1 部品を作る

(1)時計盤

   挿入−新規シンボルの作成  タイプ:グラフィック 名前:Tokeiban
   楕円ツールで160×160 同心円で 190×190
レイヤーを増やし、12時の位置に点を描く
点全体を選択して、修正−シンボルに変換 タイプ:グラフィック 名前:点
自由変形ツールで、中心点を、真ん中に置く
変形パネルで、「コピーして変形を適用」し、6度回転させる
これを繰り返す  
レイヤーを増やし、テキストツールで数字を入れる
新規シンボルの作成
名前を記述
楕円ツールで円を描く
バケツツールで時計盤の色塗り
12時の位置に点を描きシンボルに変換
自由変形ツールで中心点を時計の中心に
変形パネルで、複製・回転
6度の位置に複製された
全てが描かれた様子
数字を配置した様子

(2)長針

   挿入−新規シンボルの作成  タイプ:ムービークリップ 名前:長針
   矩形ツールで、W:5  H:80  の 長方形を描く   中心は 下の方の(回転軸)にする
新規シンボルで長針のムービークリップ
このように描く

(3)短針

   挿入−新規シンボルの作成  タイプ:ムービークリップ 名前:短針
   矩形ツールで、W:8 H:50 の長方形を描く  長針と同様、中心点を回転軸にする位置に持っていく
短針のシンボル作成

2 部品を組み立てる

(1)時計

   挿入−新規シンボルの作成  タイプ:ムービークリップ  名前:時計
   ステージの真ん中に、ライブラリから時計盤を配置する  
レイヤーを増やし、長針と短針をそれぞれ配置する
短針と長針ともに、自由変形ツールで、中心点を回転軸に合わせる :←要注意
短針のプロパティ インスタンス名を、tansin と付ける
長針のプロパティ インスタンス名を、tyousin と付ける
時計という名前で新規シンボルを作成
ライブラリから部品を選択・配置
針の中心点を自由変形ツールで移動

レイヤーを増やし、スクリプトを書く

   レイヤーを増やし、そのアクションーフレームに 以下を記述する












 

MoveHari();
function MoveHari() {
if (theHours>=12) {
theHours = theHours-12;
}
AddHours = theMinutes/2;
funkaku = 6*theMinutes;
jikaku = 30*theHours+AddHours;
setProperty("tyousin", _rotation, funkaku);
setProperty("tansin", _rotation, jikaku);
}

 



theHours :時間を表す変数
 常に0〜11にする

funkaku:短針の角度を表す変数
変数theMinutesに6度を掛ける
jikaku:時針の角度を表す変数
変数theHoursに30度を掛けて変数theMinutesの半分を足す
それぞれ回転させる
 
   すべてのレイヤーに2フレーム目を挿入する
   アクションを記述したフレームには、キーフレームを挿入する
   そのフレームに以下のアクションを記述する



 

this._parent.Idou();
gotoAndPlay(1);

 

一つ手前の関数Idou()を実行し、フレーム1に戻る
 

(2)メインのステージに時計を配置

   シーン1にもどり、ライブラリから「時計」をステージに配置する
時計のプロパティ で インスタンス名を Tokei と名付ける
時計のアクション−ムービークリップに以下を記述する




 

onClipEvent (load) {
this.stop();
}

 

止めたままにする


 

(3)フレーム−アクションを記述する

    フレームアクションを記述するレイヤーを 増やし、そこに以下を記述する












 

theTime=0;
Keisan();
function Idou() {
++theTime;
Keisan();
}
function Keisan() {
this.Tokei.theHours = Math.floor(theTime/60);
this.Tokei.theMinutes = theTime-this.Tokei.theHours*60;
}
 


←初期設定
←最初は0時0分
関数 Idou()
変数theTimeを1増やす
関数Keisan()を実行

関数 Keisan()
 インスタンスTokeiの変数theHour
theTimeを60で割った商
変数theMinutesはtheTimeからtheHours*60を引いた数

                                                              

3 ボタンを配置

(1)時計の針を連続して動かすボタン

   レイヤーを増やし、ボタンレイヤーにする。ウインドウ−他のライブラリ−サンプルライブラリ−ボタン から選び、メインステージに配置する   





 

on (press) {
this.Tokei.play();
}

 

ボタンが押されたら
 時計を走らせる

 

(2)時計の針を止めるボタン

    別のボタンを配置し、以下をボタンアクションに記述する




 

on (press) {
this.Tokei.stop();
}
 

ボタンが押されたら
 時計を止める

 

(3)時計の針を1分ずつ進める

    別のボタンを配置し、以下を、ボタンアクションに記述する





 

on (press) {
this.OneNext();
this.Tokei.MoveHari();
}

 
    フレームアクションに、以下の関数を追加する





 

function OneNext() {
theTime++;
Keisan();
}

 

(4)時計の針を1分ずつ戻す

    別のボタンを配置し、ボタンアクションを書く





 

on (press) {
_root.OnePrev();
this.Tokei.MoveHari();
}
 
以下をフレームアクションに追加する





 

function OnePrev() {
theTime--;
Keisan();
}

 

(5)時計の針を1時間進める

    別のボタンを配置し、ボタンアクションを書く





 

on (press) {
_root.OneHourNext();
this.Tokei.MoveHari();
}

 
以下をフレームアクションに追加する





 

function OneHourNext() {
theTime += 60;
Keisan();
}

 

(6)時計の針を1時間戻す

   別のボタンを配置し、ボタンアクションを書く





 

on (press) {
_root.OneHourPrev();
this.Tokei.MoveHari();
}

 
     以下をフレームアクションに追加する








 

function OneHourPrev() {
theTime -= 60;
if (theTime<=0) {
theTime = 720-theTime;
}
Keisan();
}

 

できあがりのソフト例時計盤