Tutorial Pemograman VB 6.0: Merancang Sendiri Tampilan Aplikasi
Seringkali dalam membuat aplikasi dalam lingkungan Visual Basic,
kita sudah disuguhkan dengan bentuk jendela dengan tampilan yang sama.
Bagaimana kalau kita ingin membuat bentuk tampilan jendela sesuai dengan
selera kita ? Bisa, karena tutorial kali ini kita akan membuat suatu
bentuk jendela dengan TitleBar, tombol Minimize, Maximize dan Exit ala
sendiri dan sangat mudah sekaligus sederhana dalam pembuatannya. Sudah
tidak sabar ? Kalau begitu kita langsung saja ke langkah yang pertama
yaitu,
Buatlah form untuk merancang tampilan jendela aplikasi seperti
terlihat pada gambar 1. Kontrol-kontrol yang ditambahkan pada form
tersebut adalah :
- 1 buah Label
- 5 buah PictureBox
Ubahlah properti-properti dari kontrol-kontrol tersebut seperti tertera pada tabel 1.
Kontrol
|
Properti
|
Nilai
|
Label1 |
BackStyle |
0 - Transparent |
(Name) |
lblTitle |
Caption |
Jendela buatanku |
ForeColor |
&H00FFFFFF& |
Picture1 |
BackColor |
&H000080FF& |
BorderStyle |
0 - None |
Width |
6735 |
Height |
375 |
(Name) |
PicTitleBar |
Picture2 |
BackColor |
&H00008000& |
BorderStyle |
0 - None |
Width |
255 |
Height |
255 |
(Name) |
PicMinimize |
ToolTipText |
Minimize |
Picture3 |
BackColor |
&H00800000& |
BorderStyle |
0 - None |
Width |
255 |
Height |
255 |
(Name) |
PicMaximize |
ToolTipText |
Maximize |
Picture4 |
BackColor |
&H00000080& |
BorderStyle |
0 - None |
Width |
255 |
Height |
255 |
(Name) |
PicExit |
ToolTipText |
Exit |
Picture5 |
BackColor |
&H000080FF& |
BorderStyle |
0 - None |
Width |
6735 |
Height |
135 |
(Name) |
PicFootBar |
Form1 |
Caption |
JENDELA BUATANKU |
BorderStyle |
0 - None |
ShowInTaskbar |
True |
StartUpPosition |
2 - CenterScreen |
Width |
6720 |
Height |
4440 |
Tabel 1.
Sebagai keterangan, kotak-kotak kecil berwarna pada Form
masing-masing memiliki fungsi yang berbeda. Kotak berwarna hijau akan
diberi fungsi Minimize jendela, sebaliknya kotak berwarna biru akan kita
beri fungsi Maximize jendela , dan kemudian kotak berwarna merah
sebagai fungsi untuk menutup jendela atau exit. Sebagaimana jendela
aplikasi pada umumnya, jendela harus mudah dipindah-pindah yang bisanya
mendrag bagian TitleBar.
Maka pada PicTitleBar, kita akan memasukkan kode program yang dapat
menggeser jendela seperti yang tertera pada Listing 1. Sekarang buat
Module dan kemudian isi dengan kode program pada Listing 2 untuk
mendeklarasikan fungsi yang dibutuhkan untuk mendrag jendela. Pada
Listing 3 terdapat kode program untuk PicMinimize supaya ketika kita
klik kotak warna hijau , tampilan jendela dalam keadaan minimize.
Sekarang bagaimana mengatur tampilan menjadi Maximize ? Isi kode program
pada PicMaximize dan PicTitleBar seperti yang terlihat pada Listing 4 .
Untuk mengaktifkan Maximize kita perlu mengatur lebar dan tinggi
jendela baik dalam keadaan normal atau maximize seperti pada Listing 5.
Ukuran-ukuran yang ada pada Listing 5 hanya berlaku bila jendela yang
kita buat berada pada layar monitor yang berresolusi 1024x768 pixel. Di
luar resolusi itu hasil tampilan jendela akan terlihat berantakan. Maka
jika itu terjadi, kita dapat menyesuaikannya dengan mengatur kembali
nilai lebar dan tinggi jendela aplikasi yang kita buat.
Seperti kode program yang tertera pada Listing 5, kita mengatur agar
saat jendela dalam keadaan normal, ToolTip pada PicMaximize menampilkan
tulisan ”Maximize”. Saat tampilan dalam keadaan Maximize, ToolTip
menampilkan tulisan ”Restore Down”. Langkah yang terakhir, pada
PicExit kita memasukkan kode program yang berfungsi menutup aplikasi
seperti yang tertera pada Listing 6. Supaya tampilan lebih menarik lagi,
kita juga dapat mengimpor gambar pada setiap kontrol PictureBox.
Tutorial berikutnya kita akan mencoba memeberikan efek trasparan pada
jendela aplikasi yang kita buat. Selamat mencoba !!!
Listing 1
CODE:
-
Private Sub PicTitleBar_MouseDown(Button As Integer, Shift As Integer, X As Single, Y As Single)
-
‘Jika tampilan dalam keadaan Maximize, Jendela tidak akan pernah dapat digeser-geser
-
If Me.WindowState <> 2 Then
-
GeserJendela Me
-
End If
-
End Sub
Listing 2
CODE:
-
Public Declare Function SendMessage Lib "user32" Alias "SendMessageA" _
-
(ByVal hWnd As Long, ByVal wMsg As Long, ByVal wParam As Long, lparam _
-
As Any) As Long
-
Declare Sub ReleaseCapture Lib "user32" ()
-
-
Public Sub GeserJendela(TheForm As Form)
-
ReleaseCapture
-
Call SendMessage(TheForm.hWnd, &HA1, 2, 0&)
-
End Sub
Listing 3
CODE:
-
Private Sub PicMinimize_Click()
-
Me.WindowState = 1
-
Me.PicMinimize.BackColor = &H8000&
-
End Sub
Listing 4
CODE:
-
Private Sub PicMaximize_Click()
-
AksiMaximize
-
Me.PicMaximize.BackColor = &H800000
-
End Sub
-
-
Private Sub PicTitleBar_DblClick()
-
AksiMaximize
-
End Sub
-
-
Private Sub lblTitle_DblClick()
-
AksiMaximize
-
End Sub
-
-
Private Sub lblTitle_MouseDown(Button As Integer, Shift As Integer, X As Single, Y As Single)
-
geser
-
End Sub
Listing 5
CODE:
-
Sub AksiMaximize()
-
If Me.WindowState = 2 Then
-
Me.WindowState = 0
-
Me.PicMinimize.Left = 5640
-
Me.PicMaximize.Left = 6000
-
Me.PicExit.Left = 6360
-
Me.PicMaximize.ToolTipText = "Maximize"
-
Me.PicFootBar.Top = 4320
-
Else
-
Me.WindowState = 2
-
Me.PicTitleBar.Width = 15400
-
Me.PicMinimize.Left = 14200
-
Me.PicMaximize.Left = 14600
-
Me.PicExit.Left = 15000
-
Me.PicMaximize.ToolTipText = "Restore Down"
-
Me.PicFootBar.Width = 16000
-
Me.PicFootBar.Top = 11400
-
End If
-
End Sub
Listing 6
CODE:
-
Private Sub PicTitleBar_MouseMove(Button As Integer, Shift As Integer, X As Single, Y As Single)
-
Me.PicExit.BackColor = &H80&
-
Me.PicMaximize.BackColor = &H800000
-
Me.PicMinimize.BackColor = &H8000&
-
End Sub
-
-
Private Sub PicMaximize_MouseMove(Button As Integer, Shift As Integer, X As Single, Y As Single)
-
Me.PicMaximize.BackColor = &HFF0000
-
End Sub
-
-
Private Sub PicMinimize_MouseMove(Button As Integer, Shift As Integer, X As Single, Y As Single)
-
Me.PicMinimize.BackColor = &HFF00&
-
End Sub
Listing 7
CODE:
-
Private Sub PicExit_Click()
-
End
-
End Sub