Sunday, 21 July 2013

Tutorial Flash - Membuat Jam Digital,Hari Dan Tarikh

Kali ini saya ingin berkongsi tutorial untul membuat jam digital , hari dan tarikh. Untuk tutorial ini saya mengguna aplikasi Micromedia Flash Pro 8. 

Download:
Micromedia Flash Pro 8
Password (jika diperlukan) : faiz-tutorial.blogspot.com

1. Klik pada File (1) >> New (2) >> Pilih Document Flash



2. Setting dokumen , pada bahagian Properties klik pada butang size (3) . Setkan Dimension kepada 200px untuk lebar (4) dan 100px untuk tinggi (5). Seterusnya klik OK (6)



3. Seterusnya kita akan membuat backgroud pada stage. Sebelum itu, rename Layer 1 kepada nama background (7) . Klik pada Rectangle Tool (8). Buatkan satu shape sebagai background pada stage (9).



4. Buatkan layer baru. Klik butang Insert Layer (10) , rename Layer 2 kepada jam (11) .



5. Klik pada Text Tool (12) . Pada bahaagian properties pilih Dynamic Text (13) . Setting pada Font , Size Font, Color font dan Align Text (14). Pada stage, buatkan 1 Dynamic Text (15).



6. Klik pada Selection Tool (16) . Klik pada dynamic text yang telah dibuat  pada stage(17) . Pada bahagian properties, pada ruang <Instance Name> isikan dengan  jam_txt (18) .



7. Buat lagi layer baru seperti langkah 4 dan namakan dengan nama saat . Ulangi langkah 5 dan langkah 6. Isikan  pada ruang <Instance Name> isikan dengan  saat_txt .

8.  Buat lagi layer baru seperti langkah 4 dan namakan dengan nama ampm . Ulangi langkah 5 dan langkah 6. Isikan  pada ruang <Instance Name> isikan dengan  ampm_txt .




9. Selanjutnya kita akan hari dan tarikh pula. Buat lagi layer baru seperti langkah 4 dan namakan dengan nama hari dan tarikh . Ulangi langkah 5 dan langkah 6. Isikan  pada ruang <Instance Name> isikan dengan  hari_tarikh (19) dan pada  var  isikan dengan hari_tarikh (20) .



10.  Seterusnya kita akan buat action bagi dynamic text yang telah dibuat tadi. Buat layer baru seperti langkah 4 dan namakan dengan nama Action masa (21) . Klik pada Frame 1 dan klik kanan , pilih Actions atau F9 (22)



11. Copy (Ctrl+C) Actionscript dibawah dan Paste (Ctrl+V) pada ruang Actions Frame (23). Close Actions - Frame .

time=new Date(); // time object
var seconds = time.getSeconds()
var minutes = time.getMinutes()
var hours = time.getHours()
if (hours<12) {
ampm = "AM";
}
else{
ampm = "PM";
}
while(hours >12){
hours = hours - 12;
}
if(hours<10)
{
hours = "0" + hours;
}
if(minutes<10)
{
minutes = "0" + minutes;
}

if(seconds<10)
{
seconds = "0" + seconds;
}
jam_txt.text = hours + ":" + minutes;
saat_txt.text = seconds;
ampm_txt.text = ampm;


12. Buat lagi layer baru seperti langkah 4 dan namakan Action hari dan tarikh . Klik pada Frame 1 dan klik kanan , pilih Actions atau F9.

13. Copy (Ctrl+C) Actionscript dibawah dan Paste (Ctrl+V) pada ruang Actions Frame. Close Actions - Frame .
myDate = new Date();
weekday = new Array("Ahad", "Isnin", "Selasa", "Rabu", "Khamis", "Jumaat", "Sabtu");
month = new Array("Januari", "Februari", "Mac", "April", "Mei", "Jun", "Julai", "Ogos", "September", "Oktober", "November", "Disember");
hari_tarikh = (weekday[myDate.getDay()]+" , "+myDate.getDate()+" "+month[myDate.getMonth()]+" "+myDate.getFullYear());
14. Buat lagi layer baru seperti langkah 4 dan namakan  All Action . Klik pada Frame 2 dan klik kanan pilih Insert Keyframe atau klik F6.  Pada Frame 2 , klik kanan , pilih Actions atau F9 (24).

15. Copy (Ctrl+C) Actionscript dibawah dan Paste (Ctrl+V) pada ruang Actions Frame. Close Actions - Frame .
gotoAndPlay(1);

16. Highlight semua layer kecuali layer All action dan klik F5 untuk tambah Frame. Pastikan Timeline anda seperti gambar dibawah.



17. Untuk Preview tekan " Right CTRL + Enter " .

18. Untuk save ke file flash movie swf, klik File >> Export >> Export Movie (Ctrl+Alt+Shift+S) >> Pilih lokasi penyimpanan file >> isi File Name >> klik Save >> Setting JPEG Quality (100) >> klik OK.

Selesai......Jika ada masalah sila komen k..

No comments:

Post a Comment