membuat grafik sederhana dengan Flash (disatuin aja)

Beberapa hari yang lalu, saya bertemu dengan teman yang mengikuti kuliah di semester pendek, yaitu kuliah grafika komputer. grafika komputer menuntut kita untuk dapat membuat grafik menggunakan bahasa pemrograman yang kita kuasai…

karena itu, sebagai dasar, saya sudah membuat grid sederhana menggunakan aplikasi Flash (yang saya gunakan Flash 8), menggunakan beberapa baris actionscript saja

grid sederhana x,y

ini actionscript-nya..

// ambil dimensi stage
dh = Stage.height;
dw = Stage.width;
// panjang grid dalam pixel
grid = 30;
// tentukan x1,y1,x2,y2
inputx1 = 1;
inputy1 = 1;
inputx2 = -8;
inputy2 = 5;
// buat movie clip
isi_mc = createEmptyMovieClip(“isi_mc”, 0);
isi_mc.lineStyle(2.5);
isi_mc.moveTo(0, 0);
isi_mc.lineTo(dw, 0);
isi_mc.lineTo(dw, dh);
isi_mc.lineTo(0, dh);
isi_mc.lineTo(0, 0);
// buat garis cartesian x dan y
isi_mc.lineStyle(2, 0xaaaaaa);
isi_mc.moveTo(dw/2, 0);
isi_mc.lineTo(dw/2, dh);
isi_mc.moveTo(0, dh/2);
isi_mc.lineTo(dw, dh/2);
// buat grid setiap angka pixel grid yang telah ditentukan
isi_mc.lineStyle(1, 0xdddddd);
// grid x ke kanan
for (ax=1; grid*ax<dw/2; ax++) {
isi_mc.moveTo(dw/2+grid*ax, 0);
isi_mc.lineTo(dw/2+grid*ax, dh);
}
// grid x ke kiri
for (ax=1; grid*ax<dw/2; ax++) {
isi_mc.moveTo(dw/2-grid*ax, 0);
isi_mc.lineTo(dw/2-grid*ax, dh);
}
// grid y ke atas
for (ay=1; grid*ay<dh/2; ay++) {
isi_mc.moveTo(0, dh/2+grid*ay);
isi_mc.lineTo(dw, dh/2+grid*ay);
}
// grid y ke bawah
for (ay=1; grid*ay<dh/2; ay++) {
isi_mc.moveTo(0, dh/2-grid*ay);
isi_mc.lineTo(dw, dh/2-grid*ay);
}
// buat garis dari koordinat x1,y1 ke x2,y2
isi_mc.lineStyle(2, 0x000000);
isi_mc.moveTo((dw/2)+(grid*inputx1), (dh/2)-(grid*inputy1));
isi_mc.lineTo((dw/2)+(grid*inputx2), (dh/2)-(grid*inputy2));

grid ditambah dengan grid-resolution

grid ini sebenarnya masih sama dengan posting sebelumnya, tapi ini dilengkapi dengan grid-resolution (atau apalah namanya, ini hanya istilah saya saja). perbedaannya dapat dilihat ada garis tipis yang ikut membentuk grid.

actionscript-nya

// ambil dimensi stage
dh = Stage.height;
dw = Stage.width;
// panjang grid dalam pixel
grid = 10;
// resolusi grid

res = 3;
// tentukan x1,y1,x2,y2
inputx1 = 1;
inputy1 = 1;
inputx2 = -3;
inputy2 = 5;
// buat movie clip
isi_mc = createEmptyMovieClip(“isi_mc”, 0);
isi_mc.lineStyle(2.5);
isi_mc.moveTo(0, 0);
isi_mc.lineTo(dw, 0);
isi_mc.lineTo(dw, dh);
isi_mc.lineTo(0, dh);
isi_mc.lineTo(0, 0);
// jika resolusi < 1 maka grid tipis tidak perlu dibuat
if (res>1) {
// buat grid tipis setiap angka pixel grid yang telah ditentukan
isi_mc.lineStyle(1, 0xeeeeee);
// grid x ke kanan dan kiri
for (ax=1; grid*ax<dw/2; ax++) {
isi_mc.moveTo(dw/2+grid*ax, 0);
isi_mc.lineTo(dw/2+grid*ax, dh);
isi_mc.moveTo(dw/2-grid*ax, 0);
isi_mc.lineTo(dw/2-grid*ax, dh);
}
// grid y ke atas dan ke bawah
for (ay=1; grid*ay<dh/2; ay++) {
isi_mc.moveTo(0, dh/2+grid*ay);
isi_mc.lineTo(dw, dh/2+grid*ay);
isi_mc.moveTo(0, dh/2-grid*ay);
isi_mc.lineTo(dw, dh/2-grid*ay);
}
}
// buat grid tebal resolution dari res yang telah ditentukan
isi_mc.lineStyle(1.5, 0xdddddd);
// grid x ke kanan dan kiri
for (ax=res; grid*ax<dw/2; ax += res) {
isi_mc.moveTo(dw/2+grid*ax, 0);
isi_mc.lineTo(dw/2+grid*ax, dh);
isi_mc.moveTo(dw/2-grid*ax, 0);
isi_mc.lineTo(dw/2-grid*ax, dh);
}
// grid y ke atas dan ke bawan
for (ay=res; grid*ay<dh/2; ay += res) {
isi_mc.moveTo(0, dh/2+grid*ay);
isi_mc.lineTo(dw, dh/2+grid*ay);
isi_mc.moveTo(0, dh/2-grid*ay);
isi_mc.lineTo(dw, dh/2-grid*ay);
}
// buat garis cartesian x dan y
isi_mc.lineStyle(2, 0xaaaaaa);
isi_mc.moveTo(dw/2, 0);
isi_mc.lineTo(dw/2, dh);
isi_mc.moveTo(0, dh/2);
isi_mc.lineTo(dw, dh/2);
// buat garis dari koordinat x1,y1 ke x2,y2
isi_mc.lineStyle(2, 0x000000);
isi_mc.moveTo((dw/2)+(grid*inputx1)*res, (dh/2)-(grid*inputy1)*res);
isi_mc.lineTo((dw/2)+(grid*inputx2)*res, (dh/2)-(grid*inputy2)*res);

melengkapi grafik bagian2, ini ditambahkan dengan teks pada garis pandu x,y

ini actionscript-nya

// ambil dimensi stage
dh = Stage.height;
dw = Stage.width;
// panjang grid dalam pixel
grid = 10;
// resolusi grid
res = 3;
// tentukan x1,y1,x2,y2
inputx1 = 1;
inputy1 = 1;
inputx2 = -3;
inputy2 = 5;
// buat movie clip
isi_mc = createEmptyMovieClip(“isi_mc”, 0);
isi_mc.lineStyle(2.5);
isi_mc.moveTo(0, 0);
isi_mc.lineTo(dw, 0);
isi_mc.lineTo(dw, dh);
isi_mc.lineTo(0, dh);
isi_mc.lineTo(0, 0);
// jika resolusi < 1 maka grid tipis tidak perlu dibuat
if (res>1) {
// buat grid tipis setiap angka pixel grid yang telah ditentukan
isi_mc.lineStyle(1, 0xeeeeee);
// grid x ke kanan dan kiri
for (ax=1; grid*ax<dw/2; ax++) {
isi_mc.moveTo(dw/2+grid*ax, 0);
isi_mc.lineTo(dw/2+grid*ax, dh);
isi_mc.moveTo(dw/2-grid*ax, 0);
isi_mc.lineTo(dw/2-grid*ax, dh);
}
// grid y ke atas
for (ay=1; grid*ay<dh/2; ay++) {
isi_mc.moveTo(0, dh/2+grid*ay);
isi_mc.lineTo(dw, dh/2+grid*ay);
isi_mc.moveTo(0, dh/2-grid*ay);
isi_mc.lineTo(dw, dh/2-grid*ay);
}
}
// buat grid tabel resolution dari res yang telah ditentukan
// dan (eksperimental) buat teks 🙂 big success

isi_mc.lineStyle(1.5, 0xdddddd);
// grid x ke kanan dan kiri
for (ax=res; grid*ax<dw/2; ax += res) {
isi_mc.moveTo(dw/2+grid*ax, 0);
isi_mc.lineTo(dw/2+grid*ax, dh);
var mov_txt = createTextField(“text_txt”, this.getNextHighestDepth(), (dw/2+grid*ax)-5, dh/2, 20, 20);
mov_txt.text = ax/res;
isi_mc.moveTo(dw/2-grid*ax, 0);
isi_mc.lineTo(dw/2-grid*ax, dh);
var mov_txt = createTextField(“text_txt”, this.getNextHighestDepth(), (dw/2-grid*ax)-5, dh/2, 20, 20);
mov_txt.text = -(ax/res);
}
// grid y ke atas
for (ay=res; grid*ay<dh/2; ay += res) {
isi_mc.moveTo(0, dh/2+grid*ay);
isi_mc.lineTo(dw, dh/2+grid*ay);
var mov_txt = createTextField(“text_txt”, this.getNextHighestDepth(), dw/2, (dh/2-grid*ay)-7, 20, 20);
mov_txt.text = ay/res;
isi_mc.moveTo(0, dh/2-grid*ay);
isi_mc.lineTo(dw, dh/2-grid*ay);
var mov_txt = createTextField(“text_txt”, this.getNextHighestDepth(), dw/2, (dh/2+grid*ay)-7, 20, 20);
mov_txt.text = -(ay/res);
}
// buat garis cartesian x dan y
isi_mc.lineStyle(2, 0xaaaaaa);
isi_mc.moveTo(dw/2, 0);
isi_mc.lineTo(dw/2, dh);
isi_mc.moveTo(0, dh/2);
isi_mc.lineTo(dw, dh/2);
// buat garis dari koordinat x1,y1 ke x2,y2
isi_mc.lineStyle(2, 0x000000);
isi_mc.moveTo((dw/2)+(grid*inputx1)*res, (dh/2)-(grid*inputy1)*res);
isi_mc.lineTo((dw/2)+(grid*inputx2)*res, (dh/2)-(grid*inputy2)*res);

Iklan

10 thoughts on “membuat grafik sederhana dengan Flash (disatuin aja)”

  1. fa, ga ngerti..
    kalo ngajar flash ya dari awal lah..
    dari helloworld…
    terus helloworldnya bisa jalan…
    selain bisa jalan, juga bisa lari, makan,
    tidur, ketawa, dan nangis -naon

    minta obat cacing fa wekekek

  2. kira2 bisa gak buat tabel dari inputan yang kita inginkan dalam flash gan???

    contoh,, tabel
    baris = 3
    kolom = 3
    dan akhirnya muncul tabel 3×3 setelah kita tekan tombol..,,
    reply y!!
    🙂

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s