Tips Modifikasi ActiveX Control Default

Tips Modifikasi ActiveX Control Default

Tips & tutorial kali ini difokuskan pada modifikasi ActiveX Component alias control default yang ada pada Toolbox Visual Basic 6.0.
Disini kita akan fokus pada beberapa kontrol yang akan di ubah, diatur properties-nya agar tampil keren dan tidak kalah dengan tampilan control Aero di win XP, win Vista, win 7 atau win 8, diantaranya adalah:

1. Control Textbox
2. Control CommandButton
3. Control Frame
4. Control ComboBox/ ListBox
5. DriveListBox/ DirListBox

Ok, Let's start! 🔄

ad.1. Modifikasi Skin Control TextBox

Pertama-tama, ambil dan letakkan control Shape1 pada form, kemudian aturlah property control Shape tersebut sbb:
- Shape -> Rounded Rectangle
- BorderColor diubah warnanya yang hampir menyamai warna background control Form
- BackStyle atur ke Opaque.
- BackColor ubah ke warna background control Form

Selanjutnya, ambil control TextBox lalu letakkan diatas Shape tadi dan aturlah agar ukurannya (top,left dan width) simetris antara kiri dan kanan serta atas dan bawah agar pas ditengah-tengah.
Masih pada control Textbox, atur juga BorderStyle-nya ke None. Selanjutnya, atur warna Background TextBox sama dengan warna BackColor Shape atau Backgroundnya Form. Lalu, aturlah ukuran huruf, jenis hurufnya.
Selesai! sehingga tampak sbb:

Agar pada saat mouse melintasi textbox berubah warna bordernya, maka border shape saja yang kita atur. Misalnya kita ubah ke warna hitam ke-abu-abuan, atau dengan nilai BorderStylenya: &H00808080&
Scriptnya seperti berikut ini:

'*** bila mouse melintasi TextBox
Private Sub Text1_MouseMove(Button As Integer, Shift As Integer, X As Single, Y As Single)
Shape1.BorderColor = &H808080
End Sub

'*** bila mouse melintasi Form
Private Sub Form_MouseMove(Button As Integer, Shift As Integer, X As Single, Y As Single)
Shape1.BorderColor = &HFFC0C0
End Sub

ad.2. Modifikasi Skin DirListBox, DriveListBox dan ComboBox

Well, yang satu ini agak sulit, tapi kita harus coba! yes! Simak tips berikut ini!
Pertama-tama, copy dan paste hasil modifikasi TextBox diatas, kemudian gambarlah panah kebawah yang kecil dan gunakan MS.Paint untuk membuatnya. Selanjutnya, ambil Image1 pada toolbox dan browse file image panah kebawah tadi dan letakkan disisi textbox+shape. Lalu, kembali atur BorderStyle TextBox ke None lagi. Sehingga menjadi seperti ini! (lihat! arrow pas diatur disamping textbox)

Kemudian, ambillah control ListBox pada toolbox dan letakkan tepat dibawah control TextBox seperti ilustrasi berikut ini!

Selanjutnya, kita masuk ke bagian scripting alias kodenya, sbb:

'*** Mengidentifikasi kemungkinan jumlah Drive yang ada.
Sub DRIVE_LISTBOX()
List1.AddItem "C:"
List1.AddItem "D:"
List1.AddItem "E:"
List1.AddItem "F:"
End Sub

Private Sub Form_Load()
DRIVE_LISTBOX
List1.Visible = False
'Drive1.Visible = False
End Sub

'*** saat image panah di-klik
Private Sub Image1_Click()
List1.Visible = True
End Sub

'*** saat ListBox di klik user
Private Sub List1_Click()
On Error GoTo ErrPesan
If List1.Text = "C:" Then
        Drive1.Drive = "C:"
        List1.Visible = False
        Text2.Text = "C:"
ElseIf List1.Text = "D:" Then
        Drive1.Drive = "D:"
        List1.Visible = False
        Text2.Text = "D:"
ElseIf List1.Text = "E:" Then
        Drive1.Drive = "E:"
        List1.Visible = False
        Text2.Text = "E:"
ElseIf List1.Text = "F:" Then
        Drive1.Drive = "F:"
        List1.Visible = False
        Text2.Text = "F:"
End If
Exit Sub
ErrPesan:
MsgBox "Drive " & List1.Text & " Tidak Dapat Diakses atau Tidak Ada!", vbCritical, " Error Drive/Not Ready"
List1.Visible = False
Text2.Text = ""
Text2.SetFocus
End Sub

Selesai! :D. Pada dasarnya modifikasi atas DirListBox dan ComboBox sama persis seperti memodifikasi control DriveListBox. Kerapian image, ketepatan lebar, tinggi dan kerapatan antar control sangat penting, agar tidak nampak janggal atau malah kelihatan aneh. Disini penulis hanya memberi ilustrasi semata untuk para programmer visual basic 6.0 lebih baik lagi.

ad.2. Modifikasi Skin CommandButton

Untuk memodifikasi CommandButton kita membutuhkan 2 buah image yang bergambar button plus Caption button tersebut. Disini penulis mengambil image seperti ilustrasi berikut ini!

Image Button-1:




Image Button-2:



kemudian, letakkan kedua image dengan pengaturan sebagai berikut:

• Ukuran width, height, left dan top disamakan antara image 1 dan 2
• Letakkan image button tersebut yang akan tampil pertama dan teratas,dengan skenario sbb:
• Pertama, tampil image teratas.
• Bila user mengklik (tahan seperempat detik) atau posisi image masih ditekan oleh mouse (baca: MouseDown), maka segera akan muncul image button-2 dan yang pertama-teratas tadi di-hidden atau visible=false.
• Saat user melepas tahan-klik mouse, maka image button-2 hidden dan tampil kembali image button-1.

Dalam skenario tersebut, ini berarti bahwa eksekusi klik terletak pada Image Button-1, sehingga fokus kode eksekusi ada pada Image Button-1.

Kodenya sbb:

Private Sub imageButton1_MouseDown(Button As Integer, Shift As Integer, X As Single, Y As Single)
imageButton2.Visible = True
imageButton1.Visible = False
End Sub

Private Sub imageButton1_MouseUp(Button As Integer, Shift As Integer, X As Single, Y As Single)
imageButton2.Visible = False
imageButton1.Visible = True
'*** letakkan eksekusi dibawah ini, misalnya dalam bentuk MsgBox
MsgBox "Hallo!"
End Sub

Contoh hasilnya: