Tips Script: Duo Teks

Artikel ini dibuat untuk menjawab pertanyaan siswa kelas Flash Animasi di Webmedia Training Center pada tanggal 22 Juni 2010.

Siswa bertanya, “Bagaimanakah membuat suatu aplikasi Flash yang memiliki dua buah TextField atau kotak teks yang berbeda jenis font-nya, dimana ketika kita mengetikkan teks pada kotak teks yang satu, maka secara otomatis kotak teks yang lainnya akan menampilkan teks yang sama tetapi dengan font yang berbeda?”

Jawaban :

Bila menggunakan Macromedia Flash 8 atau MX 2004 :

Sebuah textfield di dalam Flash merupakan instance dari class TextField. Untuk lebih mengenali textfield, mari kita lihat keterangannya melalui fasilitas Help. Jalankan aplikasi Flash, lalu tekan tombol [F1] pada keyboard agar Help-nya muncul.

Lalu buka topik : ActionScript 2.0 Language Reference –> ActionScript Classes –> TextField.

Di sana ditampilkan daftar Property, Method, dan Event dari class TextField. Setiap textfield di dalam Flash akan memiliki semua Property, Method, dan Event tersebut.

Perhatikan Event yang bernama onChanged. Di sana diberikan definisinya sebagai berikut :

onChanged = function(changedField:TextField) {} Event handler/listener; invoked when the content of a text field changes.

***

Event inilah yang akan kita pakai untuk membuat aplikasi yang sesuai dengan yang diminta.

1 Bukalah sebuah dokumen baru di Flash.***
2 Lalu buat dua buah textfield kosong yang cukup besar pada Stage. Textfield pertama bertype Input Text dan diberi nama instance “Teks1”.
Textfield kedua bertype Dynamic Text dan diberi nama instance “Teks2”.***
3 Setting untuk Teks1 adalah :
font: Callibri
font-size: 20
show border around text: yes
line type: multiline***
4 Setting untuk Teks2 adalah :
font: Monotype Corsiva
font-size: 20
show border around text: yes
line type: multiline***
5 Pada frame 1 di timeline, berikan actionscript berikut :
var oListener:Object = new Object();
oListener.onChanged = function():Void
{
Teks2.text = Teks1.text;
}
Teks1.addListener(oListener);
***
6 Jalankan aplikasi ini melalui menu Control –> Test Movie.
Pada kotak teks yang tersedia, ketikkan sembarang kalimat. Maka secara otomatis, kalimat tersebut akan muncul juga pada kotak teks lainnya dengan format font yang berbeda.***

Hasilnya adalah seperti berikut ini : duo-textfield.swf

File sourcenya adalah sebagai berikut : duo-textfield.fla

Bila Menggunakan Adobe Flash CS4 :

1 Bukalah sebuah dokumen baru di Flash CS4, jenisnya ActionScript 3.0. Simpan dengan nama duo_teks.fla.***
2 Lalu buat dua buah textfield kosong yang cukup besar pada Stage. Textfield pertama bertype Input Text dan diberi nama instance “Teks1”.Textfield kedua bertype Dynamic Text dan diberi nama instance “Teks2”.

***

3 Setting untuk Teks1 adalah :font: Callibri

font-size: 20

show border around text: yes

line type: multiline

***

4 Setting untuk Teks2 adalah :font: Monotype Corsiva

font-size: 20

show border around text: yes

line type: multiline

***

5 Pada panel Properties di bagian Publish, isikan nama “duo_teks” di kotak Class.***
6 Lalu buatlah sebuah dokumen baru bertype ActionScript melalui menu File –> New –> ActionScript File***
7 Pada file tersebut isikan script berikut ini :package {

import flash.display.Sprite;

import flash.text.TextField;

import flash.events.Event;

import flash.events.TextEvent;

public class duo_teks extends Sprite {

public function duo_teks() {

Teks1.addEventListener(Event.CHANGE, changeHandler);

}

private function changeHandler(e:Event):void {

Teks2.text = Teks1.text;

}

}

}

***

8 Simpan file tersebut dengan nama duo_teks.as***
9 Kembali pada dokumen duo_teks.fla, jalankanlah file ini melalui menu Control –> Test Movie***

Hasilnya adalah seperti berikut ini : duo-teks.swf

File sourcenya adalah sebagai berikut : duo-teks.fla

Leave a Reply

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

Added by on June 23, 2010
Saved under Tutorial
Tags: , , , , , ,
Praktek Kerja Industri Plus

WORKSHOP MIKROTIK DI SMK N 1 SIMPANG ULIM-ACEH

Webmedia say Hello to Aceh !! ^_^ Selama ini SMK Negeri 1 Simpang Ulim Aceh sering mengirim beberapa siswa-siswa mereka untuk prakerin ke Webmedia Training Center. Mereka belajar, diberikan pelatihan, Workshop-workshop dan banyak pengalaman yang mereka dapat baik itu dari praktik-praktik di Webmedia ataupun project di luar Webmedia. Tapi kali ini Webmedia berkesempatan main ke […]