Selamat Datang

Semoga blog ini menjadi wadah sharing & kreatifitas siswa/siswi SMK Negeri 1 Banjar dan untuk yang ingin blognya ditampilkan, kirimkan Nama, Kelas dan Alamat Blog ke Email : indra.smkn1banjar@gmail.com/ 6562752654200023

SMK Nesaba

Wednesday 10 October 2012

Flash : Membuat Stopwatch [Action Script 3.0]

Sebuah cara untuk membuat stopwatch sederhana dengan actionscript 3.0. Karena kita menggunakan font khusus, maka terlebih dahulu kita menginstall font jenis LED 7 Segment.  Langsung aja kita ikuti cara-caranya :)
  • Terlebih dahulu kita mendownload font Digital 7 di internet [google]
  • Kemudian extract dan klik 2 kali untuk menginstallnya.
  • Siapkan sebuah flash document dengan ActionScript 3.0, bisa menggunakan flash CS3, CS4, atau CS5.
    New Document
    New Document
  • Atur ukuran stage menjadi 400px x 120px melalui panel Properties, panel properties dapat ditampilkan melalui shortcut Ctrl + F3.
    Panel Properties
    Panel Properties
  • Kemudian buat sebuah kotak dengan gradasi seperti di bawah ini, warna boleh terserah. ;)
    Kotak
    Kotak
  • Buat sebuah dynamic text dengan Text Tool. Pilih font Digital 7 yang tadi sudah terinstall. Berikan instance name yaitu display_txt. Atur agar tampilannya seperti di bawah ini.
    Dynamic Text
    Dynamic Text
  • Buat sebuah button dengan nama Tombol Start, berikan tulisan berupa Start, berikan instance name start_btn.
    Tombol Start
    Tombol Start
  • Kemudian duplikasi button dari Tombol Start yang telah dibuat, berikan nama baru berupa Tombol Reset. Kemudian ganti labelnya menjadi Reset. Ketik reset_btn sebagai instance namenya.
    Duplicate
    Duplicate
  • Sekarang di library terdapat seperti ini :
    Library
    Library
  • Oke, sekarang di stage sudah seperti ini :
    Layout
    Layout
  • Sekarang kita beralih ke coding. :D Tambahkan Layer baru pada Timeline, maka akan muncul Layer 2, klik pada Layer 2, kemudian tekan F9 untuk menampilkan Panel Action – Frame.
    01import flash.events.MouseEvent;
    02import flash.utils.Timer;
    03import flash.events.TimerEvent;
    04import flash.events.Event;
    05
    06var sedangBerjalan:Boolean = false;
    07
    08start_btn.addEventListener(MouseEvent.CLICK,onStart);
    09reset_btn.addEventListener(MouseEvent.CLICK,onReset);
    10
    11function onStart(e:MouseEvent){
    12    //Merupakan kebalikan dari nilai sedangBerjalan
    13    //Jika nilainya true, maka hasilnya false, begitu pula sebaliknya.
    14    sedangBerjalan = !sedangBerjalan;
    15    if(sedangBerjalan){
    16        timer.start();
    17        //mendisable tombol reset
    18        reset_btn.enabled = false;
    19        reset_btn.alpha = 0.5;
    20    }else{
    21        timer.stop();
    22        reset_btn.enabled = true;
    23        reset_btn.alpha = 1;
    24    }
    25}
    26
    27function onReset(e:MouseEvent){
    28    //mereset counter
    29    angka = 0;
    30    display_txt.text = "00:00:00:00";
    31}
    32
    33var angka:uint = 0;
    34var timer:Timer = new Timer(100,0);
    35timer.addEventListener(TimerEvent.TIMER,onTimer);
    36
    37function onTimer(e:Event){
    38    angka+=100;
    39    var jam:int = angka/(60*60*1000);
    40    var sisaJam:int = angka%(60*60*1000);
    41    var menit:int = sisaJam/(60*1000);
    42    var sisaMenit:int = sisaJam%(60*1000);
    43    var detik:int = sisaMenit/(1000);
    44    var mili:int = (sisaMenit%(1000))/10;
    45    //Melakukan format agar terdapat 0 didepan satuan angka seperti 00:01:02:00
    46    var formatJam:String = jam<10?"0"+jam:""+jam;
    47    var formatMenit:String = menit<10?"0"+menit:""+menit;
    48    var formatDetik:String = detik<10?"0"+detik:""+detik;
    49    var formatMili:String = mili<10?"0"+mili:""+mili;
    50    //Memasukkan ke dalam display_txt
    51    display_txt.text = formatJam+":"+formatMenit+":"+formatDetik+":"+formatMili;
    52}
  • Sekarang kita tes movienya :
Penjelasan Script :
maksud dari baris :
1var formatJam:String = jam<10?"0"+jam:""+jam;
adalah merupakan versi / singkatan dari coding :
1var formatJam:String = "";
2if(jam<10){
3    formatJam = "0"+jam;
4}else{
5    formatJam = ""+jam;
6}
Kemudian tanda % (persen) digunakan untuk mencari nilai sisa.
seperti 10%3 = 1, karena 10/3 = 9 dan sisa 1.

Sumber : http://flashindonesia.com

No comments:

Post a Comment