Wednesday, December 8, 2010

Tutorial : How to connect Flash with Database using actionscript 2.0 (pt 4)

1- Ok, sebelum ni aku ada memberikan contoh bagaimana nak create database dan table-table nya... Mudah bukan??? Ok, untuk tutorial kali ini, kita akan akan belajar macam mana nak design FORM didalam flash... wiehuuu....

2- Buka Adobe Flash, (atau Macromedia Flash, mana2 version pon takpe)... Pilih File> New > Flash File (ActionScript 2.0) dan klik button ok.

3- Ok, kali ni kita akan buat satu form, dimana apabila user massukkan data mereka kedalam form, dan klik button 'submit' (anda boleh namakan button anda sebagai apa2 saja nama yang anda suka), maka data2 tersebut akan disimpan didalam table dan database yang sudah kita create sebelum ni...

4- Pilih text tool (sebelah kiri Flash), buat 3 kotak input text...

5- untuk mencantikkan form anda, ubah suai kan kekotak input text anda kepada garisan... untuk kotak input ketiga, panjangkan kekotak tersebut dan pilih jenis 'multiline' (rujuk gambar dibawah)...
6- Ok, anda sudah berjaya create input text... Sekarang, anda perlu buat satu button... Apabila user klik button tersebut, flash akan menyimpan segala data yang ditulis didalam input text tersebut didalam database...

7- Design button anda didalam flash... Selectkan button tersebut, right click mouse anda dan pilih 'convert to symbol'... Didalam panel convert tersebut, pilih jenis 'movie clip' dan berikan nama button anda... cara ini aku gunakan bagi software Adobe Flash 3, bagi versi latest, aku tak pasti samada cara ni boleh digunapakai atau tidak... huhuhu
8- Selectkan semua item didalam stage anda, satu persatu (kotak input1, kotak input2, kotak input3 dan button)... Selepas select item, lihat dibahagian bawah Flash (properties)... Terdapat satu ruang ... Isikan ruangan ini bagi setiap item... Bagi tutorial ini, aku menamakan kotak input 1 = input1, kotak input2 = input2, kotak input3 = input3 dan button = btn. Kenapa kita perlu isikan instance name bagi setiap item?? Ironinya, instance name ini akan digunakan didalam coding nanti... Setiap objek perlu ada nama tersendiri agar ianya boleh digunakan didalam script nanti... huhuhu


9- Tambah sedikit text, supaya design form anda bertambah menarik...
10- Opss... sabar... sikit je lagi nak siap... kali ini kita akan buat satu frame, dimana, apabila user berjaya memasukkan kesemua data, maka ianya akan bawa ke frame berjaya... Jika user tidak memasukkan kesemua data, maka ianya akan dibawa ke frame gagal.

11- Untuk frame berjaya, mula2 anda perlu klik di frame 2... Kemudian pada keyboard anda, tekan F7... Satu blank keyframe akan dihasilkan... Design kan stage anda dengan text "Berjaya"

12- Sekarang kita akan buat frame tidak berjaya... Imbas kembali: Jika user tidak memasukkan semua data kedalam semua input text, dan apabila mereka klik button 'Send', maka sistem akan bawa user ke page/frame tidak berjaya...

13- Ok, untuk create frame tidak berjaya, anda perlu klik pada frame 3.. Kemudian pada keyboard anda, tekan F7... Satu blank keyframe akan dihasilkan... Design kan stage anda dengan text "Tidak Berjaya"
14- So, sekarang anda sudah berjaya membuat FORM didalam flash... well done... apa lagi?? jom ber'canyon' sebentar... Muahahaha... Tutorial seterusnya akan menyentuh programming didalam flash... eyaayyy... opss... jangan lupa save flash file anda ok?? save dimana2 pon takper

No comments:

Related Posts Plugin for WordPress, Blogger...