Aug
01
2007
Membuat Jam Analog ( Analog clock ) PDF Print E-mail

hariesdesign.com Selain digital clock berikut akan dijelaskan untuk pembuatan jam analog. Seperti biasa untuk set jam analog ini menurut jam yang ada pada komputer anda sendiri. Untuk hasil jadi akan terlihat seperti dibawah ini :

Adapun untuk membuat ikuti langkah2 berikut ini

Langkah 1 

Buat dokument baru dengan dimensi properties sesuai keinginan anda, untuk tutorial ini saya contohkan 180 px X 150 px

 

Langkah 2

buat 5 layer dengan urutan dan nama seperti gambar berikut :

Image 

 

Langkah 3

Buat gambar Background untuk jam, background bisa dibuat dengan photoshop atau langsung dari flash. Setelah itu letakkan pada layer paling akhir / layer interface dengan cara import gambar atau tekan Ctrl+R.

Image   

 

Langkah 4

Buat  gambar berupa garis yang berfungsi sebagai penanda detik pada layer sec (sec layer), jadikan gambar tersebut ke  bentuk symbol/convert to symbol (F8), beri nama sec_mc, pilih movie clip untuk behavior dan menentukan titik tengah symbol tersebut

Image

Setelah itu tekan OK

 

Langkah 5

Buka panel library, kemudian drug movie clip sec_mc ke area jam, pendekkan symbol tersebut cengan bantuan Free Transform Tool (Q) Image. Kemudian buka panel properties, untuk instance beri nama min/sesuai fungsi, lihat gambar berikut :

Image 

untuk jarum jam /Hour caranya sama tinggal ganti di nama pada panel properties

urutan panjang jarum symbol dari panjang ke pendek adalah Sec - Min - Hour 

Pastikan urutan dan posisi jarum-jarum seperti gambar berikut :

Image 

 

Langkah 6

Paste script berikut pada layer actions , dengan cara buka panel actions

 

time=new Date(); // time object
seconds = time.getSeconds()
minutes = time.getMinutes()
hours = time.getHours()

hours = hours + (minutes/60);

seconds = seconds*6; // calculating seconds
minutes = minutes*6; // calculating minutes
hours = hours*30; // calculating hours

sec._rotation=seconds; // giving rotation property
min._rotation=minutes; // giving rotation property
hour._rotation=hours; // giving rotation property



                  

Setelah itu tekan Ctrl+Enter untuk melihat hasilnya 

Selesai

Jika ada pertanyaan untuk Tutorial ini  klik Forum Haries Design 

 
< Prev   Next >

Gallery Photography

Login

Sponsors


Get Chitika Premium