Scroll Text Codes pada Flash CS3 dengan External Text

Text Scrolling View

Kelebihan dari external file text pada Flash adalah memberikan kemudahan dalam meng Edit content karena tidak perlu lagi mengedit file (.fla) jika ada perubahan dalam content, Cukup hanya mengedit file (.txt) nya saja, dan untungnya lagi orang yang mengedit tidak selalu harus bisa menggunakan program FLASH. Pada kesempatan ini Saya mencoba memberikan sedikit pengalaman ketika Saya mengerjakan proyek website berbasis Flash di www.Shankarigold.com, saat itu saya hampir putus asa karena sulitnya membuat text yang panjang dengan area yang terbatas menggunakan textscroll yang button nya bisa kita buat sendiri sesuai selera.

Baiklah, saya akan mulai memberikan Tipsnya untuk anda…

  1. Buatlah dokumen baru pada Flash dengan Dimensions width: 300px height: 300px, dan Frame rate 30Fps.
  2. Klick dua kali layer 1 lalu rename dengan nama “Bg”, kemudian klick ranctangel Tool pada tool Bar dan pada properties ketikan angka 10 untuk membuat rounded corner, kemudian pindahkan cursor ke area kerja, klick dan drag untuk membuat sebuah kotak, kira-kira berukuran 200px -250px.
  3. Ulangi langkah ke dua tadi dan pada properties ketikan angka 20 untuk membuat rounded corner, kemudian pindahkan cursor ke area kerja, klick dan drag untuk membuat sebuah kotak disamping kanan kotak sebelumnya, kira-kira berukuran 32px -250px.
    tsc_3
  4. Buat layer baru dengan nama “Textscroll” diatas layer “bg”, pilih Text Tool pada Tool Bar kemudian klick dan drag diatas area kerja untuk membuat Text Box, pada Properties pilih Dynamic Text, pada kolom instant name ketikan “scText_txt” dengan linetype “multiline”.
    tsc_5
  5. Masih dalam layer Text, kemudian kita akan buat TOMBOL sebagai scrolling text dengan cara click dan tahan rectangle tool kemudian pilih oval tool, lalu buatlah lingkaran pada area kerja anda dengan ukuran 26px. kemudian click dan tahan kembali rectangle tool kemudian pilih polystar tool dan pada propertiesnya click option dan ganti Number of side menjadi 3, lalu buatlah segitiga diatas lingkaran tadi.
    select lingkaran dan segitiga tersebut kemudian pada Top Bar cari Modify-Group atau tekan Ctrl+G pada Keyboard.
  6. Selanjutnya click lingkaran tersebut lalu tekan F8 (convert to symbol) pada keyboard, pada kolom Nama diberi judul “Tombol-atas”pada Type centang Button lalu klick Oke.
    tsc_6
  7. click tombol-atas lalu tekan F9, kemudian pada windows action ketikan script seperti ini:

    on (release) {
    scText_txt.scroll- -;
    }

  8. Selanjutnya untuk membuat TOMBOL BAWAH, tekan Ctrl+L untuk membuka jendela Library kemudian click kanan tombol-atas pada library lalu pilih Duplicate, pada jendela Duplicate Symbol ganti nama menjadi “tombol-bawah” lalu tekan oke.
    Nah, pada jendela Library klick dan drag tombol-bawah ke area kerja anda letakan dibawah tombol-atas lalu pada Top Bar cari Modify-Transform-Flip Vertical untuk merubah arah panah menjadi ke bawah, kemudian tekan kembali F9 dan pada jendela Action ketikan code seperti ini:

    on (release) {
    scText_txt.scroll++;
    }

    untuk lebih jelasnya, lihat gambar dibawah ini!
    tsc_5

  9. Buatlah satu layer lagi diatas layer Text dan beri nama “Action”, lalu tekan F9 dan pada jendela Action ketikan code seperti ini:

    var loadText:LoadVars = new LoadVars();
    loadText.load(“content.txt”);

    loadText.onLoad = function(success) {
    if(success) {
    this.createTextField(“scText_txt”, 1, 10, 10, 500, 300);
    scText_txt.html = true;
    scText_txt.wordWrap = true;
    scText_txt.multiline = true;
    scText_txt.htmlText = this.contentText;
    }
    }

Sekarang kita tinggal membuat satu File lagi untuk membuat File Text External dengan cara sebagai berikut:

  1. Buka program Text Editor seperti Notepad misalnya, selanjut ketikan code seperti ini:

    contentText=<html> <font color=’#000000′> <b>Teks di scroll dengan tombol kreasi sendiri </b>
    Teks di scroll dengan tombol kreasi sendiri ini dibuat untuk anda yang membutuhkannya.
    Teks di scroll dengan tombol kreasi sendiri ini dibuat untuk anda yang membutuhkannya.
    Teks di scroll dengan tombol kreasi sendiri ini dibuat untuk anda yang membutuhkannya.
    Teks di scroll dengan tombol kreasi sendiri ini dibuat untuk anda yang membutuhkannya.
    Teks di scroll dengan tombol kreasi sendiri ini dibuat untuk anda yang membutuhkannya.
    </font>
    <font size=”11px” color=”#ff0000″><p align=”right”><a href=”http://gusdwi.info”><b>Craeted by Gus Dwi</b></a></p></font>
    </html>

  2. Kemudian simpan dokumen tersebut dengan nama “content.txt“.
    Tolong diingat simpan kedua file tersebut dalam satu direktori

Untuk melihat hasilnya, kembali pada program FLASH lalu tekan Ctrl+Enter maka akan seperti ini:
tsc_final









DOWNLOAD FILE text-scroll.zip di sini.

7 tanggapan untuk “Scroll Text Codes pada Flash CS3 dengan External Text

  1. gde Balas

    kk,,
    aq dah coba..
    tapi kenapa wkt aq ganti nama text nya jd ga jalan??
    katanya filenya ga ada..
    padahal dah aq ganti url filenya d scrip nya…

    karena penasaran terus aq ganti text html yang ada di ats dengan text biasa…
    malah g keluar apa2 waktu runing..
    mohon bantuannya y kk…
    thx b4

  2. gusdwi Balas

    hi Gde,
    Kalau anda mengganti nama filenya, pastikan juga anda harus mengganti kata pertama pada isi file tersebut. dan ingat file harus berformat “txt”.
    Contoh: jika nama file bernama “contact.txt” maka pada kalimat pertama didalam file contact.txt adalah: contactText=<html>tulis isi disini</html>
    Semoga berhasil….!

  3. gde Balas

    harus dalam html ya kk???
    bisa g kalo aq mu load nya file text biasa (bukan html) ????

  4. gusdwi Balas

    Ya, sebaiknya Gde gunakan HTML, tujuannya agr bisa menghasil teks format yang sesuai dengan keinginanmu. misalnya ingin membuat huruf tebal maka gunakan tag <b>.

  5. dhame Balas

    gan,,kalo ane mw baca di flash ny dengan format teks html bukan *.txt gmn y gan?…
    thx b4..

  6. militan Balas

    Sangat menarik. Aku juga punya Program Flashnya. Tapi nggak pernah aku pakai. Tapi setelah membaca Tutorial di atas aku jadi ingin mencobanya lagi.
    Thanks Gan.
    Mampir di Blog-ku gan.

  7. Deo... Balas

    gan…
    aku pemula dalam membuat web, ingin tanya gimana caranya mengupload *.fla yang sudah dibuat sehingga menjadi bentuk web.
    thanks

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *