GRAPHICS AND VISUALIZATION. Logo

GRAPHICS AND VISUALIZATION MAKALAH Logo Oleh : Ade Johar Maturidi NIM. P31.2007.00352 UNIVERSITAS MUHAMMADIYAH CIREBON TAHUN 2007 1

KATA PENGANTAR Assalamu alaikum wr. wb. Alhamdulillah, puji syukur kita panjatkan kehadirat Allah SWT yang dengan rahmat dan hidayahnya kita dapat berada dalam nikmat Iman dan Islam, dan dengan izinnya pula makalah ini telah selesai disusun untuk kemudian menjadi bermanfaat bagi kita semua. Makalah ini ada beberapa bagian yang menjadi pokok bahasan antara lain: 1. Mengenal perbedaan menggambar pada Image dan pada Paintbox dalam Pemrograman DELPHI 2. Membuat Vektor Grafik 2 Dimensi dengan Pemrograman DELPHI 3. Membuat Vektor Grafik 3 Dimensi dengan Pemrograman DELPHI Semoga apa yang telah terselesaikan dalam makalah ini dapat bermanfaat bagi kita semua. Tak lupa pula saya mengucapkan permohonan maaf apabila dalam tulisan maupun arti masih terdapat kesahalan. Saya sampaikan pula rasa terima kasih kepada semua pihak yang telah membantu dalam proses penyelesaian makalah ini dan semoga dukungan baik moril maupun materil mendapatkan balasan dari Allah SWT. Akhirnya, kita berharap Allah SWT tetap memberi petunjuk dan bimbingan kepada kita semua dan senantiasa menyertai gerak langkah kita. Amien. Wassalamu alaikum Wr. Wb. Ade Johar Maturidi 2

PRAKTIKUM 1 Mengenal perbedaan menggambar pada Image dan pada Paintbox dalam Pemrograman DELPHI 1. Deklarasi Pertama (awal) Pada deklarasi awal dibuat tombol-tombol untuk Image dan Paintbox seperti gambar di bawah ini : Kemudian gambar di bawah ini merupakan kode-kode program pada Delphi. Kode-Kode Program pada Delphi : unit coba; interface uses Windows, Messages, SysUtils, Variants, Classes, Graphics, Controls, Forms, Dialogs, StdCtrls, ExtCtrls, Buttons; type TForm1 = class(tform) Image1: TImage; PaintBox1: TPaintBox; Label1: TLabel; Label2: TLabel; Label3: TLabel; Label4: TLabel; Edit2: TEdit; BitBtn1: TBitBtn; BitBtn2: TBitBtn; BitBtn3: TBitBtn; 3

BitBtn4: TBitBtn; BitBtn5: TBitBtn; BitBtn6: TBitBtn; procedure Button1Click(Sender: TObject); procedure Button2Click(Sender: TObject); procedure Button6Click(Sender: TObject); procedure Image1MouseDown(Sender: TObject; Button: TMouseButton; procedure Image1MouseMove(Sender: TObject; Shift: TShiftState; X, Y: Integer); procedure PaintBox1MouseDown(Sender: TObject; Button: TMouseButton; procedure PaintBox1MouseMove(Sender: TObject; Shift: TShiftState; X, Y: Integer); procedure Button4Click(Sender: TObject); procedure Button3Click(Sender: TObject); procedure Button5Click(Sender: TObject); procedure BitBtn1Click(Sender: TObject); procedure BitBtn2Click(Sender: TObject); procedure BitBtn3Click(Sender: TObject); procedure BitBtn4Click(Sender: TObject); procedure BitBtn5Click(Sender: TObject); procedure BitBtn6Click(Sender: TObject); private { Private declarations } public { Public declarations } var Form1: TForm1; Implementation {$R *.dfm} 4

2. Tombol untuk menyimpan gambar ke komputer procedure TForm1.BitBtn5Click(Sender: TObject); Image1.Picture.SaveToFile('d:\test.bmp'); 3. Tombol untuk meng-load gambar dari komputer procedure TForm1.BitBtn5Click(Sender: TObject); Image1.Picture.SaveToFile('d:\test.bmp'); 4. Tombol untuk memulai pengetesan antara Image dan Paintbox procedure TForm1.BitBtn2Click(Sender: TObject); var t1,t2: LongInt; i : Integer; image1.canvas.pen.width := 2; t1:=gettickcount; for i := 1 to 9000 do image1.canvas.lineto(random(300),random(300)); t2 := gettickcount; label1.caption := inttostr(t2-t1) +'ms'; paintbox1.canvas.pen.width := 2; t1:=gettickcount; for i := 1 to 9000 do paintbox1.canvas.lineto(random(300),random(300)); t2 := gettickcount; label2.caption := IntToStr(t2-t1) +'ms'; 5

5. Tombol untuk menghentikan pengetesan procedure TForm1.BitBtn3Click(Sender: TObject); close; 6. Tombol untuk menghapus Image dan menggantinya dengan warna biru procedure TForm1.BitBtn1Click(Sender: TObject); var rect: TRect; rect:= Bounds(0,0,image1.width,image1.height); image1.canvas.brush.color := clblue; image1.canvas.fillrect(rect); 6

7. Tombol untuk menghapus Paintbox dan menggantinya dengan warna merah procedure TForm1.BitBtn6Click(Sender: TObject); var rect: TRect; rect:= Bounds(0,0,image1.width,image1.height); PaintBox1.Canvas.Brush.Color := clred; PaintBox1.canvas.FillRect(rect); 7

8. Fungsi untuk membuat garis lurus di Image dan mengukur posisi mouse procedure Tform1.Image1MouseDown(Sender: Tobject; Button: TmouseButton; Shift: TshiftState; X, Y: Integer); if shift = [ssright] then image1.canvas.textout(x,y,inttostr(x) + : + IntToStr(y)); procedure Tform1.Image1MouseMove(Sender: Tobject; Shift: TshiftState; X, Y: Integer); if shift = [ssleft] then image1.canvas.lineto(x,y); 9. Fungsi untuk membuat garis lurus di Paintbox dan mengukur posisi mouse procedure Tform1.PaintBox1MouseDown(Sender: Tobject; Button: TmouseButton; Shift: TshiftState; X, Y: Integer); if shift = [ssright] then PaintBox1.Canvas.TextOut(x,y,IntToStr(x) + : + IntToStr(y)) procedure Tform1.PaintBox1MouseMove(Sender: Tobject; Shift: TshiftState; X, Y: Integer); if shift = [ssleft] then PaintBox1.Canvas.LineTo(x,y); 8

10. Tampilan Program a. Perbandingan antara Image dan Paintbox b. Hasil Perbandingan Percobaan ke Image Paintbox 1. 2. 3. 4. 5. c. Hasil Perbandingan Setelah gambar di simpan di komputer dan dipanggil kembali adalah Percobaan ke Image Paintbox 1. 2. 3. 4. 5. d. Gambar di Image maupun di PaintBox dihapus, lantas dengan menggunakan mouse kita dapat membuat garis dan mengetahui posisi (x,y) 11. Analisa dan Kesimpulan a.... b.... c.... 9

PRAKTIKUM 2 Membuat Vektor Grafik 2 Dimensi dengan Pemrograman DELPHI 1. Deklarasi Pertama (awal) unit Unit1; interface uses Windows, Messages, SysUtils, Variants, Classes, Graphics, Controls, Forms, Dialogs, StdCtrls, ExtCtrls; type TForm1 = class(tform) Timer1: TTimer; Button1: TButton; Button2: TButton; Button3: TButton; Button4: TButton; Button5: TButton; Button6: TButton; Button7: TButton; Button8: TButton; Button9: TButton; Panel1: TPanel; procedure Button1Click(Sender: TObject); procedure Button2Click(Sender: TObject); procedure Button3Click(Sender: TObject); procedure Button4Click(Sender: TObject); procedure Timer1Timer(Sender: TObject); procedure FormCreate(Sender: TObject); procedure Button9Click(Sender: TObject); procedure Button5Click(Sender: TObject); procedure Button6Click(Sender: TObject); procedure Button7Click(Sender: TObject); procedure Button8Click(Sender: TObject); procedure FormMouseDown(Sender: TObject; Button: TMouseButton; procedure FormMouseMove(Sender: TObject; Shift: TShiftState; X, Y: Integer); procedure FormMouseUp(Sender: TObject; Button: TMouseButton; private { Private declarations } public { Public declarations } 10

var Form1: TForm1; alf, { Sudutputar } si,co, { Sinus dan Kosinus } mf, { factor Skala } x0,y0: single; { Basis koordinat absolut } sf : integer; { factor Cerminan } dirflg : boolean; { flag arah } var x1,y1,x2,y2 :Integer; maustaste :Boolean; implementation {$R *.dfm} 2. Deklarasi Prosedur untuk desain bentuk rumah procedure dwc (dx1,dy1,r : single); { gambar lingkaran relatif } var x1,y1 : single; dx1 := mf * dx1; dy1 := mf * dy1; R := mf * R; x1 := x0 + dx1 * co - sf * dy1 * si; y1 := y0 - sf * dy1 * co - dx1 * si; form1.canvas.ellipse(round(x1-r),round(y1-r),round(x1+r),round(y1+r)); End; procedure dwl (dx1,dy1 : single); { gambar garis relatif } var x1,y1 : single; dx1 := mf * dx1; dy1 := mf * dy1; x1 := x0 + dx1 * co - sf * dy1 * si; y1 := y0 - sf * dy1 * co - dx1 * si; form1.canvas.lineto(round(x1),round(y1)); End; procedure dwp (dx1,dy1:single); { gambar titik relatif } var x1,y1 : single; dx1 := mf * dx1; dy1 := mf * dy1; x1 := x0 + dx1 * co - sf * dy1 * si; y1 := y0 - sf * dy1 * co - dx1 * si; form1.canvas.moveto(round(x1),round(y1)); End; 11

procedure drawhouse; { gambar rumah } dwp(0, 10); { sisi depan } dwl(10, 10); dwl(10, 0); dwl(0, 0); dwl(0, 10); dwp(1, 8); { jendela } dwl(4, 8); dwl(4, 4); dwl(1, 4); dwl(1, 8); dwp(6, 0); { Pintu } dwl(6, 8); dwl(9, 8); dwl(9, 0); dwl(6, 0); dwp(-1, 9); { Atap } dwl(5, 15); dwl(11, 9); dwc(5, 12, 1); { fentilasi } dwp(7, 13); { pondasi Antena } dwl(7, 16); dwl(9, 16); dwl(9, 11); End; 3. Prosedur untuk mengatur tampilan gambar procedure TForm1.FormCreate(Sender: TObject); x0 := clientwidth / 2; y0 := clientheight / 2; alf := 0; sf := 1; mf := 20; canvas.brush.style:= bsclear; procedure TForm1.Button1Click(Sender: TObject); mf := mf + 1; { Perbesar Gambar } procedure TForm1.Button2Click(Sender: TObject); mf := mf - 1; { Perkecil Gambar } procedure TForm1.Button4Click(Sender: TObject); sf := -sf; { Cerminan Gambar } procedure TForm1.Button3Click(Sender: TObject); 12

dirflg := Not dirflg; { arah putaran } procedure TForm1.Timer1Timer(Sender: TObject); form1.refresh; If dirflg Then alf := alf + Pi / 100 { putaran sesuai dengan arah jarum jam } Else alf := alf - Pi / 100; { putaran melawan arah jarum jam } si := Sin(alf); co := Cos(alf); drawhouse; 4. Source Code pengembangan procedure TForm1.FormCreate(Sender: TObject); maustaste := False; Canvas.Pen.Mode := pmnotxor; Canvas.Pen.Style := psdash; procedure TForm1.FormMouseDown(Sender: TObject; Button: TMouseButton; Shift: TShiftState; x, y: Integer); Canvas.Brush.Style:=bsClear; x1 := x; y1 := y; x2 := x; y2 := y; Canvas.Rectangle (x1, y1,x2, y2); maustaste := True 5. Prosedur untuk mengulang tampilan output grafik procedure TForm1.FormMouseMove(Sender: TObject; Shift: TShiftState; X, Y: Integer); Panel1.Caption := IntToStr(x)+ ':' + IntToStr(y); if not maustaste then exit; Canvas.Rectangle (x1, y1,x2, y2); x2 := x; y2 := y; Canvas.Rectangle (x1, y1,x2, y2) 13

procedure TForm1.FormMouseUp(Sender: TObject; Button: TMouseButton; maustaste := False 6. Tampilan Program Sesudah program dijalankan gambar berputar melawan arah jarum jam (dengan lebar langkah sebesar 1/8 derajat). Dengan bantuan tombol-tombol gambar dapat dimanipulasi secara Online. Sebagai dasar pengembangan adalah dengan 2 kali pemakaian XOR dengan 2 Nilai (dalam hal ini adalah Warna) akan kembali ke bentuk awal. Mode XOR-dapat dicapai dengan melalui Mode-Property dariobjek Pen. Cara ini juga dapat untuk membentuk Windows. 7. Analisa dan Kesimpulan 14

A. PRAKTIKUM 3 Membuat Vektor Grafik 3 Dimensi dengan Pemrograman DELPHI 1. Deklarasi Pertama (awal) Kode-kode Program Delphi : unit Unit1; interface uses Windows, Messages, SysUtils, Variants, Classes, Graphics, Controls, Forms, Dialogs, Buttons, StdCtrls; type TForm1 = class(tform) Button3: TButton; BitBtn1: TBitBtn; BitBtn2: TBitBtn; BitBtn3: TBitBtn; BitBtn4: TBitBtn; BitBtn5: TBitBtn; BitBtn6: TBitBtn; BitBtn7: TBitBtn; BitBtn8: TBitBtn; BitBtn9: TBitBtn; BitBtn10: TBitBtn; BitBtn11: TBitBtn; 15

BitBtn12: TBitBtn; BitBtn13: TBitBtn; BitBtn14: TBitBtn; procedure FormCreate(Sender: TObject); procedure Button3Click(Sender: TObject); procedure BitBtn1MouseDown(Sender: TObject; Button: TMouseButton; procedure BitBtn1MouseUp(Sender: TObject; Button: TMouseButton; procedure BitBtn2MouseDown(Sender: TObject; Button: TMouseButton; procedure BitBtn3MouseDown(Sender: TObject; Button: TMouseButton; procedure BitBtn4MouseDown(Sender: TObject; Button: TMouseButton; procedure BitBtn5MouseDown(Sender: TObject; Button: TMouseButton; procedure BitBtn6MouseDown(Sender: TObject; Button: TMouseButton; procedure BitBtn7MouseDown(Sender: TObject; Button: TMouseButton; procedure BitBtn8MouseDown(Sender: TObject; Button: TMouseButton; procedure BitBtn9MouseDown(Sender: TObject; Button: TMouseButton; procedure BitBtn10MouseDown(Sender: TObject; Button: TMouseButton; procedure BitBtn11MouseDown(Sender: TObject; Button: TMouseButton; procedure BitBtn12MouseDown(Sender: TObject; Button: TMouseButton; procedure BitBtn13Click(Sender: TObject); procedure BitBtn14Click(Sender: TObject); procedure FormDestroy(Sender: TObject); private { Private declarations } public { Public declarations } var Form1: TForm1; 16

implementation uses unit2,unit3; {$R *.dfm} var form2 : TForm2; ok : boolean; perintah : integer; procedure TForm1.FormCreate(Sender: TObject); form2 := tform2.create(self); form2.show; left := screen.width-width; top := screen.height-height; procedure TForm1.Button3Click(Sender: TObject); ok := false; close procedure TForm1.BitBtn1MouseDown(Sender: TObject; Button: TMouseButton; perintah :=1; procedure TForm1.BitBtn1MouseUp(Sender: TObject; Button: TMouseButton; perintah :=0; procedure TForm1.BitBtn2MouseDown(Sender: TObject; Button: TMouseButton; perintah := 2; procedure TForm1.BitBtn3MouseDown(Sender: TObject; Button: TMouseButton; 17

perintah :=3; procedure TForm1.BitBtn4MouseDown(Sender: TObject; Button: TMouseButton; perintah :=4; procedure TForm1.BitBtn5MouseDown(Sender: TObject; Button: TMouseButton; perintah :=5; procedure TForm1.BitBtn6MouseDown(Sender: TObject; Button: TMouseButton; perintah := 6; procedure TForm1.BitBtn7MouseDown(Sender: TObject; Button: TMouseButton; perintah :=7; procedure TForm1.BitBtn8MouseDown(Sender: TObject; Button: TMouseButton; perintah := 8; procedure TForm1.BitBtn9MouseDown(Sender: TObject; Button: TMouseButton; perintah:=9; procedure TForm1.BitBtn10MouseDown(Sender: TObject; Button: TMouseButton; perintah:=10; 18

procedure TForm1.BitBtn11MouseDown(Sender: TObject; Button: TMouseButton; perintah:=11; procedure TForm1.BitBtn12MouseDown(Sender: TObject; Button: TMouseButton; perintah:=12; procedure TForm1.BitBtn13Click(Sender: TObject); var lop:integer; ok := true; init(form2); gambar(figur1); while ok do case perintah of 1 : scaling(figur1,1.04); 2 : scaling(figur1,0.96); 3 : rotasi(figur1,0,1,0); 4 : rotasi(figur1,0,-1,0); 5 : rotasi(figur1,1,0,0); 6 : rotasi(figur1,-1,0,0); 7 : rotasi(figur1,0,0,1); 8 : rotasi(figur1,0,0,-1); 9 : translasi(figur1,0,1,0); 10 : translasi(figur1,-2,0,0); 11 : translasi(figur1,2,0,0); 12 : translasi(figur1,0,-2,0); if perintah <> 0 then gambar(figur1); //for ax := 1 to 1000000 do application.processmessages; //a :=Sin(ax) + a; for lop:=1 to 100000000 do; // 19

procedure TForm1.BitBtn14Click(Sender: TObject); ok := false; close; procedure TForm1.FormDestroy(Sender: TObject); form2.free; end. 2. Tampilan Program 3. Analisa dan Kesimpulan 20