bab i pemrograman berbasis gui (graphical user...

79
1 BAB I PEMROGRAMAN BERBASIS GUI (Graphical User Interface) Tujuan Pada Akhir perkuliahan ini, diharapkan mahasiswa memiliki kemampuan sebagai berikut : Mengerti Konsep pemrograman berbasis GUI Menjelaskan konsep Pemrograman GUI 1.1. GUI Pengertian GUI adalah Graphical User Interface dalam dunia komputer. Pada komputer terdapat GUI atau antarmuka pengguna secara grafis. Istilah ini bukan hal yang lumrah pada saat awal kemunculan komputer. Namun setelah komputer generasi keempat mulai diciptakan, munculnya televisi berwarna (yang mendorong pada penciptaan layar monitor berwarna) serta evolusi pada perangkat penampil gambar (graphic adapter atau graphic card atau video card) membuat komputer mulai mendapatkan suatu sistem baru. 1.2. Visual Basic Visual Basic adalah bahasa pemprograman windows yang berbasis grafis (GUI-Graphical User Interface). Sifat bahasa pemprogramannya adalah eventdriven, artinya program akan terjadi jika ada respon dari pemakai berupa event/kejadian tertentu (tombol diklik, mouse ditekan dan lain-lain). Saat event terjadi maka kode yang berhubungan dengan event akan dijalankan. Dalam Visual Basic, pembuatan aplikasi dimulai dengan memperkirakan kebutuhan, merancang tampilan dan selanjutnya diikuti dengan pembuatan kode untuk program tersebut. Pada bagian ini akan dijelaskan tentang pengenalan program Visual Basic dalam pembuatan aplikasi Windows. Menjalankan program Visual Basic sama dengan menjalankan program windows lainnya, yaitu dengan mengklik ganda icon yang digunakan untuk menjalankan program.

Upload: lamhanh

Post on 24-Apr-2018

220 views

Category:

Documents


2 download

TRANSCRIPT

Page 1: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

1

BAB I PEMROGRAMAN BERBASIS GUI

(Graphical User Interface)

Tujuan

Pada Akhir perkuliahan ini, diharapkan mahasiswa memiliki kemampuan

sebagai berikut :

Mengerti Konsep pemrograman berbasis GUI

Menjelaskan konsep Pemrograman GUI

1.1. GUI

Pengertian GUI adalah Graphical User Interface dalam dunia komputer.

Pada komputer terdapat GUI atau antarmuka pengguna secara grafis. Istilah ini

bukan hal yang lumrah pada saat awal kemunculan komputer. Namun setelah

komputer generasi keempat mulai diciptakan, munculnya televisi berwarna (yang

mendorong pada penciptaan layar monitor berwarna) serta evolusi pada perangkat

penampil gambar (graphic adapter atau graphic card atau video card) membuat

komputer mulai mendapatkan suatu sistem baru.

1.2. Visual Basic

Visual Basic adalah bahasa pemprograman windows yang berbasis grafis

(GUI-Graphical User Interface). Sifat bahasa pemprogramannya adalah

eventdriven, artinya program akan terjadi jika ada respon dari pemakai berupa

event/kejadian tertentu (tombol diklik, mouse ditekan dan lain-lain). Saat event

terjadi maka kode yang berhubungan dengan event akan dijalankan.

Dalam Visual Basic, pembuatan aplikasi dimulai dengan memperkirakan

kebutuhan, merancang tampilan dan selanjutnya diikuti dengan pembuatan kode

untuk program tersebut.

Pada bagian ini akan dijelaskan tentang pengenalan program Visual Basic

dalam pembuatan aplikasi Windows. Menjalankan program Visual Basic sama

dengan menjalankan program windows lainnya, yaitu dengan mengklik ganda

icon yang digunakan untuk menjalankan program.

Page 2: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

2

Langkah-langkah untuk memulai Visual Studio 2010 adalah :

1. Start menu – Visual studio 2010 – Visual Studio 2010 (gambar 1.1)

2. New Project – Windows Form Application – OK (gambar1.2)

Gambar 1. 1 Ruang Kerja Visual Studio 2010

Page 3: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

3

Gambar 1. 2 Jenis-jenis aplikas yang didukung

Ruang kerja Visual Studio terdiri dari beberapa bagian seperti yang

tampak pada gambar 1.3. Berikut penjelasan dari ruang kerja VS 2010 :

Gambar 1. 3 Ruang Kerja Visual Studio

Page 4: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

4

Ruang Keterangan

Toolbox menu Berisikan komponen-komponen yang dimiliki

VS 2010 secara umum. Jika ingin memberikan

komponen khusus, kita tinggal menambahkan

dengan cara add reference/ add component

Solution explorer Solution explorer digunakan untuk berpindah

project maupun form yang sedang aktif dibuka.

Solution explorer juga digunakan untuk

mengkompilasi project.

Propertise/ Event Pada menu ini berisikan tentang propertise

maupun event dari sebuah form/ komponen

yang terpilih. Kunci utama dari pemrograman

GUI berada disini. Bagaimana kita mengatur

propertis ataupun even tdari komponen

maupun form yangsesuai dengan kebutuhan

kita

Working window Jendela kerja disini adalah pallete/kanvas dari

sebuah form yang akan kita buat menjadi

sebuah aplikasi. Pada jendela ini, kita dapat

berpindah-pindah antara jendela desain dengan

jendela kode.

1.2.1. Propertis

Pemrograman GUI secara garis besar akan selalu berhubungan dengan

propertis. Pengertian dari propertis didalam GUI adalah atribut yang dimiliki oleh

sebuah objek. Objek disini bisa sebuah komponen maupun form. Setiap

komponen memliki atribut/ propertis yang berbeda. Misalkan kita punya objek

manusia, maka atribut yang dimiliki adalah nama,tanggal lahir dsb. Untuk

komponen form beberapa atribut yang sering digunakan adalah name, backcolor,

text dsb. Kita dapat merubah atribut tersebut secara langsung ataupun pada saat

tertentu. Kita juga dapat mengambil nilai dari atribut tersebut jika kita butuhkan.

Page 5: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

5

1.2.2. Event

Pengertian dari event didalam GUI adalah kejadian atau peristiwa. Setiap

form maupun komponen didalam Visual Studio memliki event. Seperti halnya

sebuah objek yang memiliki peristiwa. Misalkan peristiwa yang terjadi terhadap

objek manusia adalah makan, terlahir, bergerak dsb. Seperti halnya sebuah form

didalam visual studio, event yang dimilikinya antara lain Load, close, click dan

masih banyak lagi.

Gambar 1. 4 Propertis dan event sebuah form

Bekerja dengan VS 2010 sangatlah mudah, karena komponen – komponen

yang kita butuhkan sudah tersedia dengan lengkap dan bagus. Berikut adalah cara

membuat aplikasi sederhana di VS 2010 :

1. Buat project baru dan beri nama dengan Latihan1.sln

2. Berikutnya akan muncul jendela kerja seperti gambar 1.3.

3. Aturan dalam pemrograman adalah, pastikan setiap komponen maupun

form sesuai dengan fungsinya. Secara langsung ketika kita membuat

project baru maka project tersebut sudah membuatkan 1 buah form

dengan nama form1. Karena nama tersebut tidak sesuai dengan aturan

pemrograman maka ada baiknya kita segera merubahnya dengan cara

klik kanan pada formnya dan pilih rename – namakan menjadi

Page 6: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

6

frm_latihan1.vb – dan pilih yes (untuk penamaan form hindari

penggunaan karakter khusus seperti spasi,#,$).

4. Ubah warna form menjadi biru dengan cara pilih form – propertise –

backcolor – blue

Gambar 1. 5 Memberi nama form

Gambar 1. 6 Merubah Warna Form

Page 7: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

7

5. Setelah berhasil mengubah warna form, selanjutnya kita akan bekerja

dengan event dari sebuah form. Misalkan kita ingin merubah warna

form dari biru menjadi merah pada saat form dijalankan (load) maka

kita cukup merubah propertis backcolor menjadi merah pada saat event

load

6. Langkah-langkahnya adalah pilih form-rubah propertis window

menjadi event-dan klik 2 kali pada event load sehingga muncul jendela

kode.

7. Didalam event load form tersebut ketikkan propertis backcolor form

menjadi warna merah

8. Selanjutnya tekan tombol run atau tekan F5 untuk menjalankan

aplikasi. Maka akan terlihat warna form berubah menjadi merah pada

saat dijalankan/ ditampilkan

Gambar 1. 7 event pada form

Page 8: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

8

Gambar 1. 8 Kode untuk merubah form

Gambar 1. 9 Hasil eksekusi Latihan 1

Tugas :

1. Buatlah project baru dan beri nana dengan Programku

2. Ubah propertis dari form :

a. nama form menjadi frm_program

b. text form menjadi “Latihan Pertamaku”

3. Buatlah event click form untuk mengubah text menjadi “POLINEMA”

Page 9: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

9

BAB II VARIABEL DAN TIPE DATA

Tujuan

Pada Akhir perkuliahan ini, diharapkan mahasiswa memiliki kemampuan

sebagai berikut :

Memahami kegunaan Variabel

Memahami tipe data variabel

2.1. Variabel

Setiap bahasa pemrograman pasti memiliki variabel. Variabel

dipergunakan untuk menyimpan nilai. Setiap data yang disimpan didalam aplikasi

pasti menggunakan variabel, dan nilai dari variabel dapat berubah-ubah selama

aplikasi berjalan.misalkan kita menyimpan sebuah nilai di variabel A dan nilai

satunya di variabel B maka nilai dari masing-masing variabel pasti berbeda.

Untuk membuat / mendeklarisikan variabel di VS 2010 perintahnya

menggunakan “DIM nama_var AS tipe data”. Variabel didalam Visual studio

memiliki 2 jenis yaitu variabel lokal dan variabel global.

Aturan-aturan dalam penamaan sebuah variable yaitu :

O Tidak boleh lebih dari 255 karakter

O Nama harus unik tidak boleh menggunakan kata yang sudah digunakan

dalam visual basic, seperti dim, procedure, dll.

O Tidak boleh menggunakan spasi atau tanda titik/dot (.) diantara kata jika

nama variabel lebih dari satu kata

O Harus dimulai dari huruf , bukan angka atau karakter lainnya

2.1.1. Variabel Lokal

Variabel lokal adalah suatu variabel yang berada didalam suatu blok

program dan variabel ini hanya dikenal di dalam blok itu saja. Walau ada variabel

Page 10: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

10

dengan nama sama tetapi sudah berbeda blok maka variabel tersebut sudah pasti

berbeda.contoh :

Sub variabel_1

DIM int_a AS integer = 10

DIM str_b AS string = “Polteknik Negeri malang”

End sub

Sub variabel_2

DIM int_a AS integer = 90

DIM str_b AS string = “POLINEMA”

End sub

Keterangan :

Pada blok variabel_1 terdapat dua buah variabel yaitu int_a dan str_b,

begitu pula dengan blok program variabel_2. Walaupun didalam blok-blok

tersebut terdapat 2 buah variabel dengan nama sama, tetapi variabel didalam blok-

blok tersebut tidaklah sama nilainya. Karena int_a didalam blok variabel_1 hanya

bisa diakses oleh blok variabel_1. Diluar blok itu variabel int_a tidak dapat

dikenali karena variabel tersebut bersifat lokal.

Nilai yang dimiliki variabel hanya ada pada saat blok program tersebut

dieksekusi. Setelah selesai nilai yang ada akan dihapus dan tidak dapat

dipergunakan lagi.

2.1.2. Variabel global

Variabel global adalah suatu variabel yang berada didalam suatu kelas

maupun modul. Variabel ini bisa dikenali oleh semua blok maupun form. Nilai

yang dimiliki variabel akan tetap ada selama aplikasi tetap berjalan. Sehingga kita

harus berhati-hati dalam penggunaan variabel jenis ini. Jika kita tidak memilah-

Page 11: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

11

milah dengan baik maka resource dari memori juga akan besar sehingga

mempengaruhi performa dari aplikasi.

DIM int_a AS integer

DIM str_b AS string

Sub variabel_1

int_a = 10

End sub

Sub variabel_2

Write int_a

End sub

Keterangan :

Terdapat dua buah variabel yaitu int_a dan str_b diluar blok program,

didalam blok-blok tersebut masing-masing menggunakan variabel int_a,blok

variabel_1 memberikan nilai sedangkan blok variabel_2 menulis nilai. Maka

apapun nilai yang diberikan diblok variabel_1 akan dicetak

didalamblokvariabel_a. Nilai yang dimiliki variabel ini akan tetap ada selama

aplikasi masih berjalan.

2.2. Tipe Data

Setiap variabel dalam VS 2010 pasti memiliki tipe data. Tipe data

menentukan jenis dari suatu variabel. Tipe data juaga mempengaruhi alokasi

memori yang dipergunakan oleh sebuah variabel. Berikut adalah beberapa jenis

tipe data yang didukung oleh VS 2010 :

Nama Keterangan

1. Integer Integar merupakan tipe data numerik yang berupa bilangan

bulat dan mempunyai kisaran antara – 32.768 s.d 32.767

2. Byte Byte merupakan tipe data yang berupa nilai bulat positif, dan

mempunyai kisaran antara 0 s.d 255.

Page 12: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

12

Nama Keterangan

3. Decimal Decimal merupakan tipe data yang digunakan untuk

menyimpan nilai desimal dan mempunyai ketepatan hingga 28

angka decimal.

4. Boolean Boolean merupakan tipe data yang hanya memiliki dua buah

nilai yaitu nilai benar (true) dan nilai salah (false).

5. String String merupakan tipe data yang memiliki nilai yang termasuk

dalam kategori alfanumerik. Dalam visual basic karakteristik

dari tipe data sting ini ditulis diantara tanda kutip (“”).

6. Singgle Singgle merupakan tipe data yang memiliki kissaran antara –

3.402823e+38 s.d 3.402823e+38.

7. Double Double merupakan tipe data yang memiliki kisaran antara –

1.7976931348622E+308 s.d – 1.7976931348622E +308.

8. Date Date merupakan tipe data yang digunakan untuk menyimpan

nilai tanggal, bulan, dan tahun. Kisaran tipe data ini antara 1

januari 100 s.d 31 Desember 9999

9. Currency Currency merupakan tipe data yang digunakan untuk

menyimpan nilai uang baik dalam bentuk dolar maupun

sejenisnya. Kisaran tipe data ini adalah

922.337.203.685.477,5808 s.d 922.337.203.685.477,5807.

10. Long Long merupakan tipe data yang memiliki kisaran antara –

2.147.483.648 s.d 2.147.483.648. tipe data ini sebenarnya tidak

jauh berbeda dengan data tipe integar, tetapi perbedaannya

terletak pada nilai kisaranya.

11. Object Tipe data object merupakan tipe data yang mampu menyimpan

object seperti object form, kontrol dan sebagainya.

12. Variant Variant merupakan tipe data yang akan menyesuaikan dengan

kebutuhan nilainya. Jika sebuah variabel tidak dideklarasikan

tipe datanya maka secara otomatis visual basic akan

mendeklarasikan variabel tersebut dengan tipe data variant.

Page 13: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

13

2.3. Konstanta

Konstanta adalah variabel yang memiliki nilai tetap, sekali variabel

konstanta diberi nilai maka selama proses program berjalan nilai konstanta tidak

akan berubah. Konstanta biasanya digunakan untuk menyimpan nilai-nilai tertentu

yang bersifat tetap sepert nilai grafitasi bumi, Fi, dan tetapan-tetapan dalam rumus

fisika atau matematika lainnya.

Cara pendeklarasian sebuah konstanta sama halnya dengan variabel,

pendeklarasian konstanta data dilakukan secara private maupun public. Deklarasi

konstanta dengan menggunakan perintah “CONST nama_const AS tipe data”

2.4. Latihan

Untuk memahami variabel dan konstanta, buatlah project baru dan beri

nama dengan latihan2, kemudian tambahkan beberapa komponen :

Tambahkan dua buah textbox dan masing-masing diberi nama

int_angka1 dan int_angka2

Tambahkan 1 buah label dan beri nama lbl_hasil

Tambahkan satu buah button dan beri nama dengan btn_proses

Ganti nama form dengan frm_latihan2

Buat perhitungan di event click btn_proses

Gambar 2. 1 form latihan 2

Page 14: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

14

Gambar 2. 2 Kode program event click btn_proses

Keterangan pada gambar2.2 adalah :

1. Deklarasi variabel a,b,hasil dengan tipe data integer

2. Memindahkan nilai dari textbox kedalam variabel. karena nilai

yang berasal dari textbox bertipe string, maka harus dilakukan

konveri nilai. Perintah untuk konversi nilai adalah val(nilai).

3. Melakukan operasi penjumlahan dari variabel a dan b, hasil

penjumlahan ditampung oleh variabel hasil

4. Menampilkan nilai dari variabel hasil ke dalam lbl_hasil dan

dilakukan konversi integer ke string dengan perintah toString()

Gambar 2. 3 Hasil eksekusi latihan2

Page 15: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

15

Tugas :

1. Buat project baru dan beri nama dengan tugas2

2. Ganti nama form dengan frm_tugas2

3. Buatlah sebuah form isian data mahasiswa yang terdiri dari komponen-

komponen berikut :

a. Nama : textbox

b. Tgl lahir : datetimepicker

c. Alamat : textbox (multiline)

d. Jk : radiobutton

e. Hobi : checkbox

f. Asal sekolah (listbox) – SMU/SMK/MA

g. Anak ke :combobox

Page 16: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

16

BAB III KONDISI DAN PERULANGAN

Tujuan

Pada Akhir perkuliahan ini, diharapkan mahasiswa memiliki kemampuan

sebagai berikut :

Memahami kegunaan kondisi

Memahami kegunaan perulangan

3.1. Kondisi

Kondisi didalam pemrograman juga dikenal sebagai percabangan. Yaitu

ketika suatu aplikasi dihadapkan oleh beberapa alternatif pilihan yang disesuaikan

dengan kebutuhan. Kondisi tidak bisa dihindari dalam pemrograman, dikarenakan

setiap aplikasi pasti akan menghadapi pilihan-pilihan.

Secara umum kondisi di VS 2010 bisa menggunakan 2 cara yaitu

IF..ELSE dan CASE..WHEN.

3.1.1. If...Then...Else Statement

Struktur dari kondisi ini terbagi menjadi 2 dua jenis yaitu multiple

statement dan single statement.

- Struktur Multiple statement

Multiple-line syntax:

If condition [ Then ]

[ statements ]

[ ElseIf elseifcondition [ Then ]

[ elseifstatements ] ]

[ Else

[ elsestatements ] ]

End If

Contoh :

Page 17: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

17

Dari kondisi diatas, maka aplikasi akan menampilkan pesan

“There are no items”

- Single-line syntax:

Struktur dari Single line adalah :

If condition Then [ statements ]

[ Else [ elsestatements ] ]

Contoh penggunaannya adalah :

3.1.2. Select...Case Statement

Penggunaan select case memiliki struktur lebih sederhana, berikut adalah

struktur dari kondisi tersebut :

Select [ Case ] testexpression

[ Case expressionlist [ statements ] ]

[ Case Else [ elsestatements ] ]

End Select

Berikut contoh penggunaan kondisi tersebut :

Page 18: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

18

Hasil dari kondisi tersebut adalah :

“Between 6 and 8, inclusive”

3.2. Perulangan

Perulangan merupakan salah satu peralatan yang sangat berguna didalam

pemrograman. Sama halnya seperti kondisi, setiap pemrograman hampir bisa

dipastikan pasti mempergunakan perulangan. Karena pentingnya perulangan,

maka materi ini diharapkan bisa dipahami sebaik mungkin. Dan apabila masih

belum dipahami, pelajarilah berulang-ulang sampai bisa dipahami.

Selain itu, perulangan juga bisa dipakai untuk meringkas penulisanbaris

program. Bisa anda bayangkan jika anda harus menulis sesuatu yang sama

berulang-ulang dan itu dikerjakan secara manual, pasti sunggu sangat merepotkan.

Apalagi jika ada perubahan, maka kita juga harus melakukan perubahan sebanyak

yang kita tulis.

Secara umum ada beberapa metode perulangan di VS 2010. Metode –

metode tersebut adalah :

3.2.1. For...Next Statement

Secara struktural, penggunaan for..next sangatlah terstruktur. Penggunaan

for..next terstruktur dikarenakan diawal sudah ditentukan nilai awal dan nilai

akhirnya sehingga program hampir tidak mungkin terjebak didalam perulangan

yang tiada akhir.

Karena sifatnya yang sudah terstruktur, dan hanya bisa menangani

perulangan dengan suatu nilai pasti menyebabkan perulangan for..next tidak

sebebas perulangan yang lainnya. Berikut adalah kerangka perulangan for..next :

Page 19: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

19

Berikut contoh penggunaan perulangan dengan menggunakan for..next :

Perulangan tersebut akan menghasilkan angka dari 1 sampai dengan 5.

Penambahan dari perulangan tersebut secara langsung diberi nilai 1. Kenapa

diberi nilai 1 karena jika kita tidak memberi nilai terhadap step, maka kenaikan

nilainya adalah 1.

Berikut adalah contoh perulngan dengan menggunakan step :

Perulangan tersebut akan menghasilkan angka 2 sampai dengan 0 dan

jarak antara angkanya adalah 0.25. Didalam step menggunakan angka minus, itu

menandakan perulangan dimulai dari angka besar ke kecil.

Coba perhatikan perulangan dibawah ini. Perulangan jenis ini biasa

disebut dengan perulangan bersarang atau nested loop. Perulangan seperti ini

biasa dipergunakan untuk mengakses data yang memiliki baris dan kolom.

Page 20: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

20

Baris program tersebut akan menghasilkan Sebuah matrik 3x5

seperti ini :

3.2.2. While...End While Statement VS Do..Loop While Statement

Perulangan selanjutnya adalah perulangan yang tidak memiliki ketentuan

akan penambahan/ pengurangan serta tidak memiliki nilai awal. Secara umum

perulangan ini dibagi menjadi dua jenis.

- While...End While

Perulangan jenis ini memiliki struktur pengujian yang dilakukan

diawal perulangan. Jadi jika suatu kondisi tidak terpenuhi, maka

perulangan yang berada didalamnya tidak akan pernah diproses sama

sekali. Berikut adalah struktur dari perulangan tersebut.

- Do..Loop While

Perulangan jenis ini memiliki struktur pengujian yang dilakukan

diakhir perulangan. Jadi perulangan yang berada didalamnya pasti

dijalankan minimal 1 kali. Berikut adalah struktur dari perulangan

tersebut.

Berikut adalah contoh perulangan dengan menggunakan While...End

While :

Page 21: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

21

Perhatikan program diatas. Pemberian nilai awal, dilakukan diluar

perulangan dan pemberian penambahan maupun pengurangan dilakukan dengan

cara tradisional. Jika hal ini tidak dilakukan VS 2010 tidak akan menampilkan

pesan kesalahan dan tetap bisa dijalankan secara normal.

Coba perhatikan baris program berikut ini :

Pengertian dari continue while diatas adalah. Baris program akan kembali

ke awal perulangan dan mengakibatkan perintah dibawah continue tidak

dijalankan. Sedangkan pengertian dari exit adalah walaupun perulangan baru

Page 22: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

22

berhenti di nilai 100000 tapi jika ada perintah exit while maka perulangan akan

langsung dihentikan.

3.3. Latihan Kondisi

Buatlah sebuah project baru dan beri nama dengan latihan_kondisi. Susun

tampilan form seperti dibawah ini :

Gambar 3. 1. Gambar Form tarif PLN

Ubahlah propertis dari form dan komponen dengan :

Nama Propertis Nilai

Form Name

Text

Frm_kasir

Tarif PLN

Label1 Name

Text

Lbl_golongan

Golongan :

Label2 Name

Text

Lbl_Pemakaian

Pemakaian :

Label3 Name

Text

Lbl_hasil

kosong

Combobox1 Name

Items

Cmb_gol

Gol 1

Gol 2

Gol 3

Textbox1 Name int_pakai

Button1 Name

Text

btn_proses

proses

Page 23: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

23

Aturan dari aplikasi ini adalah mengenai perhitungan tarif PLN. Aturan

perhitungannya adalah sebagai berikut :

Pemakaian

Gol

0-100 101 -200 >200

Gol1 150 250 350

Gol2 250 350 450

Gol3 350 450 550

Contoh perhitungan: Misalkan saya adalah Golongan 2 dan pemakaian

saya adalah 255, maka total yang harus dibayarkan adalah :

100 x 250 = 25000 -> tarif untuk 100 pertama

100 x 350 = 35000 -> tarif untuk 100 kedua

55 x 450 = 24750 + -> tarif untuk lebih dari 200

84750 -> total yang harus dibayarkan.

Maka untuk membuat programnya adalah kita melakukan perhitungan pada event

click dari btn_proses.

Page 24: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

24

Berikut adalah hasil dari aplikasi yang dijalankan :

Gambar 3. 2 Hasil Form Tarif

3.4. Latihan Perulangan

Buatlah project baru dan beri nama dengan lat_perulangan kemudian

desain form seperti gambar dibawah ini :

Ubahlah propertis dari form dan komponen dengan :

Nama Propertis Nilai

Page 25: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

25

Form Name

Text

Frm_perulangan

Latihan perulangan

Listbox1 Name Lbx_hasil

Button1 Name

Text

btn_proses

PROSES

Ketiklah baris kode dibawah ini didalam event click dari btn_proses

Baris kode diatas adalah baris kode program yang akan mencetak kata

“POLINEMA” sebanyak lima kali. Jika aplikasi tersebut dijalankan maka akan

menghasilkan :

Dari konsep diatas anda dapat ambil kesimpulan, bahwa untuk menulis

polinema saya tidak perlu membuat perintah tulis sebanyak lima kali. Selanjutnya

kita kembangkan aplikasi diatas dengan menambahkan satu buah tombol. Berikut

propertisnya :

Nama Propertis Nilai

Button2 Name btn_proses2

Page 26: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

26

Text PROSES LAGI

Kemudian tambahkan kode program berikut ini :

Berikut adalah penjelasan dari kode program diatas :

1. Mendeklarasikan variabel hasil dengan tipe data String dan diberi nilai

kosong (“”)

2. Membuat perulangan dengan mendeklarasikan variabel baris bertipe data

integer dan diberi nilai awal 1 dan nilai akhir 5

3. Membuat perulangan dengan mendeklarasikan variabel kolom bertipe data

integer dan diberi nilai awal 1 dan nilai akhir adalah baris. Kenapa baris?..

Jadi pada saat baris bernilai 1 maka nilai akhirnya dalah 1, sampai nilai

baris bernilai 5 maka nilai akhir dari kolom juga 5

4. Variabel hasil yang tadinya kosong di gabungkan dengan nilai dari kolom,

sehingga akan menghasilkan angka yang berurutan

5. Menyisipkan item dari listbox dengan nilai hasil

6. Mengosongkan nilai dari hasil

Berikut adalah hasil eksekusi dari aplikasi tersebut

Page 27: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

27

Gambar 3. 3 hasil eksekusi perulangan

Tampak sebuah pola yang bagus, nah coba modifikasi baris kode tersebut

dan tambahkan dengan baris kode berikut :

Dengan ditambahkan baris kode baru, maka aplikasi anda akan

mengeluarkan pola yang berlainan lagi.berikut hasilnya :

Page 28: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

28

Gambar 3. 4. pola baru setelah ditambahkan perulangan

Coba kita buat pola yang lebih menantang. Tambahkan sebuah tombol,

dan ubahlah propertisnya menjadi berikut :

Nama Propertis Nilai

Button3 Name

Text

btn_proses3

PROSES POLA

Tambahkan kode berikut didalamevent click dari btn_proses3 :

Page 29: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

29

Berikut penjelasan dari kode program diatas :

1. Kita menambahkan spasi sebagai pemisah antar karakter. Misalkan

saya memiliki perintah space(2) maka hasil dari perintah tersebut

adalah pemberian spasi sebanyak 2 ketukan.

2. Penggunaan tanda “ : ” adalah untuk penggabungan beberapa baris

kode menjadi 1 baris kode.

Berikut adalah hasil eksekusi dari kode program diatas :

Gambar 3. 5 Hasil eksekusi tombol PROSES POLA

Bagaimana? Cukup menarik bukan? Nah untuk latihan dirumah, cobalah

buat sebuah pola yang bisa menghasilkan pola sebagai berikut

Page 30: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

30

Tugas

Gambar 3. 6 Pola latihan

Untuk membuat pola tersebut, tambahkan sebuah tombol dan berikan

propertis sebagai berikut :

Nama Propertis Nilai

Button4 Name

Text

btn_proses4

PROSES POLA 2

Secara prinsip kerja, pola 2 tidak jauh berbeda dengan pola pertama. Jika

pola pertama kita menambahkan spasi di tengah, maka untuk pola kedua kita

menambahkannya disamping kanan. Selamat mencoba

Page 31: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

31

BAB IV STRING

Tujuan

Pada Akhir perkuliahan ini, diharapkan mahasiswa memiliki kemampuan

sebagai berikut :

Memahami kegunaan fungsi STRING

Memaksimalkan fungsi STRING

4.1. STRING

String adalah variabel yang bisa menampung berbagai macam karakter,

sehingga kita bisa menggabungkan penulisan angka, karakter khusus sampai

dengan huruf. Misalkan saya punya suatu string dengan nilai

“198108092010121002”. Kelihatan biasa saja bukan? Tapi bagi sebagian orang

ini bisa memiliki arti. Deret angka yang saya tuliskan adalah sebuah NIP yang

dimiliki oleh seorang PNS. Kenapa NIP bisa sepanjang itu? Karena NIP

merupakan gabungan dari beberapa kode yang memiliki makna. Berikut adalah

penjelasannya. Delapan huruf pertama merupakan tanggal lahir, enam huruf

berikutnya merupakan tanggal pengangkatan pegawai satu huruf berikutnya

merupakan jenis kelamin, dimana 1 berarti Pria dan 2 berarti wanita, sedangkan

tiga huruf terakhir merupakan nomor urut dimana jika pada tahun pengangkatan

yang sama terdapat pegawai yang memiliki tanggal lahir yang sama, maka nomor

urut itu akan ditambahkan sesuai dengan banyaknya pegawai. Wah cukup unik

bukan?

Dari jabaran diatas, maka kita perlu suatu fungsi yang bisa mengambil

suatu string yang sesuai dengan kebutuhan. Misalkan saya ingin mendapatkan

jenis kelamin dari pegawai PNS maka yang saya lakukan adalah saya mengambil

karakter ke 15 sebanyak 1. Berikut adalah beberapa fungsi string yang dimiliki

VS 2010.

4.2. LEFT

Fungsi LEFT didalam VS 2010 memiliki struktur sebagai berikut :

Page 32: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

32

Berikut adalah penjelasan dari fungsi left :

1. Merupakan parameter yang menjadi masukan dari sebuah string

yang ingin diambil karakternya

2. Merupakan sebuah bilangan yang berfungsi sebagai jumlah

karakter yang ingin diambil

Fungsi left berarti kita mengambil karakter yang dimulai dari sebelah kiri.

Perhatikan contoh berikut :

Baris kode tersebut akan menghasilkan kata “POL”.

4.3. RIGHT

Fungsi RIGHT didalam VS 2010 memiliki struktur sebagai berikut :

Berikut adalah penjelasan dari fungsi left :

1. Merupakan parameter yang menjadi masukan dari sebuah string

yang ingin diambil karakternya

2. Merupakan sebuah bilangan yang berfungsi sebagai jumlah

karakter yang ingin diambil

Fungsi RIGHT berarti kita mengambil karakter yang dimulai dari sebelah

kanan. Perhatikan contoh berikut :

Baris kode tersebut akan menghasilkan kata “EMA”.

Page 33: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

33

4.4. MID

Fungsi MID memiliki dua macam bentuk, yaitu MID dengan dua

parameter dan MID dengan tiga parameter. Berikut adalah strukturnya :

Berikut penjelasan dari masing-masing fungsi parameter :

1. Merupakan parameter dari string yang ingin digunakan

2. Merupakan parameter yang menandakan titik mulai pengambilan yang

awalnya dihitung dari sebelah kiri

3. Merupakan parameter yang berfungsi untuk mengambil seberapa

banyak karakter yang akan diambil.

Contoh penggunaan dari fungsi mid adalah sebagai berikut :

Dari kode program diatas, maka :

hasil akan menjadi “NEMA KEREN”. Sedangkan hasil2 akan menjadi

“KER”. Penjelasan dari fungsi MID dengan 2 parameter untuk hasil adalah fungsi

MID akan dimulai dari karakter ke lima dari sebelah kiri karakter ke lima dari

sebelah kiri adalah “N”. Sedangkan penjelasan untuk fungsi MID dengan tiga

parameter untuk hasil2 adalah fungsi mid akan dimulai dari karakter ke sepuluh

dari sebelah kiri yaitu “K” dan diambil sebanyak tiga karakter sehingga

menghasilkan “KER”.

4.5. LEN

Fungsi LEN adalah untuk menghitung karakter dari sebuah string. Fungsi

ini sering digunakan untuk mengetahui panjang karakter yang nantinya akan

dilakukan suatu operasi fungsi STRING. Berikut adalah struktur dari fungsi LEN

Page 34: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

34

Fungsi ini hanya memiliki satu buah parameter, yaitu parameter yang

berupa string yang ingin dihitung panjangnya. Berikut contoh penggunaan LEN.

Dari baris program diatas maka hasil akan memiliki nilai 14.

4.5. Latihan

Buatlah sebuah project baru dan beri nama dengan lat_String, tambahkan

beberapa komponen dan atur propertisnya menjadi :

Nama Propertis Nilai

Form Name

Text

Frm_string

Fungsi STRING

Label1 Name

Text

Lbl_teks

POLINEMA OKE

Button1 Name

Text

btn_kiri

KIRI

Button2 Name

Text

Btn_kanan

KANAN

Sehingga akan membentuk form seoerti gambar 5.1

Page 35: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

35

Gambar 4. 1. Latihan STRING

Selanjutnya didalam event click btn_kiri kita tambahkan baris kode ini :

Berikut adalah penjelasan dari kode program diatas :

1. Kita mengambil karakter lbl_teks dari sebelah kanan sebanyak panjang

lbl_teks dikurangi 1. Lbl_teks berisikan “POLINEMA OKE”, maka

perintah ini akan menghasilkan “OLINEMA OKE”

2. Bagian ini merupakan tanda untuk menurunkan baris supaya tidak

memanjang kekanan. Tanda yang digunakan adalah “(spasi)_”

3. Kita mengambil karakter lbl_teks dari sebelah kiri sebanyak 1.

Lbl_teks berisikan “POLINEMA OKE”, maka perintah ini akan

menghasilkan “P”.

4. Jika digabungkan dengan tanda “+” maka akan menghasilkan

“OLINEMA OKE”+”P” dan menjadi “OLINEMA OKEP”. Jika kita

tekan tombol kiri terus menerus, maka seolah-olah teks bergerak

memutar ke kiri.

Langkah selanjutnya kita isi event click dari tombol kanan dengan kode :

Page 36: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

36

Berikut adalah oenjelasan dari kode program diatas :

1. Kita mengambil karakter lbl_teks dari sebelah kanan 1. Lbl_teks

berisikan “POLINEMA OKE”, maka perintah ini akan menghasilkan

“E”

2. Kita mengambil karakter lbl_teks dari sebelah kiri sebanyak panjang

karakterdikurangi 1. Lbl_teks berisikan “POLINEMA OKE”, maka

perintah ini akan menghasilkan “POLINEMA OK”.

3. Jika digabungkan dengan tanda “+” maka akan menghasilkan “E”+”

POLINEMA OK” dan menjadi “EPOLINEMA OK”. Jika kita tekan

tombol kiri terus menerus, maka seolah-olah teks bergerak memutar ke

kanan.

Berikut adalah hasil penekanan tombol KIRI

Gambar 4. 2 Hasil dari Tombol KIRI

Dan berikut adalah hasil dari penekanan tombol KANAN

Gambar 4. 3 Hasil dari Tombol KANAN

Cukup mudah bukan? Selanjutnya kita akan kembangkan dengan

membalik kata dengan fungsi string. Tambahkan satu buah tombol dan rubah

propertisnya menjadi :

Page 37: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

37

Nama Propertis Nilai

Button3 Name

Text

Btn_balik

BALIK

Berikut ini adalah logikanya.

Gambar 4. 4 Gambar logika membalik kata

Penjelasan dari gambar 5.4 adalah :

1. Mengambil 1 karakter paling kanan

2. Memindahkannya ke karakter paling kiri

3. Menggabungkan dengan karakter berikutnya dari sebelah kiri

4. Lakukan secara berulang sebanyak karakter yang ada.

Berikut adalah kode programnya :

Penjelasan dari kode program diatas adalah :

1. Kita melakukan perulangan dari panjang teks ke 1 dengan step -1 (jika

lupa silahkan lihat BAB III mengenai fungsi perulangan)

2. Menyusun huruf satu persatu dimulai dari huruf paling kanan

“POLINEMA OKE” akan disusun dengan logika

“” + “E” perulangan ke 1

“E” + “K” perulangan ke 2

“EK” + ”O” perulangan ke 3

Page 38: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

38

“EKO” + “(spasi)” perulangan ke 4

.......

“EKO AMENILOP” perulangan ke 10

Berikut adalah hasil dari tombol BALIK :

Gambar 4. 5 Hasil dari tombol BALIK

Bagaimana, sederhana bukan? Selanjutnya karena POLINEMA berada di

Malang yang terkenal dengan bahasa “walikan” maka sepertinya fungsi balik kata

tersebut masih kurang pas dikarenakan fungsi itu membalikkan kalimat dan bukan

kata. Mari kita buat fungsi balik kata dengan menambahkan satu buah tombol dan

atur propertisnya sebagai berikut :

Nama Propertis Nilai

Button4 Name

Text

Btn_arema

AREMA

Secara fungsi nantinya kita mengambil fungsi balik dan dikembangkan

menjadi string yang berupa kalimat kita pecah menjadi kata-kata dengan mengacu

kepada karakter spasi sebagai pemisahnya. Tambahkan kode program pada event

click di tombol AREMA dengan kode berikut :

Page 39: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

39

Berikut adalah penjelasan dari kode program diatas :

1. Melakukan pemisahan kata dari kalimat, sebagai pemisah dari tiap-tiap

kata adalah spasi yang selanjutnya akan disimpan dalam variabel array

2. Melakukan perulangan sebanyak kata

3. Mengambil nilai dari array

4. Menghapus spasi dari kalimat paling kanan

Hasil dari tombol AREMA adalah :

Gambar 4. 6 Hasil dari tombol AREMA

Tugas

Modifikasi form tersebut, tambahkan satu buah textbox. Dimana fungsi

dari textbox itu adalah sebagai masukkan dari kata yang ingin dilakukan fungsi

STRING. Ubahlah atributnya menjadi :

Nama Propertis Nilai

Textbox1 Name Txt_string

Page 40: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

40

BAB V PROSEDUR DAN FUNGSI

Tujuan

Pada Akhir perkuliahan ini, diharapkan mahasiswa memiliki kemampuan

sebagai berikut :

Memahami kegunaan Prosedur

Memahami kegunaan Fungsi

Bisa membedakan antara Prosedur dengan Fungsi

5.1. Pendahuluan

Secara umum kegunaan dari prosedur dan fungsi adalah untuk

mengumpulkan baris perintah yang sering dipergunakan didalam program.

Prosedur dan fungsi dibedakan dari sifatnya. Fungsi harus mengembalikan nilai

sedangkan prosedur tidak. Ini yang menjadi pembeda dan alasan kapan saya harus

menggunakan prosedur dan kapan saya harus mengunakan fungsi.

Misalkan ada kumpulan baris perintah yang selalu dipergunakan didalam

program, dan kumpulan baris itu dipergunakan disemua from didalam sebuah

program. Maka jika ada perubahan, maka kita harus merubah semua baris perintah

didalam sebuah program.

5.2. Prosedur

Didalam VS 2010 prosedur ditulis dengan “SUB” berikut ini adalah

struktur dari prosedur di VS 2010 :

Penjelasan dari struktur prosedur tersebut adalah :

1. Jika kita tidak memerlukan parameter maka prosedur cukup dituliskan

dengan Sub nama_sub()

Page 41: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

41

2. Fungsi parameter adalah untuk melewatkan nilai yang berasal dari luar

prosedur supaya bisa digunakan didalam prosedur

3. Didalam parameter terdapat perintah ByVal/ByRef, berikut adalah

penjelasannya berikut contohnya :

a. ByVal : jika kita memberikan perintah ByVal diawal nama

parameter itu berarti kita hanya mengambil nilai dari variabel

tersebut tanpa merubah nilainya ketika terjadi perubahan didalam

prosedur/ fungsi.

b. ByRef : jika kita memberikan perintah ByRef diawal nama

parameter itu berarti kita tidak hanya mengambil nilai dari variabel

tersebut tetapi kita juga merubah nilainya ketika terjadi perubahan

didalam prosedur/ fungsi.

Contoh

Dari penggunaan ByVal diatas, jika kita mencetak nilai maka yang

tercetak adalah 1 tapi jika kita ganti dengan kode berikut :

Maka jika kita mencetak isi dari nilai yang didapatkan adalah 20.

4. Jika kita membutuhkan lebih dari 1 parameter, pisahkan masing-

masing parameter dengan “ , ” koma.

Page 42: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

42

5.3. Fungsi

Didalam VS 2010 fungsi ditulis dengan “FUNCTION” berikut ini adalah

struktur dari fungsi di VS 2010 :

Penjelasan dari struktur fungsi diatas adalah :

1. Jika kita tidak memerlukan parameter maka fungsi cukup dituliskan

dengan Function nama_sub() as tipe data

2. Fungsi parameter adalah untuk melewatkan nilai yang berasal dari luar

fungsi supaya bisa digunakan didalam fungsi

3. Didalam parameter terdapat perintah ByVal/ByRef sama seperti di

prosedur.

4. Jika kita membutuhkan lebih dari 1 parameter, pisahkan masing-

masing parameter dengan “ , ” koma.

5. Karena fungsi harus mengembalikan nilai maka penulisan fungsi

diikuti dengan deklarasi tipe data nilai yang dikembalikan

6. Didalam fungsi harus ada kata-kata Return yang artinya keluaran dari

fungsi.

5.4. Latihan

Sebagai latihan buatlah sebuah project baru beri nama dengan latihan

prosedur. Dan tambahkan beberapa komponen sehingga bentuk dari form menjadi

seperti gambar 5.1. Ubahlah propertis dari masing-masing komponen menjadi :

Nama Propertis Nilai

Textbox1 Name Txt_1

Textbox2 Name Txt_2

Textbox3 Name Txt_3

Textbox4 Name Txt_4

Textbox5 Name Txt_5

Button1 Name

Text

Btn_A

A

Page 43: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

43

Button2 Name

Text

Btn_B

B

Button3 Name

Text

Btn_C

C

Gambar 5. 1 Latihan Prosedur

Gambaran dari program ini adalah apabila tombol A atau B atau C ditekan

maka akan tampil tulisan seperti gambar 5.2

Gambar 5. 2 Hasil Latihan Prosedur

Maka secara sederhana kita akan menuliskan baris program ini didalam

masing-masing tombol :

Page 44: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

44

Sepertinya memang sederhana, tetapi kita menuliskan baris perintah yang

sama dimasing-masing event click tombol A, B dan C. Bagaimana jika ada

perubahan dari isian dimasing-masing textbox? Maka kita juga harus

mengubahnya sebanyak tiga kali. Sungguh merepotkan bukan?

Nah pada saat inilah kita bisa menggunakan prosedur. Misalkan kita

membuat prosedur dengan nama isian maka kodenya adalah :

Maka dimasing-masing event click di tombol kita cukup memanggil nama

prosedurnya seperti kode berikut :

Jika ada perubahan dari isian, kita cukup merubahnya diprosedur maka

secara otomatis semua tombol yang memanggil prosedur juga ikut berubah.

Page 45: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

45

Selanjutnya ada perubahan fungsi dari masing-masing tombol. Misalkan tombol A

ditekan maka isiannya adalah seperti isian sekarang, tapi jika tombol B ditekan

isiannya akan menjadi bahasa Inggris dan jika tombol C ditekan maka isiannya

berubah menjadi bahasa Jawa. Jika mengalami hal seperti ini, solusi paling baik

adalah dengan membuat parameter didalam prosedur isian dibandingkan jika kita

membuat prosedur baru sebanyak 2 buah. Berikut adalah kode prosedur yang

ditambahkan parameter didalamnya :

Karena ada perubahan prosedur maka pemanggilannya juga berubah.

Untuk tombol A menjadi :

Untuk tombol B menjadi :

Page 46: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

46

Untuk tombol C menjadi :

Berikut adalah hasil dari aplikasi latihan prosedur jika dijalankan :

Jika tombol A ditekan maka :

Gambar 5. 3 Hasil Jika Tombol A ditekan

Jika tombol B ditekan maka :

Gambar 5. 4 Hasil Jika Tombol B ditekan

Jika tombol C ditekan maka :

Page 47: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

47

Gambar 5. 5 Hasil Jika Tombol C ditekan

Kenapa solusi yang ditawarkan menggunakan parameter? Karena jika ada

perubahan nama komponen textbox, kita cukup merubahnya sebanyak satu kali.

Bagaimana sudah faham mengenai fungsi prosedur?.nah jika sudah faham

sekarang tambahkan satu buah button dan rubah propertisnya menjadi :

Nama Propertis Nilai

Button4 Name

Text

Btn_balik

BALIK

Fungsi dari tombol tersebut adalah merubah teks didalam setiap textbox

menjadi terbalik. Nah solusi untuk permasalahan ini adalah dengan membuat

sebuah fungsi. Kenapa fungsi? Karena jika kita membuatnya dengan prosedur,

maka kita harus membuat lima buah perulangan untuk membalik masing-masing

textbox, sedangkan jika kita menggunakan fungsi maka kita hanya membutuhkan

satu buah perulangan. Berikut adalah kode fungsinya :

Page 48: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

48

Dan berikut adalah kode program yang ditulis di dalam event click

btn_balik :

Maka jika tombol balik ditekan akan menghasilkan :

Gambar 5. 6 Hasil dari tombol Balik

Tugas

Buatlah prosedur dan fungsi dari latihan yang berada di BAB IV aplikasi STRING

Page 49: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

49

BAB VI MsSQL Database

Tujuan

Pada Akhir perkuliahan ini, diharapkan mahasiswa memiliki kemampuan

sebagai berikut :

Memahami MsSQL Server 2008

Memahami kegunaan MsSQL 2008

6.1. Pendahuluan

Secara umum, terdapat 2 jenis bahasa database, yaitu: DDL (data

definition language) dan DML (data manipulation language). DDL merupakan

perintah-perintah yang biasa digunakan administrator database untuk

mendefinisikan skema dan subskema database (Contoh: CREATE, ALTER,

MODIFY). Sedangkan, DML merupakan merupakan perintah-perintah yang

memungkinkan pengguna melakukan akses dan manipulasi data sebagaimana

yang telah diorganisasikan sebelumnya dalam model data yang tepat (Contoh:

INSERT, UPDATE, DELETE).

DML terdiri dari 2 macam, yaitu: Prosedural dan Non-Prosedural.

Prosedural berarti perintah yang memungkinkan pengguna menentukan data apa

yang dibutuhkan serta bagaimana cara mendapatkannya (Contoh: dBASE III,

FoxBASE). Sedangkan, Non-Prosedural berarti perintah yang memungkinkan

pengguna menentukan data apa saja yang diinginkan tanpa menyebutkan

bagaimana cara mendapatkannya (Contoh: SQL, QBE).

6.2. MsSql 2008

Kebutuhan menggunakan MsSql 2008 adalah untuk penyimpanan data.

Untuk menggunakan MsSql berikut langkah-langkahnya :

1. Jalankan aplikasi SQL Server Management Studio, selanjutnya pilih

database engine

2. Pilih nama server – biasanya bisa menggunakan (local)

Page 50: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

50

3. Autentication : windows Authentication

4. Dan tekan connect

Gambar 6. 1. Koneksi Database

Jika sukses maka akan tampil ruang kerja dari MsSql 2008 dan berikut

adalah penjelasan dari ruang kerja tersebut :

Gambar 6. 2 Ruang KErja MsSql 2008

Page 51: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

51

Secara umum, ruang kerja MsSql terbagi menjadi 2 bagian yaitu object

explorer dan propertise. Dari gambar 6.2 ruang kerja tersebut adalah :

1. Menciptakan query baru

2. Tempat database

3. Ruang kerja

Untuk keterangan lebih lanjut, silahkan buka materi Basis data yang telah

dipelajari.

6.3. Query MsSQL.

Untuk menunjang latihan Buatlah sebuah database beri nama dengan

SIAKAD. Dan didalam database tersebt, buatlah empat buah tabel seperti gambar

6.3.

Gambar 6. 3 Disain tabel SIAKAD

Setelah tabel sudah jadi langkah selanjutnya adalah kita isikan data

dimasing-masing tabel.

1. Isi tabel mahasiswa sebanyak 10 record dengan perintah dengan

menggunakan query editor dan di jalankan dengan menekan tombol F5

atau dengan menekan tombol :

2. Isi tabel mtk sebanyak 2 record

3. Isi tabel dosen sebanyak 4 record

4. Isi tabel nilai sebanyak 20 record

Page 52: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

52

Selanjutnya tampilkan data yang berada di dalam tabel mahasiswa dengan

perintah “SELECT” seperti dibawah ini :

Perintah SQL tersebut akan menampilkan seluruh data dari tabel

mahasiswa seperti gambar 6.4

Gambar 6. 4 Hasil perintah SELECT mahasiswa

Sebagai programmer kita mungkin bisa membaca data tersebut dengan

baik, tapi bagai mana dengan orang lain yang ingin mengetahui arti dari data

tersebut. Sebagai contoh disana ada field jk yang berisikan bilangan bit yang

terdiri dari nilai true / false atau 1 / 0. Dimana hanya kita pembuat program yang

bisa membedakan mana yang jenis kelamin Laki-laki dan mana yang jenis

kelamin perempuan. Misalkan kita tentukan 1 adalah Laki-laki dan 0 adalah

Wanita. Maka kita harus melakukan perubahan didalam program.

Dengan menggunakan MsSql 2008 hal tersebut tidak perlu dilakukan

diprogram. Cukup dengan menambahkan pengujian sederhana maka data yang

ditampilkan sudah bisa sesuai dengan yang kita inginkan. Misalkan data yang

ditampilkan langsung dengan keterangan 1 adalah “Laki-laki” dan 0 adalah

“Wanita”. maka kita pergunakan fungsi CASEyang dimiliki MsSql dengan

Struktur sebagai berikut :

Page 53: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

53

Gambar 6. 5 Struktur CASE MsSQL

Dengan penggunaan PL SQL maka bentuk query kita akan menjadi :

Maka perintah tersebut akan menampilkan data seperti gambar 6.6 :

Gambar 6. 6 Hasil Query dengan PL

Page 54: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

54

Cukup mudah bukan? Jadi kita tidak perlu lagi melakukan perubahan data

didalam program. Dan dengan menggunakan PL SQL kita bisa menyingkat waktu

proses dalam pengolahan data.

Latihan selanjutnya adalah kita menampilkan mahasiswa beserta nilai,

matakuliah dan dosen pengajarnya. Untuk jenis query sederhana maka bentuk

perintahnya adalah :

Jika dijalankan maka akan tampil mahasiswa dan nilai-nilainya seperti

digambar 6.7

Gambar 6. 7 Hasil Query sederhana

Bentuk perintah SQL diatas dibilang sederhana karena keterbatasan dalam

pengolahan data. Query tersebut sederhana karena bentuk relasi join hanya bisa

relasi yang beririsan saja, sedangkan untuk relasi jenis lain tidak bisa didukung.

Mari kita rubah bentuk perintahnya menjadi bentuk yang lebih terstruktur dan rapi

dengan menggunakan operasi Join.

Page 55: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

55

Dengan penggunaan perintah diatas hasil yang ditampilkan akan sama

dengan perintah sebelumnya. Tapi disini bisa kita kembangkan menjadi bentuk

perintah yang lebih komplek dan sesuai dengan kebutuhan kita. Bentuk Join di

MsSQL secara umum ada beberapa bentuk. Bentuk yang paling sering

dipergunakan adalah INNER,LEFT,RIGHT dan FULL JOIN.Berikut adalah

gambaran dari bentuk query tersebut.

6.3.1. Relasi INNER JOIN

Relasi INNER join merupakan relasi yang dipergunakan untuk

menampilkan data yang berisisan saja seperti tampak didalam gambar 6.8

Gambar 6. 8 Relasi INNER JOIN

Page 56: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

56

6.3.2. Relasi LEFT JOIN

Relasi LEFT join merupakan relasi yang dipergunakan untuk

menampilkan data dari tabel sebelah Kiri dan yang berisisan saja seperti tampak

didalam gambar 6.9

Gambar 6. 9 Relasi LEFT JOIN

6.3.3. Relasi RIGHT JOIN

Relasi RIGHT join merupakan relasi yang dipergunakan untuk

menampilkan data dari tabel sebelah Kanan dan yang berisisan saja seperti tampak

didalam gambar 6.10

Gambar 6. 10 Relasi RIGHT Join

6.3.4. Relasi FULL JOIN

Relasi FULL join merupakan relasi yang dipergunakan untuk

menampilkan data dari tabel sebelah Kanan, Kiri dan yang berisisan seperti

tampak didalam gambar 6.11

Page 57: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

57

Gambar 6. 11 Relasi FULL Join

Untuk mencoba relasi tersebut, coba anda tambahkan satu buah record

mahasiswa dan tampilkan dengan query INNER join dan LEFT join.

Dengan operasi INNER join maka hasilnya akan sama dengan digambar

6.7. sedangkan jika anda rubah dengan operasi LEFT JOIN seperti kode berikut,

maka hasilnya adalah akan tampil mahasiswa yang tidak memiliki nilai seperti

gambar 6.12

Gambar 6. 12 Hasil Query dengan LEFT join

Page 58: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

58

Selanjutnya kita akan buat query yang lebih kompleks lagi. Ubahlah query

diatas, sehingga menampilkan nilai angka dan nilai huruf dengan kualifikasi

sebagai berikut :

Nilai Angka Nilai Huruf

>=80 A

>=70 B

>=60 C

>=50 D

<50 E

Bentuk perintahnya akan menjadi :

Hasil dari perintah tersebut adalah :

Page 59: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

59

Gambar 6. 13 Hasil Query untuk nilai Abjad

6.4. DDL MsSQL

DDL didalam SQL dipergunakan untuk mempersingkat perintah-perintah

serta mengumpulkan baris perintah yang sering dipergunakan. Sama halnya

seperti materi pada BAB V mengenai prosedur dan Fungsi. Maka DDL ini adalah

penggunaan prosedur dan fungsi didalam MsSQL.

6.4.1. Fungsi MsSQL

Fungsi didalam MsSql digunakan untuk mengumpulkan baris perintah

yang mengembalikan nilai. Struktur dari Fungsi di MsSQL adalah sebagai

berikut:

Gambar 6. 14 Struktur Function MsSql

Dari Struktur tersebut, maka jika kita membuat function untuk Jenis

Kelamin dan nilai kode programnya menjadi :

Kode Function Jenis Kelamin :

Page 60: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

60

Kode Function Nilai Abjad :

Jika kedua kode tersebut dijalankan, maka akan tercipta dua buah function

didalam Programability – Function seperti yang terlihat pada Gambar 6.15. Cara

penggunaan Function sangatlah mudah, Script SQL Sebelumnya akan kita

modifikasi dengan menggunakan pemanggilan Function.

Page 61: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

61

Gambar 6. 15 Function didalam MsSQL

Berikut adalah kode program yang sudah dirubah dengan menggunakan

function :

Jika dijalankan, maka hasilnya akan sama dengan query sebelumnya tetapi

disini jadi lebih sederhana dan rapi. Selain dari itu jika ada query lain yang

membutuhkan konversi nilai ke abjad, kita tinggal memanggil Function nil_abjad.

Sederhana bukan?

6.4.2. Prosedur

Prosedur didalam MsSql digunakan untuk mengumpulkan baris perintah

yang melakukan proses dan juga bisa mengembalikan nilai. Lho prosedur bisa

mengembalikan nilai? Ya, didalam pemrograman MsSql Prosedur bisa

mengembalikan nilai, dikarenakan penggunaan prosedur disini bisa menangani

suatu aplikasi komplek dan biasa digunakan untuk membuat laporan/ Report.

Berikut adalah struktur Prosedur di MsSql :

Page 62: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

62

Gambar 6. 16 Struktur Prosedur

Berikut adalah contoh penggunaan prosedur. Kita jadikan perintah SQL

sebelumnya dan kemudian dijadikan prosedur, berikut tambahan untuk dijadikan

prosedur :

Jika perintah tersebut dijalankan maka akan tercipta sebuah prosedur

lihat_nilai yang letaknya berada di Programability – Stored Procedures seperti

gambar 6.17

Page 63: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

63

Gambar 6. 17 Prosedur di MsSQL

Dan cara pemanggilan dari Prosedur sangatlah mudah. Gunakan perintah

EXECUTE atau bisa disingkat dengan EXEC seperti baris kode berikut :

Dengan satu baris perintah tersebut kita bisa mendapatkan hasil sama

dengan perintah SQL sebelumnya. Jadi lebih sederhana bukan? Dan jika kita

membutuhkan penggunaan data tersebut didalam sebuah program, perintah yang

kita gunakan sama seperti perintah diatas.

Untuk memperbaiki/ mengubah sebuah Prosedur atau Fungsi

menggunakan perintah ALTER.

Tugas

1. Buatlah sebuah kueri untuk menampilkan data dosen beserta mata

kuliah yang diajar.

2. Jika kueri sudah berhasil, jadikanlah prosedur

Page 64: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

64

BAB VII STRING KONEKSI

Tujuan

Pada Akhir perkuliahan ini, diharapkan mahasiswa memiliki kemampuan

sebagai berikut :

Memahami Koneksi data dengan MsSQL 2008

Memahami perintah-perintah interaksi Database

7.1. Koneksi Database

Koneksi database diperlukan aplikasi untuk berhubungan dengan Database

server. Ada banyak cara untuk bisa melakukan koneksi. Tetapi kita akan membuat

koneksi yang sederhana tanpa pembuatan komponen windows. Cukup dengan

menggunakan baris perintah.

Didalam berhubungan dengan database, ada beberapa hal yang harus

diingat yaitu :

Selalu lakukan operasi buka dan tutup koneksi pada saat melakukan

koneksi

Lakukan pengamanan blok program dengan menggunakan perintah

Try...Catch

Buat modul untuk koneksi.

Kenapa ada aturan seperti itu? Baik berikut penjelasannya. Setiap kali kita

melakukan koneksi ke database server. Kita membuka jalur koneksi kesana. Dan

jika jalur tersebut tidak di tutup, maka ketika ada perintah yang membutuhkan

koneksi data, yang terjadi adalah aplikasi membuat koneksi baru dan jalur lama

tidak tertutup dan tetap terhubung. Jika hal ini terjadi secara terus menerus akan

mengakibatkan jalur koneksi penuh dan akibatnya bisa terjadi antrian dan

Page 65: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

65

akhirnya aplikasi menjadi berat. Tentu kita tidak menginginkan hal tersebut

bukan?

7.2. Modul koneksi

Penggunaan modul sangat disarankan karena modul tidak menggunakan

antar muka. Modul hanyalah sekumpulan baris perintah, variabel dan juga

konstanta. Penggunaan modul sangat disarankan supaya aplikasi kita bisa terbagi

menjadi bagian-bagian kecil atau yang lebih dikenal dengan konsep modularity.

Selain itu, penggunaan modul juga mendukung konsep re-Use atau

penggunaan kembali baris perintah yang memiliki kesamaan. Sehingga jika kita

membuat aplikasi yang hampir mirip, kita bisa menggunakan modul yang sama

dengan aplikasi sebelumnya. Cukup menarik bukan?

Latihan

Untuk memahami konsep modul dan koneksi database, kita buat dulu

sebuah databse di MsSql. Berinama dengan db_Perpustakaan. Tambahkan

beberapa tabel seperti gambar 7.1

Page 66: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

66

Gambar 7. 1 Desain Database Perpustakaan

Page 67: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

67

Selanjutnya, buatlah project baru dan beri nama dengan Sistem Informasi

Perpustakaan. Tambahkan sebuah modul, dengan cara klik kanan di project dan

pilih add-modul (Gambar 7.2). Beri nama dengan Koneksi.vb. maka akan muncul

module bernama koneksi lihat gambar 7.3.

Gambar 7. 2 Menambahkan Modul

Gambar 7. 3 Modul Koneksi

Setelah modul sudah selesai, tuliskan baris kode berikut ini :

Page 68: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

68

Berikut penjelasan dari baris kode tersebut :

1. SqlConnection : perintah untuk membuat sesi dengan MsSql

2. SqlDataAdapter : berfungsi sebagai penghubung antara dataset dengan

MsSQL server untuk menerima dan merubah data

3. SqlDataReader : berfungsi untuk membaca data pada suatu tabel

4. DataRow : berfungsi untuk menangani baris data dalam datatable

5. DataSet : sekumpulan data yg disimpan didalam memory, relasi antar

table tetap disimpan.

6. DataTable : berfungsi sebagai table virtual didalam aplikasi.

7. SqlCommand : merupakan perintah untuk menjalankan kueri sql

didalam aplikasi

8. String conn : berisikan mengenai informasi dari server database yang

ingin dihubungi.

9. Merupakan sederet perintah untuk mengaktifkan koneksi dengan

database server.

Page 69: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

69

Modul koneksi berisikan sebuah prosedur yang digunakan untuk

melakukan koneksike database. Jika aplikasi kita akan melakukan hubungan

dengan database, maka anda harus memanggil prosedur koneksi_database.

Buatlah sebuah form, beri nama dengan frm_buku. Didalamnya

tambahkan beberapa komponen dan atur propertisnya menjadi:

Nama Propertis Nilai

Label1 Name

Text

Lbl_kode

Kode Buku :

Label2 Name

Text

Lbl_Judul

Judul Buku :

Label3 Name

Text

Lbl_kategori

Kategori Buku :

Label4 Name

Text

Lbl_Penulis1

Penulis 1 :

Label5 Name

Text

Lbl_Penulis2

Penulis 2 :

Label6 Name

Text

Lbl_Penulis3

Penulis 3 :

Label7 Name

Text

Lbl_tahun

Tahun Terbit :

Text1 Name Txt_kode

Text2 Name Txt_Judul

Text3 Name Txt_Penulis1

Text4 Name Txt_Penulis2

Text5 Name Txt_Penulis3

Text6 Name Txt_tahun

Combobox1 Name cmb_kategori

Button1 Name

Text

Btn_simpan

Simpan

Button2 Name

Text

Btn_hapus

Hapus

Page 70: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

70

Gridview Name Gdv_buku

Selanjutnya, buatlah procedure bersih. Yang berfungsi untuk

mengosongkan isian dari text. Berikut kodenya :

Langkah berikutnya kita mengisikan gridview dengan data yang berasal

dari tabel buku. Berikut langkah-langkahnya :

Buat kueri di MsSQL dan jadikan procedure view_buku :

Buat prosedur menampilkan data di grid view :

Page 71: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

71

Buat prosedur untuk menampilkan kategori yang berasal dari tabel

kategori dan di tulis kedalam combobox. Berikut kodenya :

Buat store procedure di MsSQL dan beri nama insert_buku. Berikut

kodenya :

Page 72: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

72

Buat perintah untuk memasukkan data dari antar muka kedalam table

buku. Buat perintah didalam event click btn_simpan. Berikut perintahnya :

Page 73: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

73

Selanjutnya buat hapus data yang baris kodenya disimpan didalam event

click btn_hapus, berikut perintahnya :

Langkah terakhir adalah kita mengaktifkan fungsi interaksi digrid, jadi bila

kita memilih grid tertentu, maka data akan dipindahkan kedalam textbox.

Berikut perintahnya yang disimpan didalam event click gdv_buku :

Page 74: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

74

TUGAS

Lengkapi aplikasi tersebut sampai menjadi aplikasi.

Page 75: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

75

DAFTAR ISI

BAB I PEMROGRAMAN BERBASIS GUI (Graphical User Interface) .. 1

1.1. GUI .................................................................................................. 1

1.2. Visual Basic .................................................................................... 1

1.2.1. Propertis ................................................................................... 4

1.2.2. Event ........................................................................................ 5

BAB II VARIABEL DAN TIPE DATA .................................................... 9

2.1. Variabel ........................................................................................... 9

2.1.1. Variabel Lokal .......................................................................... 9

2.1.2. Variabel global ....................................................................... 10

2.2. Tipe Data ....................................................................................... 11

2.3. Konstanta ...................................................................................... 13

2.4. Latihan .......................................................................................... 13

BAB III KONDISI DAN PERULANGAN .............................................. 16

3.1. Kondisi .......................................................................................... 16

3.1.1. If...Then...Else Statement ....................................................... 16

3.1.2. Select...Case Statement .......................................................... 17

3.2. Perulangan ..................................................................................... 18

3.2.1. For...Next Statement .............................................................. 18

3.2.2. While...End While Statement VS Do..Loop While Statement20

3.3. Latihan Kondisi .............................................................................. 22

3.4. Latihan Perulangan ....................................................................... 24

Tugas ..................................................................................................... 30

BAB IV STRING ...................................................................................... 31

4.1. STRING ........................................................................................ 31

4.2. LEFT ............................................................................................. 31

4.3. RIGHT .......................................................................................... 32

4.4. MID ............................................................................................... 33

4.5. LEN ............................................................................................... 33

4.5. Latihan .......................................................................................... 34

Tugas ..................................................................................................... 39

BAB V PROSEDUR DAN FUNGSI ........................................................ 40

5.1. Pendahuluan .................................................................................. 40

5.2. Prosedur ........................................................................................ 40

Page 76: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

76

5.3. Fungsi ............................................................................................ 42

5.4. Latihan .......................................................................................... 42

Tugas ..................................................................................................... 48

BAB VI MsSQL Database ........................................................................ 49

6.1. Pendahuluan .................................................................................. 49

6.2. MsSql 2008 ................................................................................... 49

6.3. Query MsSQL. .............................................................................. 51

6.3.1. Relasi INNER JOIN ............................................................... 55

6.3.2. Relasi LEFT JOIN.................................................................. 56

6.3.3. Relasi RIGHT JOIN ............................................................... 56

6.3.4. Relasi FULL JOIN ................................................................. 56

6.4. DDL MsSQL ................................................................................. 59

6.4.1. Fungsi MsSQL ....................................................................... 59

6.4.2. Prosedur .................................................................................. 61

Tugas ..................................................................................................... 63

BAB VII STRING KONEKSI .................................................................. 64

7.1. Koneksi Database .......................................................................... 64

7.2. Modul koneksi ............................................................................... 65

Latihan .................................................................................................. 65

TUGAS ................................................................................................. 74

Page 77: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

77

DAFTAR GAMBAR

Gambar 1. 1 Ruang Kerja Visual Studio 2010 ........................................................ 2

Gambar 1. 2 Jenis-jenis aplikas yang didukung ..................................................... 3

Gambar 1. 3 Ruang Kerja Visual Studio ................ Error! Bookmark not defined.

Gambar 1. 4 Propertis dan event sebuah form ........................................................ 5

Gambar 1. 5 Memberi nama form ........................................................................... 6

Gambar 1. 6 Merubah Warna Form ........................................................................ 6

Gambar 1. 7 event pada form .................................................................................. 7

Gambar 1. 8 Kode untuk merubah form ................................................................. 8

Gambar 1. 9 Hasil eksekusi Latihan 1 .................................................................... 8

Gambar 2. 1 form latihan 2 ................................................................................... 13

Gambar 2. 2 Kode program event click btn_proses .............................................. 14

Gambar 2. 3 Hasil eksekusi latihan2 ..................................................................... 14

Gambar 3. 1. Gambar Form tarif PLN .................................................................. 22

Gambar 3. 2 Hasil Form Tarif ............................................................................... 24

Gambar 3. 3 hasil eksekusi perulangan ................................................................. 27

Gambar 3. 4. pola baru setelah ditambahkan perulangan ..................................... 28

Gambar 3. 5 Hasil eksekusi tombol PROSES POLA ........................................... 29

Gambar 3. 6 Pola latihan ....................................................................................... 30

Gambar 4. 1. Latihan STRING ............................................................................. 35

Gambar 4. 2 Hasil dari Tombol KIRI ................................................................... 36

Gambar 4. 3 Hasil dari Tombol KANAN ............................................................. 36

Gambar 4. 4 Gambar logika membalik kata ......................................................... 37

Gambar 4. 5 Hasil dari tombol BALIK ................................................................. 38

Gambar 4. 6 Hasil dari tombol AREMA .............................................................. 39

Gambar 5. 1 Latihan Prosedur .............................................................................. 43

Gambar 5. 2 Hasil Latihan Prosedur ..................................................................... 43

Gambar 5. 3 Hasil Jika Tombol A ditekan ............................................................ 46

Gambar 5. 4 Hasil Jika Tombol B ditekan ............................................................ 46

Gambar 5. 5 Hasil Jika Tombol C ditekan ............................................................ 47

Gambar 5. 6 Hasil dari tombol Balik .................................................................... 48

Page 78: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

78

Gambar 6. 1. Koneksi Database ............................................................................ 50

Gambar 6. 2 Ruang KErja MsSql 2008 ................................................................ 50

Gambar 6. 3 Disain tabel SIAKAD ...................................................................... 51

Gambar 6. 4 Hasil perintah SELECT mahasiswa ................................................. 52

Gambar 6. 5 Struktur CASE MsSQL .................................................................... 53

Gambar 6. 6 Hasil Query dengan PL .................................................................... 53

Gambar 6. 7 Hasil Query sederhana ..................................................................... 54

Gambar 6. 8 Relasi INNER JOIN ......................................................................... 55

Gambar 6. 9 Relasi LEFT JOIN ............................................................................ 56

Gambar 6. 10 Relasi RIGHT Join ......................................................................... 56

Gambar 6. 11 Relasi FULL Join ........................................................................... 57

Gambar 6. 12 Hasil Query dengan LEFT join ...................................................... 57

Gambar 6. 13 Hasil Query untuk nilai Abjad ....................................................... 59

Gambar 6. 14 Struktur Function MsSql ................................................................ 59

Gambar 6. 15 Function didalam MsSQL .............................................................. 61

Gambar 6. 16 Struktur Prosedur ........................................................................... 62

Gambar 6. 17 Prosedur di MsSQL ........................................................................ 63

Gambar 7. 1 Desain Database Perpustakaan ......................................................... 66

Gambar 7. 2 Menambahkan Modul ...................................................................... 67

Gambar 7. 3 Modul Koneksi ................................................................................. 67

Page 79: BAB I PEMROGRAMAN BERBASIS GUI (Graphical User …staffsite.stimata.ac.id/assets/uploads/files/download/... ·  · 2016-06-15Pada bagian ini akan dijelaskan tentang pengenalan program

79