Tips & Tutorial

Manipulasi Kembang Api Menggunakan Script Pada Adobe Flash

Kembang api biasanya berbentuk percikan api tapi kali ini kita akan membuatnya menjadi sebuah bintang. Cara kerjanya mudah anda cukup menekan stage maka movie clip bintang yang berada diluar stage akan diduplikasi dengan posisi dan gerakan yang sudah diatur sehingga akan tampak seperti kembang api.

Contoh project yang akan kita buat

(Klik dibagian stagenya)

http://news.palcomtech.com/wp-content/uploads/2012/01/kembang-api.swf

Langkah 1

Buatlah sebuah flash document baru.

Langkah 2

Buatlah sebuah kotak berwarna hitam menggunakan rectangle tool di stage, dengan panjang dan lebar yang sama dengan panjang dan lebar stage.

Langkah 3

Seleksi kotak tersebut dan tekan F8. Pada panel yang muncul masukkan “latar” sebagai name dan movie clip sebagai type serta titik registrationnya berada ditengah-tengah lalu tekan ok.

Langkah 4

Seleksi movie clip latar di stage dan tekan Ctrl+F3. Pada panel properties yang muncul masukkan latar sebagai instance name.

Langkah 5

Buatlah sebuah bintang yang ukurannya kecil. Berikan warna hitam pada bintang tersebut.

Seleksi bintang tersebut dan tekan F8. Pada panel yang muncul masukkan “bintang” sebagai name dan movie clip sebagai type serta titik registrationnya berada di tengah-tengah lalu tekan ok.

Langkah 6

Seleksi movie clip bintang di stage dan masukkan binatang dalam kotak instance name pada panel properties. Letakkan movie clip bintang di luar stage.

Langkah 7

Klik frame 1/layer 1 dan tekan F9. Pada panel actions yang muncul masukkan script berikut :

//membuat variable bernama gravitasi dengan nilai 30
gravitasi = 30;
//membuat variable bernama jumlah_bintang dengan nilai 100
jumlah_bintang = 50;
//membuat variable bernama angka dengan nilai 100
angka = 100;
//membuat array bernama warna berisi kumpulan kode warna
warna = new Array("0xFF0000", "0xFFFFFF", "0xFFFF00", "0xFF9900", "0xFFCC33", "0xFFFFFF");
//ketika movie clip latar di tekan
latar.onPress = function() {
	//nilai variable angka ditambah jumlah_bintang yang sebelumnya ditambah 10 terlebih dahulu
	angka += jumlah_bintang+10;
	for (i=angka; i<(angka+jumlah_bintang); i++) {
		//duplikasi movie clip bintang dengan nama baru bintang+i
		duplicateMovieClip("bintang", "bintang"+i, i);
		//koordinat x bintang+i sama dengan koordinat x mouse
		_root["bintang"+i]._x = _root._xmouse;
		//koordinat y bintang+i sama dengan koordinat y mouse
		_root["bintang"+i]._y = _root._ymouse;
		//nilai variable posX bintang+i sama dengan nilai acak panjang stage dikurangi 200 dibagi 35
		_root["bintang"+i].posX = ((random(Stage.width)-200)/35);
		//nilai variable posY bintang+i sama dengan nilai acak lebar stage dibagi 2 dikurangi 200 dibagi 35
		_root["bintang"+i].posY = ((random(Stage.height/2)-150)/35);
		_root["bintang"+i].onEnterFrame = function() {
			//ubah warna bintang+i sesuai kode warna pada array warna yang diacak
			new Color(this).setRGB(warna[random(warna.length)]);
			//koordinat x movie clip ini ditambah nilai variable posX movie clip ini dikali 0.6
			this._x += this.posX*0.6;
			//koordinat y movie clip ini ditambah nilai variable posY movie clip ini dikali 1
			this._y += this.posY*1;
			//nilai transparansi movie clip ini dikurangi 1
			this._alpha -= 1;
			//nilai variable posY movie clip ini di tambah nilai acak variable gravitasi dibagi 100
			this.posY += random(gravitasi)/100;
			//jika koordinat y movie clip ini lebih dari lebar stage atau jika nilai transparansi movie clip ini kurang dari 0
			if (this._y>Stage.height || this._alpha<0) {
				//hapus movie clip ini dari stage
				this.removeMovieClip();
			}
		};
	}
};

Langkah 8

Lihat hasilnya, dengan menekan Ctrl + Enter. Dan klik bagian stage-nya.

http://news.palcomtech.com/wp-content/uploads/2012/01/kembang-api-tutorial1.swf

Bagaimana? anda tertarik bukan?. Langkah terakhir tinggal anda kembangkan lagi saja untuk backgroundnya. Oke sampai disini dulu, selamat mencoba! ^_^

http://news.palcomtech.com/wp-content/uploads/2012/01/kembang-api.swf

Dipublish juga di http://news.palcomtech.com

One thought on “Manipulasi Kembang Api Menggunakan Script Pada Adobe Flash

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s