Pertemuan 2 - Pemrograman Visual
Objek / Kontrol dan Form
Abdul Karim Syahputra, M.Kom
A.
Pengenalan Objek / Kontrol pada Visual Studio 2010
Objek / Kontrol merupakan suatu tampilan berbasis grafis yang ditempatkan ke form untuk
membuat interaksi dengan pemakai. Keberadaan kontrol di dalam form berubah menjadi objek yaitu
elemen perantara pemakai yang dapat diprogram untuk kebutuhan tertentu.
Toolbox merupakan tempat penyediaan kontrol-kontrol program yang digunakan untuk
mendesain aplikasi Windows Form.
Berikut ini adalah kategori dari Objek / Kontrol yang ada pada Visual Studio 2010:
1. Common Control, Berisi kontrol-kontrol untuk mendesain form berbasis windows.
2. Container, Digunakan untuk kontrol-kontrol lain pada form.
Gambar 2. Tampilan Menu Objek Container
3. Menu & Toolbars, Digunakan untuk mendesain menu utama dan submenu serta menu toolbar
dan statusbar.
Gambar 3. Tampilan Menu Objek Menu & Toolbar
4. Data, Berisi kontrol-kontrol untuk pemrograman database, baik untuk koneksi maupun
menampilkan data
Gambar 4. Tampilan Menu Objek Data
Gambar 5. Tampilan Menu Objek Components
6. Printing, Berisi kontrol-kontrol untuk mencetak data, baik ke printer maupun ke layar.
Gambar 6. Tampilan Menu Objek Printing
7. Dialog, Berisi kontrol-kontrol untuk menampilkan berbagai macam kotak dialog.
B.
Pengenalan Form
Form merupakan media interaksi antara pengguna dengan aplikasi yang anda buat. Form
terbagi ata dua kategori yaitu:
1. Form Dinamis
Yaitu form yang bisa dimanipulasi atau diubah bentuk serta disisipi objek kontrol yang
berisi perintah-perintah yang diperlukan oleh aplikasi yang akan anda buat.
Gambar 8. Tampilan Form
Form d iatas merupakan salah satu bentuk dari Windows Form yang digunakan untuk
menempatkan objek lain di atasnya dan ini masih bisa dimanipulasi bentuk dan objek
tampilannya.
2. Form Statis
Yaitu form yang tidak dapat dimanipulasi atau diubah bentuk serta disisipi objek kontrol,
form ini hanya dapat dipanggil dari perintah kode. Contohnya : Message Box
C.
Properties Objek dan Form
Properties merupakan informasi mengenai kontrol (obyek) yang dibuat, dan bertugas
menyiapkan segala bentuk dan kontrol yang diperlukan dalam perancangan user interface maupun
pemrograman.
Properties pada setiap objek berbeda-beda, itu karena setiap objek memiliki fungsi yang
berbeda-beda pula.
Lain halnya dengan Form, dan berikut ini adalah properties pada Form:
1) BackColor, Menentukan warna latar belakang (background) dari suatu kontrol (obyek).
2) BackgroundImage, Menentukan gambar untuk latar belakang suatu kontrol (obyek)
3) Opacity, Menentukan seberapa besar transparansi form saat program dieksekusi. Properti ini
hanya ada pada kontrol form.
4) Size, Menentukan ukuran dari kontrol, yang terdiri dari lebar kontrol (Width) dan tinggi
kontrol (Height)
5) StartPosition, Menentukan posisi form saat form tersebut di eksekusi. Pilihan yang disediakan
yaitu Manual, CenterScreen, WindowsDefaultLocation, WindowsDefaultBounds, dan
CenterParent.
6) TransparancyKey, Menerima atau menentukan warna yang menunjukkan bidang-bidang
transparan.
7) WindowState, Menentukan ukuran form saat form tersebut di eksekusi dengan pilihan
Manual, Minimized, dan Maximized.
String Collection Editor
Pada beberapa properties terdapat String Collection Editor yang dapat dilihat melalui
to bol titik seba yak tiga titik … pada properties
D.
Desain Form
Desain form dilakukan untuk merancang atau menyusun layout sebuah aplikasi sebelum
dilakukan pemberian coding. Hal ini bertujuan agar mempermudah dalam menghasilkan aplikasi yang
diinginkan.
Secara umum langkah pembuatan sebuah program pada Visual Basic .Net 2010 adalah:
Gambar 11. Langkah Pembuatan Program pada Visual Basic .Net 2010
Rancanglah Form seperti di bawah ini:
Gambar 12. Tampilan Desain Form Langkah 1:
Merancang model atau bentuk yang akan ditampilkan pada sebuah form.
Langkah 2:
Mengatur properties yang diperlukan pada objek (komponen) yang digunakan.
Langkah 3:
Mengisi kode programnya (coding) melalui event dan method.
Langkah 4:
Lalu aturlah propertiesnya, sebagai berikut:
No Objek Properti Nilai Properti
1 File Form3 File Name
Caranya:
Klik Form3 yang terdapat pada Solution Explorer, bukan pada Lembar Keja.
LatihanPertama.vb
2 Label1 Name :
NB:
Name, ini diperlukan untuk
pengodingan, dan tidak diperbolehkan menggunakan spasi dalam pemberian namanya.
lbl_nim
Label2 Name lbl_nama
Label3 Name lbl_jeniskelamin
Label4 Name lbl_alamat
Label5 Name lbl_kota
3 TextBox1 Name txt_nim
TextBox2 Name txt_nama
TextBox3 Name txt_jeniskelamin
TextBox4 Name
TextBox5 Name txt_kota
E.
Latihan
1.
Aplikasi Login (Latihan-2)
Buatlah Projek Visual Basic .Net 2010 yang baru pada Visual Studio 2010 dengan nama
Latihan-2 Aplikasi Login . Lalu desai For 1 ya seperti ga bar 13.
Gambar 13. Tampilan Menu Login
Adapun rincian properties masing-masing objek pada Form Login tersebut adalah sebagai
berikut:
No Objek Properti Nilai Properti
1 Form1 Name Login.vb
Text .:: LOGIN ::.
BackgroundImage
Caranya:
Klik ta da … ,
Kemudian pilih Import,
Cari Gambar
Klik OK
Ambil Gambar (BackGround) di Folder Bahan Ajar pada Komputer Anda Masing-masing.
StartPosition CenterScreen
Icon Ambil Gambar (BackGround) di
Caranya:
Klik ta da … ,
Kemudian pilih Import,
Cari Gambar (ekstensi .ico)
Klik OK
2 TextBox1 Name txt_username
3 ComboBox1 Name cmb_level
Text --- Pilih ----
Items
Caranya:
Klik ta da … ,
Ketikkan Itemnya
Klik OK
Tambahkan dua Item, yaitu: Administrator, dan User.
4 TextBox2 Name txt_password
5 Label1 Text Username
Kemudian pilih Import,
Cari Gambar
Klik OK
Ambil Gambar di Folder Bahan Ajar pada Komputer Anda Masing-masing dan sesuaikan dengan Desain di atas
ImageAlign MiddleLeft
9 Button2 Name btn_cancel
Text Cancel
Image Caranya:
Klik ta da … ,
Kemudian pilih Import,
Cari Gambar
Klik OK
Ambil Gambar di Folder Bahan Ajar pada Komputer Anda Masing-masing dan sesuaikan dengan Desain di atas
10 Button3 Name btn_exit
Text Exit
Image Caranya:
Klik ta da … ,
Kemudian pilih Import,
Cari Gambar
Klik OK
Ambil Gambar di Folder Bahan Ajar pada Komputer Anda Masing-masing dan sesuaikan dengan Desain di atas
ImageAlign MiddleLeft
2.
Aplikasi Jam (Latihan-3)
Gambar 14. Tampilan Aplikasi Fungsi Jam
3.
Aplikasi Data Mahasiswa (Latihan-4)
Gambar 16. Tampilan Aplikasi Data Mahasiwa