Akherat | Kisah Nabi Muhammad | Sahabat | Belajar Blogger | Template | HTML | Tutorial

Home / All posts

flash jam actionscript

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم

Posted by Unknown Rabu, 21 September 2011 0 komentar

Pada tutorial yang lalu, kita telah mempelajari cara membuat jam digital. Kali ini kita akan mempelajari cara membuat sebuah jam analog. Tampilan jam analog yang akan kita buat di sini masih sederhana. Anda dapat mengembangkannya dengan memperbaiki bagian grafiknya. Sehingga nantinya jam akan terlihat lebih bagus lagi.
1. Buatlah flash document.
2. Buatlah sebuah gambar seperti di bawah ini. Anda dapat menggunakan oval tool, text tool, dan panel transform untuk membuatnya.

3. Untuk garisnya kami akan membuat ukurannya seperti ini : garis jam lebih panjang dari garis menit, garis menit lebih panjang dari garis detik, garis detik lebih panjang dari garis jam Anda dapat mengubah ukurannya sesuai keinginan anda.
4. Buatlah tiga buah garis seperti gambar di bawah ini :

5. Seleksi garis yang paling kecil, kemudian tekan F8. Pada panel yang muncul masukkan jam_mc dan movie clip sebagai type serta pastikan titik registrationnya berada di tengah bagian bawah lalu tekan ok.

6. Seleksi movie clip jam_mc di stage kemudian tekan Ctrl+F3. Pada panel properties yang muncul masukkanjam_mc sebagai instance name.
7. Seleksi garis kedua (garis yang tidak terlalu panjang), kemudian tekan F8. Pada panel yang muncul masukkan detik_mc dan movie clip sebagai type serta pastikan titik registrationnya berada di tengah bagian bawah lalu tekan ok.
8. Seleksi movie clip detik_mc di stage kemudian tekan Ctrl+F3. Pada panel properties yang muncul masukkandetik_mc sebagai instance name.
9. Seleksi garis ketiga (garis yang paling panjang), kemudian tekan F8. Pada panel yang muncul masukkanmenit_mc dan movie clip sebagai type serta pastikan titik registrationnya berada di tengah bagian bawah lalu tekan ok.
8. Seleksi movie clip menit_mc di stage kemudian tekan Ctrl+F3. Pada panel properties yang muncul masukkan menit_mc sebagai instance name.
9. Letakan movie clip jam_mc di tengah lingkaran yang kita buat sebelumnya.

10. Selanjutnya letakan movie clip menit_mc di tengah lingkaran (ditempat yang sama movie clip jam_mc berada).

11. Lalu letakan juga movie clip detik_mc di tengah lingkaran (ditempat yang sama movie clip jam_mc dan menit_mc berada).

12. Setelah semuanya terpasang, klik frame 1 dan tekan F9. Pada panel actions yang muncul masukkan script berikut :

//perintah yang dijalankan ketika frame dimainkan
onEnterFrame = function () {
 //membuat variable waktu sebagai date object
 waktu = new Date();
 //membuat variable jam dengan nilai sama dengan jam pada komputer
 jam = waktu.getHours();
 //membuat variable menit dengan nilai sama dengan menit pada komputer
 menit = waktu.getMinutes();
 //membuat variable detik dengan nilai sama dengan detik pada komputer
 detik = waktu.getSeconds();
 //digunakan jika komputer menggunakan sistem 12 jam
 //jika nilai variable jam lebih dari 12 maka akan dikurangi 12
 if (jam>12) {
  jam -= 12;
 }
 //movie clip jam_mc akan berotasi sesuai nilai variable jam dikali 30 yang ditambah nilai variable menit di bagi 2
 jam_mc._rotation = jam*30+(menit/2);
 //movie clip jam_mc akan berotasi sesuai nilai variable menit dikali 6
 menit_mc._rotation = menit*6;
 //movie clip detik_mc akan berotasi sesuai nilai variable detik dikali 6
 detik_mc._rotation = detik*6;
};

13. Tekan Ctrl+Enter untuk melihat hasilnya.

Sourcenya dapat di download di sini

Baca Selengkapnya ....

Apa itu PHP?

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم

Posted by Unknown 0 komentar

Kepanjangan PHP sendiri merupakan sebuah rekursif(pengulangan) yaitu "PHP Hypertext Processor". PHP merupakan bahasa pemrograman untuk membangun web yang dinamik.
Biasanya PHP dihubungkan dengan database MYSQl walaupun tidak tertutup kemungkinan
digabungkan dengan database yang lain seperti SQL Server, Oracle, PostgreSQL, dll.

Bagaimana cara menginstall PHP?
Anda dapat menginstall satu paket langsung menggunakan APPSERV, XAMPP, Wamp.
Dalam paket tersebut sudah disediakan PHP, Apache, dan MYSQL. Untuk menginstallnya
tidak terlalu sulit, anda tinggal mengikuti petunjuk yang di berikan kemudian masukkan
username dan password. Jika anda tidak mengisikan maka secara default
username="root" dan password=""

Dimana letak file/halaman web yang akan saya buat?
Letak folder masing-masing paket installer berbeda-beda. Pada appserv folder untuk
meletakkan file/halaman web secara default berada di c://appserv/www/namaWebAnda

Pada Xampp secara default berada di c:/Program Files/xampp/htdocs/namaWebAnda

Bagaimana membuat database dan tabel baru?

Saya berasumsi anda menggunakan mysql, anda dapat mengedit/membuat via web

Buka browser anda (Firefox,IE, Opera, atau yang lainnya)
Ketikkan pada URL anda : http://localhost/phpmyadmin
Create new database : latihan
Sekarang anda mulai membuat tabelnya, Create new table on database. Silahkan anda ketikkan aliya, kemudian isikan 3 untuk number fields-nya.
Fieldnya pertama adalah id dengan type INT, jadikan primary key dengan Extra auto_increment. Field kedua adalah nama dengan type Varchar dengan length 200. Field ketiga adalah email dengan type Varchar length 200.
Klik save dan selesai :).

Bagaimana cara mengkoneksikan PHP dengan database?

Buat folder baru (misal anda menggunakan Xampp) di c:/Program Files/xampp/htdocs/latihan/
kemudian buka notepad anda ketikkan:

$koneksi = mysql_connect("localhost","root","");
if ($koneksi){
echo "Koneksi Berhasil";
} else {
echo "Koneksi Gagal";
}
?>

Kemudian simpan di folder latihan dengan nama koneksi.php. Buka browser anda dan ketikkan :
http://localhost/latihan/koneksi.php

Cukup mudah bukan pemrograman dengan PHP, tunggu artikel saya selanjutnya ya :)

Baca Selengkapnya ....

Teknik Masking dan Membuat Mouse Pointer

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم

Posted by Unknown 0 komentar

Yoshh kembali lagi sekarang kita ke flash, kali ini masking dan membuat mouse pointer sendiri pada flash 8 dan sedikit action script 2.0 didalamnya. Ini contoh dengan kedua teknik tersebut, coba cari ada berapa totoro disitu? :p

Yang pertama bahas Mouse Pointer dulu .

Membuat Mouse Pointer Sendiri

Mouse pointer itu ya cursor itu, tapi mungkin aja temen2 pernah kepikiran gimana ya biar cursornya sesuai dengan tema flash yang dibuat? cukup gampil kok, cukup 2 langkah! apa?!! hanya dengan 2 langkah saja? ya benar 2 langkah saja!. Ok, lebay amat tadi, sekarang langsung ke langkah pertamax.

Langkah pertamax :

1. Buat Movie clip yang akan dijadikan mouse pointer, berikan nama (misal) pada instance name-nya : myMouse. Penamaan terserah, ini nantinya akan dipanggil di action script.

2. Pada frame 1 layer 1, tuliskan action scriptnya seperti ini nih

//Fungsi menyumpetkan mouse pointer yang asli
Mouse.hide();
//Fungsi menggerakan si newMouse sesuai gerakan cursor
newMouse.onMouseMove = function() {
this._x = _xmouse;
this._y = _ymouse;
updateAfterEvent();
};

Yosshh, selesai. Contohnya seperti yang di bawah nih.

Teknik Masking

Sekarang kita mulai belajar teknik masking, buat apaan nih teknik masking? teknik masking itu salah satu fasilitas yang disediakan oleh flash untuk membatasi tampilan mana yang ingin diperlihatkan.

Masih bingung? analoginya gini nih saya punya dua kertas warna (hijau dan merah). Kertas hijau berada diatas kertas merah, yang saya mau ada lingkaran warna merah di kertas hijau. Lalu gimana caranya? ya berarti saya harus melubangi kertas hijau tepat ditengah berbentuk lingkaran kan, beres deh.

Hohoho, seperti itulah contoh analoginya moga2 udah ga bingung ya. Ok sekarang biar lebih seru kita buat kertas-kertas tadi.

Langkah PertamaX

Buat kertas2 tadi dengan cara membuat kotak warna hijau pada layer 1 dan berikan nama kertas bawah hijau. lalu buat layer baru dan beri nama kertas atas merah.

Langkah KeduaX

buat layer baru dan berikan nama masking. Pada layer ini buat lingkaran dengan warna terserah dan jadikan movie clip. Berikan efek gerak pada movie clip ini ke kanan dan kekiri.

Langkah KetigaX

Ubah urutan mulai dari layer paling atas ke bawah jadi masking-kertas bawah merah-kertas atas hijau. Kemudian klik kanan pada layer masking dan pilih mask.

Okeh beres deh. Gampil kan hehe, silahkan dikembangkan sendiri ya.

Suwun.

Flash Interaktif Bagian 3 [Konsep Listener]

7 comments Posted by Dimaz Arno at 7/03/2008 05:40:00 AM

Kali ini kita belajar tentang listener pada action script 2.0 di flash,

referensi di F1 flash itu seperti ini :

Event listeners let an object, called a listener object, receive events broadcast by another object, called a broadcaster object. The broadcaster object registers the listener object to receive events generated by the broadcaster. For example, you can register a movie clip object to receive onResizenotifications from the Stage, or a button instance could receive onChanged notifications from a text field object. You can register multiple listener objects to receive events from a single broadcaster, and you can register a single listener object to receive events from multiple broadcasters.

Kalau versi +- listener itu adalah sebuah fungsi yang akan menghandle sebuah object. Analoginya begini, misalnya kita ingin menggambar di buku gambar. Apa saja object yang kita perlukan?

Buku gambar sebagai area untuk menggambar, kadang-kadang tembok juga media yang bagus :p.
Alat tulis.
Penghapus.

Scriptnya seperti berikut.

Kali ini gak paste source codenya, biar latihan ngetik sendiri ya hehe. script diatas diletakkan pada frame 1 layer 1, cukup 1 frame saja.

Penjelasan script :

Baris :

1. Membuat movie clip dengan nama areaGambar, dan kedalamannya 1.
2. Pertama kali variable gambar dibuat false.
4-9. Ini yang disebut listener, kita membuat listener dengan nama keyListener yang berfungsi menghapus areGambar jika menekan tombol spasi.
10. Mengaktifkan keyListener
12-17. Sekarang membuat listener untuk menggambar. Apabila mouse ditekan maka mulai mengassign garis dengan properties ketebalan 3, RGB-nya #333333, dan alpha=100.
19-24. Listener yang berfungsi menggambar apabila mouse di gerakkan.
26-28. Listener untuk menghentikan gambar ketika mouse dilepas.
29. Mengaktifkan mouseListener.

Sekian, semoga membantu.

Mengontrol Suara Pada Flash action Script 2.0

7 comments Posted by Dimaz Arno at 6/18/2008 05:48:00 AM

Bagaimana action script untuk mengontrol suara pada flash?
caranya simple kok, cukup 1 frame saja.
Jadi perhatikan ya scriptnya :).

Skenarionya seperti berikut, kita akan membuat player flash sendiri yang nantinya bisa kita pamerin di blog/website/friendster :). Kita mempunyai lagu misal ourhouse[phantom planet].mp3 , kemudian ada tombol play dan tombol stop di satu frame.

Langkah-langkahnya :

Import File mp3-nya dengan cara klik File -> Import -> Import to library.
Pada library-nya klik kanan .mp3 nya pilih linkage, centang Export for ActionScript dan Export in first frame. Beri nama identifiernya : ourHouse
Sekarang buat 2 tombol, berikan masing-masing dengan nama instance : play_btn dan stop_btn.
Sekarang ketikkan actionscript pada frame 1 seperti berikut :

laguKu = new Sound();
play_btn.onRelease = function() {
laguKu.attachSound("ourHouse");
laguKu.start(0, 3);
};
stop_btn.onRelease = function() {
laguKu.stop();
};

Penjelasan script :

baris 1 : kita membuat class suara dengan nama laguKu, hal ini berguna untuk memanggil fungsi-fungsi yang ada di kelas sound.

baris 2-5 : script untuk memainkan lagu, pada attachSound berarti memanggil lagu yang ingin di mainkan, pada start(0,3) berarti lagu dimainkan dari detik ke 0 dan diulang hingga 3 kali.

baris 6-8 : script untuk menghentikan lagu.

Selesai, mudah kan :). Semoga membantu.

Flash Interaktif Bagian 2 [Drag and Drop]

23 comments Posted by Dimaz Arno at 12/10/2007 06:27:00 AM

Melanjutkan artikel sebelumnya yaitu flash interaktif.

Salah satu teknik yang digunakan untuk flash interaktif ataupun quiz interaktif adalah Drag and Drop (DnD), DnD seperti namanya yaitu berfungsi untuk men-drag suatu object kemudian meletakkannya(drop).

Kasus yang ini gunakan adalah request-an dari beberapa email yang masuk ke email saya (wow akhir2 ini banyak yang menanyakan tentang kuis interaktif), disini diberikan sebuah soal gambar dengan jawaban acak di samping gambar, kemudian murid akan mencocokkan mana jawaban yang benar dengan men-drag and drop. Jika jawaban benar maka object yang di drag akan menempati posisi jawaban yang benar, tapi jika salah akan kembali ke posisi awal.

Analisa dulu yang kita perlukan disini adalah :

1. Gambar Soal.
2. Object Jawaban.
3. Object Target.
4. Dynamic text untuk keterangan Jawaban (Benar/Salah)
5. Action Script.

Oks sudah beres tahap analisis (Out Of Topic: analisis - desain - implementasi - evaluasi merupakan tahapan minimal pembuatan software yang baik), sekarang buka flash anda.

Tahapan pada flash :

1. Masukkan image gambar soal jika ada, kalau tidak ada anda dapat membuat sendiri di dalam flash. Untuk mengimport gambar :

File -> Import -> Import to Stage

3. Buat Object Target. Dengan cara buat kotak biasa kemudian seleksi object target tersebut dan jadikan movie clip, pada propertiesnya berikan nama adnTarget_mc(Penamaan bebas, pada kasus ini saya membuat object target adalah adn dan kapsid).

Buat juga untuk Object jawaban kapsid namun pada propertiesnya beri nama kapsidTarget_mc.

4. Membuat keterangan jawaban benar atau salah. Buat text dengan properties Dynamic Text dan beri nama keterangan.

5. Action Script. ketikkan script berikut pada layer baru.

//Script untuk ADN
origXAdn = adn_mc._x;
origYAdn = adn_mc._y;
adn_mc.onPress = function() {
this.startDrag();
};
adn_mc.onRelease = function() {
this.stopDrag();
if (eval(this._droptarget) == adnTarget_mc) {
this._x=adnTarget_mc._x;
this._y=adnTarget_mc._y;
keterangan.text="Benar";
} else {
this._x = origXAdn;
this._y = origYAdn;
keterangan.text="Salah";
}
};

//Script untuk Kapsid
origXKapsid = kapsid_mc._x;
origYKapsid = kapsid_mc._y;
kapsid_mc.onPress = function() {
this.startDrag();
};
kapsid_mc.onRelease = function() {
this.stopDrag();
if (eval(this._droptarget) == kapsidTarget_mc) {
this._x=kapsidTarget_mc._x;
this._y=kapsidTarget_mc._y;
keterangan.text="Benar";
} else {
this._x = origXKapsid;
this._y = origYKapsid;
keterangan.text="Salah";
}
};

Penjelasan Action Script :

origXAdn = adn_mc._x;
origYAdn = adn_mc._y;

Script diatas berfungsi untuk mengmbil posisi(x,y) asli dari movie clip adn_mc. Hal ini bertujuan agar ketika jawaban salah akan di kembalikan ke posisi semula.

adn_mc.onPress = function() {
this.startDrag();
};

Script diatas berfungsi untuk mengaktifkan fungsi drag pada movieclip adn_mc

adn_mc.onRelease = function() {
this.stopDrag();
if (eval(this._droptarget) == adnTarget_mc) {
this._x=adnTarget_mc._x;
this._y=adnTarget_mc._y;
keterangan.text="Benar";
} else {
this._x = origXAdn;
this._y = origYAdn;
keterangan.text="Salah";
}
};

Script diatas untuk mengaktifkan fungsi drop. Dengan kondisi

if (eval(this._droptarget) == adnTarget_mc) {
this._x=adnTarget_mc._x;
this._y=adnTarget_mc._y;
keterangan.text="Benar";

Yang berarti jika adn_mc di drop tepat diats adnTarget_mc, maka posisi dari adn_mc akan menempati posisi adnTarget, dan jawabannya adalah benar.

} else {
this._x = origXAdn;
this._y = origYAdn;
keterangan.text="Salah";

Yang berarti jika posisi adn_mc tidak mengenai adnTarget_mc maka dikembalikan ke posisi semula dan keterangan diisi salah.

Terakhir compile dengan menekan ctrl+enter, selesai.

Maaf tidak bisa saya upload filenya karena free space quota saya yang sudah menipis :( , untuk yang berminat mendowload contoh dari program ini silakan hubungi saya. Sekian semoga dapat membantu :) .

Baca Selengkapnya ....

Belajar Action Script di Flash

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم

Posted by Unknown 2 komentar

Belajar Action Script di Flash

Tak kenal maka kenalan, Pepatah kuno nan berguna.

Sebenernya kalo dari pengalaman[baca:sotoy] saya, kalo mau belajar sesuatu itu kita harus nyetting pikiran dulu. Kalo kata pak Budi Raharja : "Yang penting harus senang dulu".
Saya setuju banget, kalo setengah-setengah pasti hasilnya juga setengah-setengah, coba bayangin misalnya ada koki gak suka bikin sayur asem kalo setengah2 ntar jadinya setengah asem dong fufufufu. Nah setelah mind setting yuk kita belajar Action Script. Ayuk!!

Action Script itu adalah bahasa pemrograman yang ada di Flash dan sekarang sudah mencapai versi 3.0, apabila anda sudah menguasai bahasa java [krama inggil recommended] maka saya pikir no problemo untuk anda menguasai Script ini.

Action Script ini dapat menyatukan sebuah animasi dengan pemrograman sehingga hasil dari perpaduan keduanya akan lebih ajiibbb, diantaranya dapat menghemat ukuran file, kolaborasi dengan database, membuat sistem navigasi situs, dan yang pasti lebih interaktif.

Sama halnya dengan java, Action Script(AS) juga memiliki Object dan class, object adalah tipe data meliputi teks, gambar, bahkan suara. Dan object merupakan bagian dari kelas. Agar anda tidak bingung saya akan menganalogikan dengan bahasa manusia , contoh :

- Class : hewan maka object : kucing, gajah, semut

- Class : Makanan maka object : kerak telor, rawon setan, bebek peking

Kemudian object tersebut juga memiliki properties dan method. Properties adalah sesuatu yang dapat membedakan objek tersebut dengan objek yang lain, sedangkan method adalah ‘apa’ yang dapat di lakukan si objek contoh :

- Object : ayam

properties-nya : berat = ringan, berbulu = iya, jumlahKetek = 2.

method : berjalan(), salaman()

- Object : gajah

properties-nya : berat = sangat berat, berbulu = sedikit, jumlahKetek = 4.

method : berjalan, berlari()

Aturan Penulisan

Aturan penulisan pada flash :

- Penulisan statement diakhiri dengan semicolon ;

- Pengelompokkan menggunakan kurung kurawal {}

- Penulisan comment untuk hanya 1 baris diawali dengan // , jika lebih dari 1 baris menggunakan /* dan diakhiri */

Tipe Data

Number, digunakan untuk data berupa angka.

String, digunakan untuk data berupa huruf , angka , dan simbol.

Boolean, untuk menghasilkan nilai true atau false.

Operator

+ , penambahan

- , pengurangan

* , perkalian

/ , pembagian

++ , penambahan 1 pada angka sebelumnya

– , pengurangan 1 pada angka sebelumnya

== , sama dengan

< , kurang dari > , lebih dari

<= , kurang atau sama dengan >= , lebih atau sama dengan

!= , tidak sama dengan

Demikian perkenalan dengan action script semoga bermanfaat :)

Yoshh kembali lagi sekarang kita ke flash, kali ini saya mau memperkenalkan jurus masking dan membuat mouse pointer sendiri pada flash 8 dan sedikit action script 2.0 didalamnya. Ini saya buat contoh dengan kedua teknik tersebut, coba cari ada berapa totoro disitu? :p

Yang pertama kali saya bahas Mouse Pointer dulu ya.

Membuat Mouse Pointer Sendiri

Mouse pointer itu ya cursor itu, tapi mungkin aja temen2 pernah kepikiran gimana ya biar cursornya sesuai dengan tema flash yang dibuat? Saya ingin mengatakan bahwa anda datang di tutorial yang tepat! caranya cukup gampil kok, cukup 2 langkah! apa?!! hanya dengan 2 langkah saja? ya benar 2 langkah saja!. Ok, lebay amat tadi, sekarang langsung ke langkah pertamax.

Langkah pertamax :

1. Buat Movie clip yang akan dijadikan mouse pointer, berikan nama (misal) pada instance name-nya : myMouse. Penamaan terserah, ini nantinya akan dipanggil di action script.

2. Pada frame 1 layer 1, tuliskan action scriptnya seperti ini nih

//Fungsi menyumpetkan mouse pointer yang asli
Mouse.hide();
//Fungsi menggerakan si newMouse sesuai gerakan cursor
newMouse.onMouseMove = function() {
this._x = _xmouse;
this._y = _ymouse;
updateAfterEvent();
};

Yosshh, selesai. Contohnya seperti yang di bawah nih.

Teknik Masking

Sekarang kita mulai belajar teknik masking, buat apaan nih teknik masking? teknik masking itu salah satu fasilitas yang disediakan oleh flash untuk membatasi tampilan mana yang ingin diperlihatkan.

Masih bingung? analoginya gini nih saya punya dua kertas warna (hijau dan merah). Kertas hijau berada diatas kertas merah, yang saya mau ada lingkaran warna merah di kertas hijau. Lalu gimana caranya? ya berarti saya harus melubangi kertas hijau tepat ditengah berbentuk lingkaran kan, beres deh.

Hohoho, seperti itulah contoh analoginya moga2 udah ga bingung ya. Ok sekarang biar lebih seru kita buat kertas-kertas tadi.

Langkah PertamaX

Buat kertas2 tadi dengan cara membuat kotak warna hijau pada layer 1 dan berikan nama kertas bawah hijau. lalu buat layer baru dan beri nama kertas atas merah.

Langkah KeduaX

buat layer baru dan berikan nama masking. Pada layer ini buat lingkaran dengan warna terserah dan jadikan movie clip. Berikan efek gerak pada movie clip ini ke kanan dan kekiri.

Langkah KetigaX

Ubah urutan mulai dari layer paling atas ke bawah jadi masking-kertas bawah merah-kertas atas hijau. Kemudian klik kanan pada layer masking dan pilih mask.

Okeh beres deh. Gampil kan hehe, silahkan dikembangkan sendiri ya.

Suwun.

Flash Interaktif Bagian 3 [Konsep Listener]

7 comments Posted by Dimaz Arno at 7/03/2008 05:40:00 AM

Kali ini kita belajar tentang listener pada action script 2.0 di flash,

Saya coba cari referensi di F1 flash itu seperti ini :

Event listeners let an object, called a listener object, receive events broadcast by another object, called a broadcaster object. The broadcaster object registers the listener object to receive events generated by the broadcaster. For example, you can register a movie clip object to receive onResizenotifications from the Stage, or a button instance could receive onChanged notifications from a text field object. You can register multiple listener objects to receive events from a single broadcaster, and you can register a single listener object to receive events from multiple broadcasters.

Ngerti kan? nggak, sama saya juga hehe. Kalau versi saya itu listener itu adalah sebuah fungsi yang akan menghandle sebuah object. Analoginya begini, misalnya kita ingin menggambar di buku gambar. Apa saja object yang kita perlukan?

Buku gambar sebagai area untuk menggambar, kadang-kadang tembok juga media yang bagus :p.

Alat tulis.

Penghapus.

Ok, lalu listenernya di bagian mana? buku gambar, alat tulis, dan penghapus itu diam terus kan. Gak mungkin buku gambarnya buka halaman sendiri trus pensilnya gerak sendiri. Kalo bisa serem juga mungkin dumbledore lagi iseng :). Nah, kita butuh sebuah penggerak yaitu tangan kita yang dianalogikan sebagai listener, dimana tangan dapat menghandle beberapa fungsi seperi membuka buku gambar, menggambar, dan menghapus. Gimana udah mulai kebayang? insyaAllah.

Sekarang kita translasikan ke flash ya jadi kita akan membuat suatu kanvas sebagai tempat menggambar tanpa menggunakan motion jadi semuanya full script, agar lebih jelas silakann anda coba menggambar di canvas/'buku gambar' yang sudah disediakan di bawah dengan cara men-drag mouse dan menggerakannya. Jika ingin menghapus tekan spasi.

Scriptnya seperti berikut.

Kali ini gak saya paste source codenya, biar latihan ngetik sendiri ya hehe. script diatas diletakkan pada frame 1 layer 1, cukup 1 frame saja.

Penjelasan script :

Baris :

1. Membuat movie clip dengan nama areaGambar, dan kedalamannya 1.
2. Pertama kali variable gambar dibuat false.
4-9. Ini yang disebut listener, kita membuat listener dengan nama keyListener yang berfungsi menghapus areGambar jika menekan tombol spasi.
10. Mengaktifkan keyListener
12-17. Sekarang membuat listener untuk menggambar. Apabila mouse ditekan maka mulai mengassign garis dengan properties ketebalan 3, RGB-nya #333333, dan alpha=100.
19-24. Listener yang berfungsi menggambar apabila mouse di gerakkan.
26-28. Listener untuk menghentikan gambar ketika mouse dilepas.
29. Mengaktifkan mouseListener.

Sekian, semoga membantu.

Mengontrol Suara Pada Flash action Script 2.0

7 comments Posted by Dimaz Arno at 6/18/2008 05:48:00 AM

Import File mp3-nya dengan cara klik File -> Import -> Import to library.
Pada library-nya klik kanan .mp3 nya pilih linkage, centang Export for ActionScript dan Export in first frame. Beri nama identifiernya : ourHouse
Sekarang buat 2 tombol, berikan masing-masing dengan nama instance : play_btn dan stop_btn.
Sekarang ketikkan actionscript pada frame 1 seperti berikut :

laguKu = new Sound();
play_btn.onRelease = function() {
laguKu.attachSound("ourHouse");
laguKu.start(0, 3);
};
stop_btn.onRelease = function() {
laguKu.stop();
};

Flash Interaktif Bagian 2 [Drag and Drop]

23 comments Posted by Dimaz Arno at 12/10/2007 06:27:00 AM

Melanjutkan artikel sebelumnya yaitu flash interaktif.

Salah satu teknik yang digunakan untuk flash interaktif ataupun quiz interaktif adalah Drag and Drop (DnD), DnD seperti namanya yaitu berfungsi untuk men-drag suatu object kemudian meletakkannya(drop).

Kasus yang saya gunakan adalah request-an dari beberapa email yang masuk ke email saya (wow akhir2 ini banyak yang menanyakan tentang kuis interaktif), disini diberikan sebuah soal gambar dengan jawaban acak di samping gambar, kemudian murid akan mencocokkan mana jawaban yang benar dengan men-drag and drop. Jika jawaban benar maka object yang di drag akan menempati posisi jawaban yang benar, tapi jika salah akan kembali ke posisi awal.

Analisa dulu yang kita perlukan disini adalah :

1. Gambar Soal.
2. Object Jawaban.
3. Object Target.
4. Dynamic text untuk keterangan Jawaban (Benar/Salah)
5. Action Script.

File -> Import -> Import to Stage

2. Buat Object Jawaban (lihat gambar dibawah). Dengan cara buat kotak dengan jawaban di dalamnya kemudian seleksi object jawaban tersebut dan jadikan movie clip, pada propertiesnya berikan nama adn_mc(Penamaan bebas, pada kasus ini saya membuat object jawaban adalah adn dan kapsid).

Buat juga untuk Object jawaban kapsid namun pada propertiesnya beri nama kapsid_mc.

3. Buat Object Target. Dengan cara buat kotak biasa kemudian seleksi object target tersebut dan jadikan movie clip, pada propertiesnya berikan nama adnTarget_mc(Penamaan bebas, pada kasus ini saya membuat object target adalah adn dan kapsid).

Buat juga untuk Object jawaban kapsid namun pada propertiesnya beri nama kapsidTarget_mc.

4. Membuat keterangan jawaban benar atau salah. Buat text dengan properties Dynamic Text dan beri nama keterangan.

5. Action Script. ketikkan script berikut pada layer baru.

//Script untuk ADN
origXAdn = adn_mc._x;
origYAdn = adn_mc._y;
adn_mc.onPress = function() {
this.startDrag();
};
adn_mc.onRelease = function() {
this.stopDrag();
if (eval(this._droptarget) == adnTarget_mc) {
this._x=adnTarget_mc._x;
this._y=adnTarget_mc._y;
keterangan.text="Benar";
} else {
this._x = origXAdn;
this._y = origYAdn;
keterangan.text="Salah";
}
};

//Script untuk Kapsid
origXKapsid = kapsid_mc._x;
origYKapsid = kapsid_mc._y;
kapsid_mc.onPress = function() {
this.startDrag();
};
kapsid_mc.onRelease = function() {
this.stopDrag();
if (eval(this._droptarget) == kapsidTarget_mc) {
this._x=kapsidTarget_mc._x;
this._y=kapsidTarget_mc._y;
keterangan.text="Benar";
} else {
this._x = origXKapsid;
this._y = origYKapsid;
keterangan.text="Salah";
}
};

Penjelasan Action Script :

origXAdn = adn_mc._x;
origYAdn = adn_mc._y;

Script diatas berfungsi untuk mengmbil posisi(x,y) asli dari movie clip adn_mc. Hal ini bertujuan agar ketika jawaban salah akan di kembalikan ke posisi semula.

adn_mc.onPress = function() {
this.startDrag();
};

Script diatas berfungsi untuk mengaktifkan fungsi drag pada movieclip adn_mc

adn_mc.onRelease = function() {
this.stopDrag();
if (eval(this._droptarget) == adnTarget_mc) {
this._x=adnTarget_mc._x;
this._y=adnTarget_mc._y;
keterangan.text="Benar";
} else {
this._x = origXAdn;
this._y = origYAdn;
keterangan.text="Salah";
}
};

Script diatas untuk mengaktifkan fungsi drop. Dengan kondisi

if (eval(this._droptarget) == adnTarget_mc) {
this._x=adnTarget_mc._x;
this._y=adnTarget_mc._y;
keterangan.text="Benar";

Yang berarti jika adn_mc di drop tepat diats adnTarget_mc, maka posisi dari adn_mc akan menempati posisi adnTarget, dan jawabannya adalah benar.

} else {
this._x = origXAdn;
this._y = origYAdn;
keterangan.text="Salah";

Yang berarti jika posisi adn_mc tidak mengenai adnTarget_mc maka dikembalikan ke posisi semula dan keterangan diisi salah.

Terakhir compile dengan menekan ctrl+enter, selesai.

Maaf tidak bisa saya upload filenya karena free space quota saya yang sudah menipis :( , untuk yang berminat mendowload contoh dari program ini silakan hubungi saya. Sekian semoga dapat membantu :) .

Baca Selengkapnya ....

Basic Movement dan Basic Collision Pada Flash

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم

Posted by Unknown 0 komentar

Salahsatu dasar dari game flash yang dikendalikan memakai tombol keyboard adalah bagaimana kita menggerakkan object movieClip tersebut bergerak sesuai perintah pada tombol keyboard. Berikut ada sedikit tutorial basic movement untuk menggerak movieClip menggunakan tombol panah keyboard.
Yang perlu dipahami disini adalah untuk menggerakkan suatu movieClip kita hanya mengubah nilai dari posisi sumbu x dan y dari movieClip tersebut. Karena nilai-nilai sumbu dari movieClip tersebut diubah secara terus-menerus ketika tombol panah ditekan maka mengakibatkan posisi movieClip bergeser dari tempat semula. Atau istilah kerennya bergerak… wkwkwkwk…
Mari kita mulai praktekkan :D
Pertama, buat dua buah layer pada timeline. Hal ini berguna untuk menempatkan object movieClip dan actionscript-nya. Kenapa harus disendirikan? hmmm… hal ini untuk memudahkan manajemennya aja :). Selanjutnya buat object lingkaran menggunakan oval tool. Seleksi semua object lingkaran tersebut dan jadikan symbol dengan cara pilih menu Modify, terus pilih Convert to Symbol. Jika ga pengin cara yang bertele-tele klik aja tombol F8 di keyboard untuk shortcut menjadikan symbol. Beri nama sesuka kamu symbol tersebut. Jangan lupa pilih type-nya movie clip.
Basic Movement Flash

Kemudian beri nama instance name-nya karakter_mc. Ingat nama yang berlaku untuk pemrograman nanti adalah nama pada instance name bukan nama symbol yang telah kita buat tadi.
Basic Movement Pada Flash

Selanjutnya masukkan actionscript pada layer "script". Caranya klik pada layer tersebut kemudian tekan tombol F9 pada keyboard untuk memunculkan panel actionscript.
Actionscript untuk basic movement movieClip adalah sbb :
Actionscript Basic Movement

onEnterFrame adalah event dimana actionscript akan dijalankan berulang-ulang. Kecepatan pengulangannya tergantung berapa besar FPS frame rate dari file flash tersebut. Defaultnya sih 12 fps (frame per second). Tapi agar gerakan object lebih halus coba ganti dengan nilai 24 fps atau sesuai selera kamu :D
Pada actionscript diatas dapat dipahami bahwa ketika tombol-tombol panah pada keyboard ditekan, maka posisi sumbu x dan y dari movieClip tersebut akan ditambah dan dikurangi sesuai dengan tombol panah mana yang ditekan. Misal jika yang ditekan tombol panah atas (UP), maka posisi sumbu y dari movieClip "karakter_mc" akan dikurangi sebanyak 3. Karena actionscript tersebut dimasukkan ke dalam event onEnterFrame maka pengurangan sumbu y akan dilakukan berulang-ulang selama tombol panah atas (UP) masih ditekan. Akibatnya movieClip "karakter_mc" akan bergerak ke atas.
Setelah basic movement dikuasai, sekarang kita akan membahas materi collision atau benturan.
Collision sangat berguna banget untuk membuat game flash menjadi atraktif. Bayangkan sebuah gamepesawat yang terkena peluru kemudian pesawat tersebut meledak. Proses peluru mengenai pesawat tersebut dinamakan collision.
Dari tutorial basic movement diatas bisa kita gunakan lagi untuk mempraktekkan basic collision. Buat movieClip baru kemudian beri nama instance name-nya karaktermusuh_mc. Untuk mengetahui terjadi collision apa tidak diantara dua object movieClip, kita bisa menggunakan perintah hitTest. Caranya cukup mudah tambahkan actionscript dibawah ini.
Basic Collision Flash

Pada actionscript diatas dapat kita pahami jika movieClip "karakter_mc" digerakkan dan menyentuh movieClip "karaktermusuh_mc" maka akan terjadi collision sehingga berakibat nilai alpha (transparan) dari karakter_mc menjadi 30. Selanjutnya jika collison tidak aktif nilai alpha karakter_mc menjadi normal lagi 100.
Source code : http://www.geocities.com/unazzanu/share/basic-movement-flash.zip
Yup sekian dulu basic movement dan basic collision kali ini. Semoga berguna… :)

Baca Selengkapnya ....

Typewriter Effect dengan ActionScript 2.0

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم

Posted by Unknown 0 komentar

Membuat efek animasi teks yang muncul huruf per huruf (seperti sedang ngetik) sampai menjadi sebuah paragraf dapat kita buat dengan menulis beberapa baris ActionScript. Siapkan terlebih dulu sebuah objek dynamic text dengan settingan multiline, font yg khas, dan nama variable ‘tulisan’. Setelah itu tuliskan script ini di frame utama:

var i:Number = 1; 
var tulisan:String; 
var tulisanFull:String = "Pemilik blog dengan tagline \"ikatlah ilmu dengan  memblogkannya\" ini mengucapkan terima kasih atas kunjungan anda hari ini,  selamat datang kembali di lain hari, dan jika berkenan silakan tinggalkan jejak  pada halaman Buku Tamu. Wassalam.\n\n\n-F4154LMAN-"; 
  
this.createEmptyMovieClip("mesinTik",  this.getNextHighestDepth());  
  
mesinTik.onEnterFrame =  function(){ 
    if (i <  tulisanFull.length) { 
        tulisan = tulisanFull.substring(0, i);  
        i++; 
    }  
    else {  
        tulisan = tulisanFull;  
        delete mesinTik.onEnterFrame;  
    }  
}

Kuncinya adalah pada fungsi substring() yang dieksekusi secara berulang sehuruf demi sehuruf hingga sebanyak jumlah huruf pada variable ‘tulisanFull’ (yg bertipe String) dengan kecepatan pengulangan sesuai settingan FPS (karena fungsi dijalankan setiap ‘onEnterFrame’) pada Flash movie yg dibuat.

Contoh hasil export .SWF dan source .FLA-nya bisa diunduh di http://www.box.net/shared/c0n9sc9nnq. Mungkin akan lebih baik lagi kalau ditambah sound effect mesin tik “tik..tik..tik..” (ceritanya typewriter SFX) cuman saya gak punya, silakan lah cari sendiri