| Tutorial Flash - HTML5 - Javascript - DKV

Latest Blog



11.06.2020

Membuat Kuis CBT

Membuat kuis CBT, menyimpan nilai ke server dengan PHP dan XML

11.05.2020

Game RPG dengan HTML Canvas (Javascript)

Pengembangan game RPG dengan teknik tiling menggunakan HTML canvas

19.05.2020

Membuat Fitur Swipe Mobile

Membuat fitur swap / drag konten untuk mobile

12.05.2020

Membuat Grafik Fungsi Kuadrat dengan Flash

Membuat kurva fungsi kuadrat dengan kode actionscript 3 Flash

11.05.2020

Membuat Kordinat Kartesius dengan Flash

Membuat sistem kordinat kartesius dengan code AS3 full

16.03.2020

Game Edukasi RPG

Buku pengembangan game RPG bermuatan edukasi

31.07.2019

Perpustakaan Baru UNNES

Mengintip perpustakaan baru UNNES

07.04.2018

Membuat Game Tebak Gambar

Tutorial membuat game tebak gambar dengan Flash

03.07.2017

Memahami konstain

Memahami penggunaan konstrain dalam membuat sistem gerak

28.01.2017

E-Book Media Pembelajaran

E Book Gratis Membuat Media Pembelajaran Interaktif


ALL BLOG

Latest Games


;
Free Games

Indonesia Soccer League

Play Indonesian Soccer League on Flash 3D Games

Mengontrol Movieclip (objek), memahami hubungan parent dan child

Konsep dasar

Ketika belajar actionscript, berdasarkan pengalaman saya sekian tahun yang lalu - mempelajari konsep parent-child adalah sesuatu yang membingungkan. Disisi lain, bingung adalah sesuatu yang harus dihindari ketika belajar apapun. Untuk itu melalui tutorial sederhana ini kita akan berusaha memahami cara mengakses sebuah movieclip dan elemen-elemen yang ada di dalamnya (disebut sebagai child). Pada contoh ini kita akan membuat sebuah movieclip mobil dimana di dalamnya terdapat elemen-elemen seperti roda, body, lampu dan sopir. Dengan menggunakan kode kita dapat mengakses masing-masing elemen tersebut. Untuk lebih jelasnya ikuti langkah-langkah berikut :


Membuat movieclip mobil

  1. Pada file aplikasi Flash, buatlah sebuah gambar roda, kemudian convert menjadi movieclip roda. Seleksi movieclip roda tersebut kemudian convert menjadi movieclip animasi roda. Double klik movieclip animasi roda, selanjutnya klik kanan frame 20 dan pilih Insert Key Frame. Klik kanan frame 10 kemudian pilih create classic tween (CS3 :create motion tween).

  2. interactive multi media by wandah_w
  3. Untuk menambahkan animasi roda berputar, klik frame 10, kemudian buka panel properties. Pilih CCW pada opsi rotate:. CCW berarti berlawanan dengan arah jarum jam - berkebalikan dengan CW. Selanjutnya kembali ke scene utama dengan menekan Ctrl + E.

  4. interactive multi media by wandah_w
  5. Copy paste movieclip animasi roda, sehingga terdapat 2 buah roda. Selanjutnya buatlah gambar sebuah body mobil, dan convert menjadi movieclip body. Double klik movieclip body kemudian buatlah sebuah gambar seorang supir, dan convert gambar tersebut menjadi movieclip supir. Kembali ke scene
  6. Buatlah sebuah efek sinar lampu (gunakan warna linear gradient dan sedikit alpha) kemudian convert menjadi movieclip lampu.
  7. Seleksi semua objek di layar (2 animasi roda, 1 body, dan lampu) kemudian convert menjadi movieclip mobil. Selanjutnya agar masing-masing objek dapat diakses menggunakan kode, tambahkan instance name seperti pada gambar berikut : nama symbol dan nama instance

  8. interactive multi media by wandah_w


Membuat tombol pengendali movieclip

  1. Untuk mengendalikan movieclip mobil buatlah 6 buah tombol, yaitu tombol mobil, tombol roda_d,tombol roda_b,tombol lampu,tombol body,dan tombol supir. Tambahkan instance name pada masing-masing tombol tersebut :

  2. interactive multi media by wandah_w
  3. Selanjutnya buatlah sebuah layer baru yaitu layer kode, klik frame 1 layer kode, kemudian ketikkan kode berikut
  4. import flash.events.MouseEvent;
    
    var roda_d_bergerak:Boolean = true;
    var roda_b_bergerak:Boolean = true;
    
    tombol_mobil.addEventListener(MouseEvent.CLICK, atur_tombol);
    tombol_roda_d.addEventListener(MouseEvent.CLICK, atur_tombol);
    tombol_roda_b.addEventListener(MouseEvent.CLICK, atur_tombol);
    tombol_lampu.addEventListener(MouseEvent.CLICK, atur_tombol);
    tombol_body.addEventListener(MouseEvent.CLICK, atur_tombol);
    tombol_supir.addEventListener(MouseEvent.CLICK, atur_tombol);
    
    function atur_tombol(e:MouseEvent):void{
    	var nama_tombol:String = e.currentTarget.name;
    	if (nama_tombol == "tombol_mobil"){
    		if (mobil.visible){
    			mobil.visible = false;
    		}else{
    			mobil.visible = true;
    		}
    	}
    	if (nama_tombol == "tombol_roda_d"){
    		if (roda_d_bergerak){
    			mobil.roda_depan.stop();
    			roda_d_bergerak = false;
    		}else{
    			mobil.roda_depan.play();
    			roda_d_bergerak = true;
    		}
    	}
    	if (nama_tombol == "tombol_roda_b"){
    		if (roda_b_bergerak){
    			mobil.roda_belakang.stop();
    			roda_b_bergerak = false;
    		}else{
    			mobil.roda_belakang.play();
    			roda_b_bergerak = true;
    		}
    	}
    	if (nama_tombol == "tombol_lampu"){
    		if (mobil.lampu.visible){
    			mobil.lampu.visible = false;
    		}else{
    			mobil.lampu.visible = true;
    		}
    	}
    	if (nama_tombol == "tombol_body"){
    		if (mobil.body.visible){
    			mobil.body.visible = false;
    		}else{
    			mobil.body.visible = true;
    		}
    	}
    	if (nama_tombol == "tombol_supir"){
    		if (mobil.body.supir.visible){
    			mobil.body.supir.visible = false;
    		}else{
    			mobil.body.supir.visible = true;
    		}
    	}
    	
    }
    

    Jalankan aplikasi dengan menekan tombol Ctrl+Enter, maka hasil dari tutorial ini adalah sebagai berikut:


    Get Adobe Flash player

    Dalam sebuah susunan hirarki parent-child prinsip dasar yang harus dipahami adalah apabila kita akan mengakses child dari sebuah objek, kita harus menyebutkan nama dari object parent nya. Sebagai contoh ketika anda akan mengakses mc supir, anda harus menyebutkan parent dari mc supir, yaitu mc body, dan karena mc body berada di dalam mc mobil, maka anda juga harus menyebutkan mobil terlebih dahulu, sehingga kode untuk memanggil mc supir adalah mobil.body.supir.

    Sebaliknya apabila anda ingin mengakses mc mobil dari dalam mc supir (dalam artian, kode nya di letakkan di dalam mc supir, maka kode yang dibutuhkan harus menyertakan kata parent, sehingga menjadi supir.parent.parent. Kata parent dituliskan 2 kali, karena mc supir berada di kedalaman 2 level atau merupakan "cucu" dari mc mobil. Apabila anda masih bingung dengan penjelasan tersebut, anda buka file sumber dan anda pelajari strukturnya.

    File Sumber


    download



    Share ( Ayo Berbagi )

    Leave me a comment

    untuk pertanyaan lebih baik di email langsung ke wandah [at] wandah [dot] com agar cepat direspon