July 14, 2024

Membuat Puzzle HUT Ke- 10 PalComTech Menggunakan Adobe Flash CS3

2 min read

Droptarget adalah fungsi yg dapat digunakan utk mengetahui apakah sebuah objek dapat diletakkan pada objek lain yg memiliki bentuk yg sama. Fungsi ini sering digunakan utk pembuatan drag and drop puzzle dan digunakan bersama fungsi kondisi seperti if.

Bertepatan dengan Ulang Tahun PalComTech Ke-10 yang jatuh pada Tanggal 10 Januari 2013 maka Tema Tutorial yang dibuat pada case kali ini adalah “10 Tahun PalComTech”.

Berikut langkah-langkahnya :

Langkah 1

Buka aplikasi Adobe Flash CS3 kemudian buatlah sebuah flash document.

Langkah 2

Kemudian Buatlah background seperti dibawah ini (edit photoshop):

P1

Langkah 3

Pada Adobe Flash CS3 pilih New Layer kemudian Tekan Ctrl+R dan pada panel yang muncul cari gambar yang diinginkan kemudian tekan Open.

Langkah 4

Kemudian seleksi gambar yang telah di-import tadi, kemudian tekan Ctrl+B untuk membuat gambar bitmap menjadi shape.

Langkah 5

Setelah itu gambarlah garis pada gambar tadi, buatlah garis yang membuat gambar tadi terbagi menjadi 9 bagian.

P2

Langkah 6

Seleksi bagian pertama (garis tidak perlu diseleksi), kemudian tekan F8. Pada panel yang muncul ketikkan Bagian1 pada kotak Name, pilih MovieClip sebagai Typenya, lalu tekan Ok.

P3

Langkah 7

Seleksi movie clip Bagian1 kemudian tekan Ctrl+F3. Pada panel properties yang muncul ketikkan Bagian1 pada kotak Instance Name.

Langkah 8

Seleksi kepingan kedua (garis tidak perlu diseleksi), kemudian tekan F8. Pada panel yang muncul ketikkan Bagian2 pada kotak Name, pilih MovieClip sebagai Typenya, lalu tekan Ok.

Langkah 9

Lakukan yang sama sampai Bagian9, kemudian Letakkan kesembilan bagian  gambar tersebut seperti dibawah ini :

P4

Langkah 10

Seleksi kesembilan bagian gambar movie clip kemudian tekan Ctrl+C untuk mengcopynya.

Langkah 11

Jika sudah tekan Ctrl+V untuk menduplikasinya. Letakkan bagian gambar  hasil duplikasi sepeti gambar dibawah ini :

P5

Langkah 12

Pastikan anda masih menyeleksi kepingan hasil duplikasi, Lalu pada panel properties anda ganti Color menjadi Alpha 35%.

P6

Langkah 13

Jika sudah, seleksi salah satu kepingan hasil duplikasi kemudian pada panel properties tambahkan kata Target pada kotak instance name.

P7

Langkah 14

Lakukan Tutorial Nomor 13 pada ketiga gambar duplikasi lainnya. Sehingga nantinya Instance Name pada masing-masing gambar duplikasi menjadi TargetBagian1, TargetBagian2, TargetBagian3, TargetBagian4, TargetBagian5, TargetBagian6, TargetBagian7, TargetBagian8, TargetBagian9.

Langkah 14

Sekarang acak kepingan pada keping asli seperti gambar dibawah ini :

P8

Langkah 15

New Layer, Buatlah sebuah dynamic text, seleksi dynamic text tersebut kemudian pada panel properties anda ketikkan pesan di kotak Var. Kemudian Letakkan dynamic text tadi seperti gambar dibawah ini :

P9

Langkah 16

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

[sourcecode][/sourcecode]

//jumlah kepingan puzzle

//sesuaikan nilai variable jumlahBagian dengan jumlah kepingan yang anda buat

jumlahBagian = 9;

for (i=1; i<=jumlahBagian; i++) {

        _root[“Bagian”+i].id = i;

        //bila kepingan puzzle ditekan

        _root[“Bagian”+i].onPress = function() {

               //buat posisi kepingan berada di paling atas

               this.swapDepths(_root.getNextHighestDepth());

               //kepingan dapat didrag

               startDrag(this);

        };

        //bila kepingan tidak ditekan

        _root[“Bagian”+i].onRelease = _root[“Bagian”+i].onReleaseOutside=function () {

               //kepingan tidak dapat ditekan

               stopDrag();

               target_mc = _root[“TargetBagian”+this.id]

               //jika kepingan berada di sekitar target

               if (eval(this._droptarget) == target_mc) {

                       //letakan kepingan di target

                       this._x = target_mc._x;

                       this._y = target_mc._y;

                       //kepingan tidak bisa ditekan

                       this.enabled = false;

                       //kurangi variable jumlahBagian

                       jumlahBagian–

                       //jika variable jumlahBagian bernilai 0

                       if (jumlahBagian == 0) {

//tampilkan tulisan Puzzle Komplit pada dynamic text pesan

                               pesan = “Happy Birthday PALCOMTECH Ke-10 Tahun, Sukses Selalu”;

                       }

               }

        };

}

[/sourcode]

Langkah 17

Tekan Ctrl+Enter berikut contoh hasilnya :

0 thoughts on “Membuat Puzzle HUT Ke- 10 PalComTech Menggunakan Adobe Flash CS3

  1. agak kurang paham bisa jelaskan listing
    //buat posisi kepingan berada di paling atas

    this.swapDepths(_root.getNextHighestDepth());

Leave a Reply

Your email address will not be published. Required fields are marked *

Copyright © All rights reserved. | Newsphere by AF themes.