Salam jagocodig. Apa kabar kawan, masih pada sehat dan semangat ngoding kan? Oke, setelah sebelumya saya memberikan tutorial dasar tentang membuat Hello World dengan AS 3.o, sekarang saya akan membagikan sedikti tutorial tentang menggambar bangun dengan AS 3.0. Bagi yang belum tahu apa itu AS 3.0 silakan ...

Tutorial Dasar Actions Script 3.0 - Menggambar Objek dan Bangun (2)

Salam jagocodig. Apa kabar kawan, masih pada sehat dan semangat ngoding kan? Oke, setelah sebelumya saya memberikan tutorial dasar tentang membuat Hello World dengan AS 3.o, sekarang saya akan membagikan sedikti tutorial tentang menggambar bangun dengan AS 3.0. Bagi yang belum tahu apa itu AS 3.0 silakan baca di Tutorial saya sebelumnya atau cari saja di Goolge pasti banyak.

Langsung saja ga usah panjang lebar, karena panjang x lebar = luas..... hehe GJ :D. Berikut ini beberapa langkah membuat objek bangun dengan AS 3.0,

Sebelum membuat bangun datar dengan AS 3.0 sebaiknya anda lebih dulu memahami sistem koordinat default pada windows form adobe flash. Pada flash koordinat (0,0) dimulai dari pojok kiri atas seperti terlihat pada gambar berikut ini

Selanjutnya, anda memahami perintah dasar untuk membuat garis dengan ActionScript. Untuk membuat sebuah garis anda dapat menggunakan perintah dasar berikut
this.graphics.lineStye(tebal_garis,kode_warna_hexadecimal)
this.graphics.moveTo(posisiX, posisiY) //posisi awal garis
thsi.graphics.lineTo(posisiX, posisiY) //posisi akhir garis

Dengan perintah di atas kita akan membuat:

  1.  Titik
    Titik merupakan bagian terkecil dari suatu objek, yang menempati suatu tempat, yang tidak memiliki panjang, lebar, dan tinggi. Titik adalah suatu idea tau bisa disebut abstrak. Dikarenakan titik tidak bisa dijelaskan dengan cara biasa, Titik termasuk sesuatu yang tak terdefinisi. Jadi, sebenarnya titik tidak bisa digambarkan maka kita akan membuat sebuah objek dengan dimensi 1 x1 pixel yang bisa mewakili sebuah garis. Buka software adobe flash dan pilih Flash File (ActionScript 3.0) kemudian tekan F9 untuk menuliskan Actions. Kemudian tambahkan script berikut ini
    this.graphics.lineStyle(1,0x000000);
    
    this.graphics.moveTo(10,10);
    
    this.graphics.lineTo(10,11);
    Untuk mengujinya tekan F9 atau pada menu Control->Test Movie. Dan script di atas akan menghasilkan tampilan seperti berikut

    Karena titik tersebut berikuran sangat kecil maka tidak akan terihat jelas.
  2. Garis
    Selanjutnya kita akan membuat garis dengan mengubah sedikit script yang sebelumnya telah ditulis. Yang akan kita udah adalah pada baris ketiga untuk menentukan posisi koordinat akhir. Setelah diubah script sebelumnya menjadi seperti berikut,
    this.graphics.lineStyle(1,0x000000);
    this.graphics.moveTo(10,10);
    this.graphics.lineTo(50,10);
    Dan hasilnya adalah seperti berikut,

    Anda dapat memofikasi nilai yang ada pada fungsi-fungsi yang digunakan untuk mendapatkan hasil yang berbeda.
  3. Bangun Datar
    Untuk membuat bangun datar kita memodifikasi script sebelumnya dengan menambahkan baris perintah this.graphics.lineTo(x,y) di bawah baris terakhir sesuai keinginan anda. Saya akan memberikan contoh membuat beberapa bangun datar
    Persegi
    Tuliskan script di bawah ini pada panel Actions dan tekan F9 untuk melakukan test movie
    this.graphics.lineStyle(1,0x000000);
    this.graphics.moveTo(10,10);
    this.graphics.lineTo(60,10);
    this.graphics.lineTo(60,60);
    this.graphics.lineTo(10,60);
    this.graphics.lineTo(10,10);
    Maka anda akan mendapatkan tampilan seperti gambar di bawah ini

    Segitiga
    Selanjutnya untuk membuat bangun datar segitiga masukkan script berikut ini
    this.graphics.lineStyle(1,0x000000);
    this.graphics.moveTo(60,60);
    this.graphics.lineTo(100,60);
    this.graphics.lineTo(80,30);
    this.graphics.lineTo(60,60);
    Maka hasilnya adalah seperti berikut

    Anda juga dapat memodifikasi nilai koordinat untuk mendapatkan hasil tampilan yang berbeda dan silakan anda berkreasi sendiri sesuai kreatfitas anda.

Mungkin kali ini sampai di sini dulu karena saya mau istirahat dulu, hehehe
Cara menggambar bangun dengan AS 3.0 di atas adalah yang paling sederhana dan belum menggunakan algoritma yang rumit, sebenarnya masih banyak cara menggambar bangun yang lain tapi Insyaallah akan saya sampaikan lain waktu. Sedikti bocoran, kita juga dapat menggambar bangun seperti persegi, lingkaran atau eclipse dengan menggunakan perintah Drawing API yang akan saya jelaskan pada kesempatan selanjutnya. Jika yang saya sampaikan adan yang kurang tepat silakan kalau berkenan tulis di komentar sekaligus kritik dan saran agar tutorial saya selanjutnya bisa lebih baik lagi.
Terimakasih telah membaca tutorial sederhana dari saya.


About Author

Faqih Shofyan Afifi

Seorang mahasiswa Program Studi Pendidikan Teknik Informatika di Universitas Negeri Malang yang masih harus belajar banyak tentang dunia IT


Comment & Discussions

    Please LOGIN before if you want to give the comment.