Latest Blog
Multimedia Interaktif Tata Surya
Membuat Multimedia Pembelajaran Interaktif tentang tata surya
ALL BLOG
;
Menambahkan scrolling text ke dalam aplikasi Flash
Konsep dasar
Salah satu elemen utama dari sebuah aplikasi adalah teks. Akan tetapi sering kali kita mendapatkan space (ruangan) yang terbatas - sedangkan teks yang akan kita tampilkan cukup banyak. Sebagai solusi atas permasalahan tersebut adalah menggunakan metode scrolling text. Pada dasarnya terdapat 2 cara mudah untuk menambahkan teks scroll, yaitu dengan menggunakan component text area dan menggunakan dynamic text.
Scrolling text menggunakan component
Ikuti langkah-langkah berikut untuk membuat scrolling teks dengan menggunakan component :
- Pada file aplikasi Flash, klik frame tempat dimana anda akan menampilkan teks tersebut. Kemudian pilih menu Window > Component. Setelah panel Component muncul, drag komponen Text Area ke stage. Dengan menggunakan Transform Tool atur posisi dan ukurannya.
- Pada file aplikasi Flash, klik frame tempat dimana anda akan menampilkan teks tersebut. Kemudian pilih menu Window > Component. Setelah panel Component muncul, drag komponen Text Area ke stage. Dengan menggunakan Transform Tool atur posisi dan ukurannya.
- Selanjutnya, klik TestArea tersebut kemudian buka panel properties atau component inspector untuk Flash CS3 ke bawah. Pada Component Parameter Ketikan semua teks yang ingin anda tampilkan pada kolom Text kemudian tekan tombol Enter. Maka teks tersebut akan muncul pada TextArea yang ada di stage, dan apabila baris text nya melebihi ukuran area teks, secara otomatis tombol scroll akan muncul.
- Jalankan aplikasi, dan akan anda dapati text scroll sebagai berikut
Scrolling text menggunakan dynamic text
Apabila anda menginginkan desain yang fleksibel sesuai dengan keinginan anda, anda juga dapat membuat sebuah scrolling teks dengan menggunakan dynamic text. Perhatikan langkah-langkah berikut :
- Anda dapat membuat aplikasi baru, atau melanjutkan contoh di atas.
- Klik Text Tool kemudian perhatikan panel properties. Pada panel properties, aturlah opsinya menjadi seperti gambar berikut
- Drag stage, dan buatlah sebuah area dynamic text sesuai dengan kebutuhan anda. Atur posisi, jenis huruf, ukuran huruf dan sebaginya
- Selanjutnya buatlah 2 buah tombol yaitu tombol untuk scroll atas dan tombol untuk scroll bawah. Lihat gambar.
- Setelah tahapan membuat objek selesai, tahapan selanjutnya adalah memberi nama masing-masing objek. Berikan nama info_txt pada dynamic text, t_atas pada tombol scroll atas dan t_bawah pada tombol scroll atas
- Tahapan terakhir adalah penulisan kode. Buatlah sebuah layer baru (layer kode). Klik frame 1 layer kode kemudian ketikan kode berikut :
import flash.events.MouseEvent; info_txt.text = "Lorem ipsum dolor sit amet, dan seterusnya...... sampai panjang" t_atas.addEventListener(MouseEvent.CLICK, scroll_atas); t_bawah.addEventListener(MouseEvent.CLICK, scroll_bawah); function scroll_atas(e:MouseEvent):void{ info_txt.scrollV--; } function scroll_bawah(e:MouseEvent):void{ info_txt.scrollV++; }
Jalankan aplikasi dengan menekan tombol Ctrl+Enter, maka hasil dari tutorial ini adalah sebagai berikut:
Anda bisa mengatur desain seoptimal mungkin, dan apabila anda menginginkan scrolling secara horisontal (mendatar), maka kode scrollV bisa anda ganti dengan scrollH.
File Sumber
download
Share ( Ayo Berbagi )
Leave me a comment
untuk pertanyaan lebih baik di email langsung ke wandah [at] wandah [dot] com agar cepat direspon