Membuat Jam Dinding Sederhana

Materi ini adalah lanjutan dari “Membuat Jarum Berputar”

1. Pertama buatlah sebuah dasar dari sebuah jam dinding, seperti terlihat di bawah ini.

2. Buatlah sebuah Dynamic Text untuk menampilkan jam digital. Berikan nama variabel ‘waktu’.

3. Buatlah sebuah jarum pendek untuk penunjuk jam. Jadikan movie-clip dan beri nama ‘jarumpendek’.

4. Buatlah sebuah jarum panjang untuk penunjuk menit. Jadikan movie-clip dan beri nama ‘jarumpanjang’.

5. Buatlah sebuah jarum kecil panjang untuk penunjuk detik. Jadikan movie-clip dan beri nama ‘jarumdetik’.

6. Klik pada frame 1, ketik F9 (buat action script), lalu ketikkan perintah berikut :

this.onEnterFrame = function()
{
//——-ambil data dari sistem
var my_date:Date = new Date();
jam=my_date.getHours();
menit=my_date.getMinutes();
detik=my_date.getSeconds();

//——-2digit jam digital
if(jam<10)
jam=”0″+jam
if(menit<10)
menit=”0″+menit
if(detik<10)
detik=”0″+detik

//——-tampilkan jam digital
waktu=jam+”:”+menit+”:”+detik

//——-posisi jarum pendek
jmenit=Number(menit)/60
jdetik=Number(detik)/3600
jjam=Number(jam)+Number(jmenit)+Number(jdetik)
jarumpendek._rotation=jjam*30

//——-posisi jarum panjang
mdetik=detik/60
mmenit=Number(menit)+Number(mdetik)
jarumpanjang._rotation=mmenit*6

//——-posisi jarum detik
jarumdetik._rotation=detik*6
}

//////———————————-

7. Jalankan Ctrl+Enter.

Membuat Jarum Berputar

Kali ini kita akan belajar menggunakan script untuk memutar sebuah jarum.

1. Pertama-tama buatlah sebuah gambar jarum seperti terlihat di bawah ini.

2. Lalu, jadikan movie clip. Caranya adalah :
- blok gambar panah tadi
- tekan F8
- beri nama ‘jarum’ tekan OK

3. Klik ‘frame 1′ pada ‘Layer 1′ lalu tekan F9
Matikan ‘Script Assist’ untuk bisa mengetik perintah secara bebas.
Ketikkan perintah:

jarum.onEnterFrame = function()
{
this._rotation++
}

4. Lihatlah hasilnya dengan menekan ‘Ctrl+Enter’
5. Sudah terlihat jarum memutar. Tetapi kalau diperhatikan, bagian titik pusat berada di atas, bukan di bawah. Hal ini dikarenakan poros nya ada di bagian atas.
6. Silahkan kembali lagi ke layar dengan menekan F9 lagi.
7. Klik pada gambar jarum, perhatikan tanda ‘+’ di atas gambar.

8. Tanda ‘+’ tersebut merupakan poros dari gambar. Editlah gambar jarum dengan cara double klik gambar tersebut dan geserlah sehingga tanda ‘+’ berada di bawah, tengah.

9. Lihat lagi hasilnya dengan ‘Ctrl+Enter’