MERANCANG KOMPONEN GRADASI WARNA FORM
PADA BORLAND DELPHI Oleh: Ipin B. A. dan Carwoto*) Program aplikasi dengan beberapa form
yang warnanya sama, terkesan monoton.
sedangkan program aplikasi d.engan warna form jika pilihan warnanya tidak tepat,
berbeda-beda,
akan terlihat sangat kontras serta terkesan "semrawut", Untuk menghindari hal di atas dalam merancang aplikasi perlu menggunakan form dengan warna bergradasi.
Form dengan warna bergradasi sanggup memberi kesan artistik tertentu, sehingga dapat mengurangi kejenuhan pemakai aplikasi (user), Disamping itu, form dengan warna bergradasi bisa membimbing pandangan user ketika beralih
Gambar
l. Kotak Dialog Komponen Expert
dari form dengan wama tunggal tertentu ke form lain dengan warna tunggal lainnya sec ara
Sedangkan form default-nya tidak memiliki properti ini. oleh karena itu, untuk memberi
gradasi warna pada form, kita
harus
merancangnya sendiri.
Pada kesempatan ini, akan dibahas ana cara merancang komponen untuk memberi gradasi warna pada form. Komponen hasil rancangan ini dapat didaftarkan pada daftar Component Palette agar dapat secara praktis dipakai setiap kali dibutuhkan. bagaim
Perancangan Komponen Langkah pertama yang harus dilakukan
dalam merancang komponen adalah memilih
menu Eile I New I eomponentJetelah muncul kotak dialog seperti pada Gambar l, isilah kotak Qlass Name dengan nama komponen yang akan dibuat. Pada kotak Ancestor type, pilihlah konnponen dari mane kita akan meiiurunkaii komponen yang akan dibuat.
perlahan.
Ada komponen pada Component Palette Borland Delphi yang sudah memiliki properti
gradasi warna,
yaitu komponen
TChart.
Sebagai contoh, Pilihlah kotak Class Name dengan "TGradasi" dan Ancestor type dengan oTCustomPanel". Pada kotak palette t
') Ipin Bustanul AriJin, Carwolo,keduanya adalah mahasiswa Program Studi Teknik Elektro Fakultas Teknik Universitas Diponegoro, Semarang.
i{, ;
i 4,
ffi-^--!^-r
41
Komponen TGradasi
Page, pilihlah halaman dimana komponen akan
Kita
dapat memilih
sembarang diletakkan. halaman yang terdapat pada Component Palette seperti Standard, Data Access, Data Controls, dan
seterusnya. Dalam contoh
ini
komponen
diletakkan pada halaman "CLIcK".
Bila Kita mengklik button Create Unit, maka Delphi akan membuat kerangka unit untuk menuliskan kode-kode program. Untuk membuat komponen Gradasi Warna Form, ketikkan kode-
kode program seperti yang dapat dilihat listing GRADASI.PAS di bawah ini" "Procedure Register" seperti terlihat pada baris nomor 102105 akan otornatis dibuat setelah kita mengklik button Create Unit. Prosedur ini mendaftarkan kelas TGradasi ke Component Palette bagian ''CLIcK". Tanpa pendaftaran ini, komponen tersebut tidak akan muncul pada Component pada
yang
alTop, tinggi : I00, default warna awal: putih, dan default warna akhir: hitarn. Constructor pada program, seperti pada baris nomor 46 sampai dengan baris nomor 54, berfungsi untuk menset
properti-properti yang dibutuhkan sebagai kondisi default komponen TGradasi. Prosedur "TGradasi.Paint", berfungsi untuk mewarnai
komponen TGradasi dengan tingkat warna yang berubah dari warna awal hingga warna akhir. Sedangkan prosedur "TGradasi,WarnaKeRGB", untuk mengkonversi warna dari tipe TColor
menjadi warna prirner
(Red,Green,Blue).
Sebaliknya procedure "TGradasi.RcBkeWarna" untuk rnenggabungkan warna-warna primer menjadi tipe TColor Berikut adalah Iisting program GRADASI.PAS selengkapnya.
Palette.
Listing GRADASI.PAS 1
2 3 4
Pascal/I)elphi
- Turbo
: Gradasi Warna Form : GRADASI. PAS : 1998, CLIcK Software
/ /erogram
/ /vite / /copyright
House.
5 5 -l
I 9 1-0
l_1
uSes
L2
windows, Messages,
1_3
L4 L5 16 L7
pr j.vate
1B
FAwalwarna
19 20 2L 22
23
type
Tcradasi = class (TcustomPanel)
:
Tco1or;
FAkhirlilarna : TCoIori FonPaint : TNotifyEvent,
Procedure SetAwalwarna (Awai.walna:TColor),
Proceciure SeE.Akhirwarna (Akhlrwarna : TColor)
;
protected
26 21 28
Procedure Procedure
29
I
Sysutifs, Classes, Graphics, controls, Ilolms, Dialogs,
public Constructox Create (Aowner:Tconponent) i Overridei Destructor Destroyi Overridei
24 25
I
Extctrfs;
30 31 32 33 34
J5 36 37 38
Paint,
or,zerridei
WarnaKeRGB (Warna RcBKewarna (R,G, B:
:
Tcolor,'var
R, G, B:
Byte ) ,
Byte) :Tcoloft Eunction published Property Awalwarna : Tcolor Read EAwalwarna Write SetAwalwarnai Property Akhirwarna : Tcofor Read fAkhirwarna write SetAkbirwarna, Property OnPaint : TNotifyEvent Read EonPaint Write FonPaint, Property AIign,
Property BevelInner,' Property Bevelouteri Property BevelWidth; Property Borderstyle;
akan
dirancang ini berupa custom panel dengan align:
39 40
'Property BorderWidth;
end;
41"
42
procedure Register;
43 44 45
implementation
46
constructor TGradasi . create (Aowner: TComponent ) ;
47 48
49 50 s1 tro
JL
53 54 qq
56 57 58
Begin
Inherited Create (Aowner)
Align: =alTop; Height::100;
Procedure TGradasi . paint;
Var I
G2,82 : Byte;
R2,
Rx, Gx,
66 67 58 69 70 77 t/.
Begin
WarnaKeRGB ( FAwa1Warna, R1, GL, 81 ) ; WarnaKeRGB ( FAkhirWarna, R2, G2, 82 i
For f::0 To Height-L
Rx::Round(R1+ ( (I/ (Heighr-1) ) * (R2-R1) ) ); Gx::Round(G1+ (, lf / (Height-1) ) * (G2-G1t ) ); Bx::Round(81+ ( fi/ (Height-1)) * (F,2-e1)) ) ; Brush . Color : :RGBKeWarna ( Rx, Gx, Bx ) ; FillRect (Rect (0, f ,Wicith, Ii1)) ; End ;
77 78
79 80
;
Do
Begin
End;
6
Do
Begln
tq,
75
Bx : Integeri
With Inherited Canvas
?3
-t
: fnteger;
Rt, GL, B1 : Byte;
50 67 62 53 64
:
FAwalWarna: =cIWhi te; FAkhi rWarna : =e1 BI ack ; End;
59
6s
;
Contro1Style: =ControlStyle+ [ csReplicatable ] ;
If Assigned (FOnPalnt) Then
End;
Procedure TGradas i
Begin R:
.
FOnpainr-- (SeLf i ;
WarnaKeRGB
(
Wa
rna
: TCo 1 c
r ; Va r R, G, B : Byt
=Warna And $000000FF;
81 82 83 84 85
G::Warna And $0000pF.00 Shr
86
Begin
81 88
Result:= (R+G*$100+e*$10000) And
B: =Warna
End;
B;
And $00FF0000 Shr 16;
Function TGradasi.
RGBKewarna (R, G, B:
End,.
Byte) : TColor,.
$OOFFFFFF;
B9
90 91 92 93 94 95
96
Procedure TGradasi. setAwalwarna (Awalwarna: TColor)
Begin
fnvalidate; End;
Procedure TGradasi . SetAkhirWarna (Akhirwarna : TColor)
97 98 99
Begin
100 101
End;
ta2 103 LA4 10s 106
;
FAwalWarna : :Awa1V[arna,.
FAkhi rWarna I =Akhi rWa rna ;
fnvalidate;
procedure Register,.
begin
RegisterCcmponents (' CLfcK', ITGradasi ] ) ;
end;
Ke halaman berikutnya.
.
..
.
;
e);
Setelah menyelesaikan unit ini, kita dapat melakukan pengujian komponen tersebut. Kemudian mendaftarkannya ke ComPonent Palette. Carany&, pilih menu eomponent | [nstall ComPonent dan
isi kotak dialog Install
Component" selesai
Apabila Delphi telah
mengkompilasi ulang ComPonent Palette, kita dapat menggunakan
ini hanya pada mengklik mouse dengan komponen baru tersebut dan menempatkannya pada form yang sedang kita rancang. Berikut ini adalah contoh tampilan form saat komponen Gradasi Warna
perancangan setelah dibubuhi
komponen Gradasi Warna, dengan warna awal: clA7ile, warna akhir: clGre€n, dan align: alClient.
Gambar 1. Forml yang dibubuhi gradasi \Yarna dengan warna awalAqua dan warna akhir Green
Kemungkinan Pengembangan GRADASI.PAS Yang dibahas dalam tulisan ini adalah contoh yang sederhana, karena hanYa mamPu
membuat gradasi warna
dengan
perubahan
gradasr
secara lurus
vertikal.
Kita dapat mengembangkan komponen ini sendiri sesuai
keinginan. Misalny&, untuk membuat gradasi warna secara lurus horisontal, warna yang bergradasi dari suatu pusat lingkaran ke arah keliling lingkar&r, dari pusat bujur
sangkar bergradasi ke arah sisisisinya, atau gradasi untuk bentuk segi banyak yang lain. Selamat berkreasil
Daftar Pustaka
1.
2. 3.
Delphi 3 Help, Borland InternationalInc.,lgg7 Jogiyanto HM Teori dan Aplikasi Program Komputer bahasa Pascal Jilid I, cet.v, Andi Offset, Yogyakarta, t993 Pranata, A., Pemrograman Borland Delphi, penerbit ANDI, yogyakarta 1997
