04
Jul

Awan

Written by admin


Pada tutorial kali ini kita akan membuat animasi awan. Tutorial ini dapat digunakan dalam sebuah game, misalnya game pesawat terbang. Terdapat 2 buah pilihan, menggunakan movie clip di stage atau menggunakan metode attchMovie.

Awan Movie Clip

1. Buatlah sebuah flash document dengan biru sebagai warna stagenya.

2. Buatlah sebuah awan seperti gambar di bawah ini :

awan

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

4. Seleksi movie clip awan di stage lalu tekan Ctrl+D sebanyak 3 sehingga muncul 4 buah movie clip awan di stage.

5. Seleksi movie clip awan pertama di stage dan tekan Ctrl+F3. Pada panel properties yang muncul masukkan awan1 sebagai instance name. 6. Seleksi movie clip awan kedua di stage dan pada panel properties masukkan awan2 sebagai instance name.

7. Seleksi movie clip awan ketiga di stage dan pada panel properties masukkan awan3 sebagai instance name.

8. Seleksi movie clip awan keempat di stage dan pada panel properties masukkan awan4 sebagai instance name.

9. Atur letak keempat buah movie clip awan tadi seperti gambar di bawah ini :

letak-awan

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
for (i=1; i<=4; i++) {
	_root["awan"+i]._xscale = random(50)+50;
	_root["awan"+i]._yscale = _root["awan"+i]._xscale;
	_root["awan"+i].posX = _root["awan"+i]._x;
	_root["awan"+i].kecepatan = random(4)+1;
	_root["awan"+i].onEnterFrame = function() {
		this._x += this.kecepatan;
		if (this._x>500) {
			this._x = this.posX;
			this._xscale = random(50)+50;
			this._yscale = this._xscale;
			this.kecepatan = random(4)+1;
		}
	};
}

11. Tekan Ctrl+Enter untuk melihat hasilnya.

Awan Attach

1. Buatlah sebuah flash document dengan biru sebagai warna stagenya. 2. Buatlah sebuah awan seperti gambar di bawah ini :

awan

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

4. Klik kanan movie clip di stage dan pilih Edit untuk masuk ke dalam stage.

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

1
kecepatan = random(4)+1;

6. Tekan Ctrl+E untuk kembali ke stage scene 1.

7. Hapus movie clip awan dari stage. Buka panel library dengan menekan Ctrl+L. Klik kanan movie clip awan dan pilih Linkage.

8. Pada panel yang muncul berikan tanda centang/contreng pada Export for ActionScript dan masukkan awan sebagai Identifier lalu tekan ok.

9. Klik frame 1 dan pada panel actions yang muncul masukkan script berikut :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
onEnterFrame = function () {
	if (awan_stage<jumlah_awan) {
		buat_awan();
		awan_stage += 1;
	}
};
function buat_awan() {
	awan = attachMovie("awan", "awan"+_root.getNextHighestDepth(), _root.getNextHighestDepth(), {_x:-100, _y:random(360)+40});
	awan._xscale = random(50)+50;
	awan._yscale = awan._xscale;
	awan.onEnterFrame = function() {
		this._x += this.kecepatan;
		if (this._x>500) {
			this.removeMovieClip();
			awan_stage -= 1;
		}
	};
}

10. Tekan Ctrl+Enter untuk melihat hasilnya.

Sourcenya dapat di download di sini





Apakah tutorial di atas menarik atau bermanfaat bagi anda? Bantulah Warung Flash agar tetap ada dan memberikan tutorial-tutorial yang lebih bagus dan bermanfaat lagi. Silahkan klik link berikut ini untuk lebih jelasnya : Bantu Warung Flash



Bookmark and Share

37 Responses to “Awan”

  1. aLL Says:

    thanks untuk tutorialnya… oh ya mau nanya… ada ng tips n trik file flash, baik itu pada waktu membuat game/software supaya lebih efektif dan tidak berat?..tolong dibahas donk..untuk info ajah… ;)) ;))

    mau nambahin lagi..sedikit saran..kalau misalnya movie clip awan2 diatas keluar pertamanya tidak berbarengan..(supaya kelihatan lebih alami.. ) …minta tolong donk dibuatin ya..thanks..

  2. thariq Says:

    waduh tutorialnya bagus sekali

  3. Arief Says:

    Wah nice tutor mas.. Keren awannya =D> Oh ya mas bisa nggak bikin tutor majalah digital seperti di website ini http://digital.edubenchmark.com/
    soalnya saya di suruh bikin majalah digital dari flash yang bisa di bolak-balik halamannya. Thank you

  4. admin Says:

    Coba buka link berikut : http://www.actionscript.org/showMovie.php?id=459 B-)

  5. neng irma Says:

    mas, minta penjelasna tentang cara koneksiin database ke flash
    irma bingung neh….database yang di pakenya apa? :-< :-<

  6. admin Says:

    Maaf nih neng, abang belum belajar tentang database jadi nggak bisa kasih penjelasan :respect:

  7. ikutBLJR Says:

    Tutorialnya sangat membantu :respect:
    Mo tanya, bagaimana jika awan nya itu bergerak dari arah yang berbeda ? Jadi ada awan yang bergerak dari kanan ke kiri dan juga ada awan yang bergerak dari kiri ke kanan.

    salam

  8. admin Says:

    Yang pakai movie clip langsung atau yang pake attachMovie?

  9. pzUH Says:

    :I: gan, biar posisi awan nya ada di blakang objek lain gimana caranya?
    coz ane bikin movie clip pesawat tp posisi awan slalu di depannya, jadi pesawatnya ketutup ma awan….. udah ubah posisi layer tp gak ngaruh…….
    ^
    ^
    o iya, ane pake yang attachMovie….. :p
    mohon bimbingannya……. :)]

  10. admin Says:

    Lebih baik langsung pakai movie clip saja jika kasusnya seperti itu. Tidak perlu pakai attachMovie. Kami juga jika buat game pakai movie clip langsung untuk urusan backgroundnya.

  11. pzUH Says:

    bisa gan ternyata…. pake swapDepths()…… :idea:
    btw, tengkyu so much…… :respect:
    klo boleh rikuest tutorial bikin preloader yg baik dan benar donk….. ane masih punya masalah nih…. :lol:

  12. admin Says:

    Memang pake swapDepths() bisa. Kemarin kami pikir karena anda membuat game pesawat, anda memainkan depth pada peluru yang dikeluarkan oleh pesawat. Oleh karena itu kami tidak menyuruh anda menggunakan swapDepths()
    Tutorial preloader dapat dilihat di sini : http://warungflash.com/2009/01/membuat-preloader/

  13. rizha Says:

    om ada contoh video klip animasi yg pake flash g?
    coz nie dkasih tgas bkin video klip pke flash

    kasih petnjuk donk!thankz b4

  14. admin Says:

    Waduh nggak punya :respect:

  15. A_MUst Says:

    sob……. numpang mampir…..
    mau tanya ……
    caranya buat majalah digital gimana ??????
    kasih tutorialnya donk….
    thanks…..

  16. admin Says:

    Maaf kami belum pernah buat jadi belum bisa kasih tutorialnya :respect:

  17. via Says:

    website ini sangat membantu bagi kami yg belum bsa menggunakan flash..

  18. ireal Says:

    maaf saya mau numpang tanya………..
    bagaimana cara’a klw mw bikin tutorial melalui vedeo?????

  19. mance Says:

    mas mnt tutorial untuk membuat majalah digital donk…thanx ya..

  20. Tom Says:

    gan, gimana caranya supaya awannya cuma muncul di satu stage?
    coz gw bikin presentasi yg pake button gitu terus awannya malah masuk ke scene selanjutnya….

  21. Gosis Says:

    Saya paling suka dengan blog ini. banyak pelajaran yang aku dapat. thank tutorialnya. Mau tanya nih bang! Gimana cara membuat game soal yang muncul secara acak

  22. Herlans Says:

    mas bisa ga mas buat animasinya yang 3d dengan flash,,,,
    saya perlu ni mas…

  23. FEBRY_ Says:

    ASSALAMUA’ALAIKUM…
    KAlO kantor MARKAS WARUNG FLASH DMANA YAHHHH MAS ADMIN :hope:???

  24. admin Says:

    http://warungflash.com/2009/10/graphic/comment-page-1/#comment-5798 :D

  25. ハディフェルナンド Says:

    anata ha nipon de kono yoi furashu chuーtoriaru wo shi ta node , anata ni kansha kono you ni dare mo
    あなたは日本でこの良いフラッシュチュートリアルをしたので、あなたに感謝このように誰も

    /thanks /jempol

  26. Hadi Says:

    mas attach itu apa ya /?? aku bingung ni /stress

  27. meLodiazz Says:

    bro..

    gimana sih caranya bikin hostingan .com yang free??

    rep ya..

  28. awan Says:

    bukannya itu bisa di buat tanpa script bos ya? :-?

  29. nurnaini Says:

    thank’s :peace: ya ilmunya =D> ,,,,,,,

  30. marhaban Says:

    gan, gimana caranya supaya awannya cuma muncul di satu stage?
    coz gw bikin presentasi yg pake button gitu terus awannya malah masuk ke scene selanjutnya….

  31. Dyah pratiwiayu Says:

    Assalmualaikum..
    mas numpang nanya ni..
    klo mke movieclip langsung, biar awnnya bisa gerak arahnya berlawanan gmana sih.. mkasih
    :respect:

  32. retno Says:

    Assalamu’alaikum…
    ms mau nanya,, kalo mnggunakan AS3 gimana scriptnya..
    mohon dkasih yg AS3..
    makasi.. :respect: :respect:

  33. Maulana Says:

    Saya pernah coba tutorial di situs lain dengan script seperti ini :

    onClipEvent(load){
    flagX=random(800)+50;
    flagY=random(60)+10;
    a=random(3)+1;

    this._x=flagX;
    this._y=fleagY;
    speed=random(2)+0.5;
    }

    onClipEvent(enterFrame){
    if(this._x>0){
    this._x=this._x-speed;
    } else{
    this._x= 880;
    }
    }

    Gimana caranya agar awannya bergerak dari kiri kekanan ???

  34. ketut Says:

    thank u for info :yeye:

  35. nies Says:

    makasih banget ni gan. wat tutorial2 nya
    ngebantu ane wat ngerjain TA
    :respect: saluuuuuuuuut buat ente
    :hope: TA ane lancar :D

  36. luna Says:

    kok kalo copy scirptnya pas di paste warnanya berubah? :(( maksudnya kaya scirptnya ga bisa………………………..

  37. Ryan Says:

    min, tu awannya (AWAN ATTACH) keluarkan dari kiri ke kanan, ane mo tanya cara agar awan nya keluar dari kanan ke kiri, bisa gk? :-/

Leave a Reply

B-) =DV <:-P ;)) ;) :yeye: :respect: :peace: :p :idea: :hope: :I: :D :-SS :-? :-/ :)) :) :(( 8-> more »

Komentar yang berisi pertanyaan atau request tutorial kemungkinan besar tidak bisa kami jawab dan penuhi. Hal ini dikarenakan kesibukan kami yang padat . Oleh karena itu kami mohon maaf dan pengertiannya.