Tutorial Membuat Aplikasi dengan vb.net 2008

Visual basic merupakan bahasa yang paling mudah untuk dipahami, dikarenakan bahasanya yang sederhana dan hampir mendekati bahasa yang digunakan manusia sehari-hari. Aplikasi yang akan dibuat adalah contoh aplikasi penjualan barang sederhana... (sangat sederhana).

Dalam pembahasan kali ini, saya akan mencoba menjelaskan langkah-langkah dalam proses pembuatan suatu aplikasi menggunakan Visual Basic .NET 2008 dengan asumsi bahwa Anda telah sedikit memahami dan mengerti tentang apa itu Visual Basic beserta IDE yang akan digunakan (Visual Studio) termasuk syntax-syntax sederhana dalam pembuatan aplikasi menggunakan VB.

Semuanya akan dibuat dengan cepat dan ringkas.... hmmm...

Anda mungkin tidak percaya, pembuatan aplikasi penjualan ini hanya dikerjakan dalam waktu kurang dari satu hari...yups, 1 hari.. Tetapi itu belum dihitung dengan trial and error testnya.. hehe..

Untuk membuat suatu program yang profesional, waktu setahun atau dua tahun belum mencukupi. ;)

Bahan-bahan:

1. Visual Studio Professional 2008 / Visual Basic.net Express Edition
2. MS SQL Server 2005 Express Edition

1. Membuat proyek baru

Buka Visual Studio 2008 dan buat sebuah proyek baru dengan menggunakan menu File > New Project..

Pilih "Windows Forms Application" dengan target Framework 3.5 dan berikan nama "CTHAplikasi1" kemudian klik OK.

2. Menambah Database

Langkah berikutnya adalah kita akan menambahkan database dan coba menentukan tabel-tabel apa saja yang terdapat dalam database untuk aplikasi ini. Untuk tutorial pertama ini kita akan memulai dengan membuat 2 tabel yang terdiri dari : "Barang" dan "Kategori".

Pastikan SQL Express telah dijalankan. Masih di IDE VS (Visual Studio) klik menu Project > Add New Item..

Dalam tampilan dialog Add New Item, pilih "Service Based Database" dan masukkan nama "Database1.mdf". Kemudian klik tombol "Add". Lihat gambar:

Akan muncul kotak dialog "Datasource Configuration Wizard". Klik Finish. Jika semuanya telah dilakukan dengan benar, maka tampilan dalam Solution Explorer akan tampak seperti ini :

3. Menambah Tabel ke dalam Database

Klik menu View > Server Explorer untuk menampilkan Server Explorer.

Database yang baru dibuat tadi akan tampil dalam Server Explorer, dalam tutorial ini "Database1.mdf", jika terdapat tanda silang merah di database kita, klik kanan dan pilih refresh untuk membuka koneksi ke database. Lihat gambar:

Klik tanda plus (+) kemudian klik kanan di bagian "Tables" dan pilih "Add New table".

Akan muncul tampilan isian tabel. Isikan seperti gambar di bawah ini.

Jadikan "KDKategori" sebagai primary key dengan mengklik kanan baris "KDKategori" dan memilih "Set Primary Key".

Simpan tabel tersebut dengan nama "kategori" (tanpa tanda kutip).
Masih dalam tabel kategori, di tab Column Properties, pada bagian Identity Specification > nilai (Is Identity) di ubah menjadi "Yes" dengan Identity Increment sebanyak 1.

 

Hal di atas dilakukan untuk memberikan Increment Value terhadap KDKategori dengan nilai Increment=1.  Atau dengan kata lain, memberikan "Auto Number" terhadap KDKategori. :D
Pembuatan tabel kategori selesai.... ;)

Lakukan hal yang sama dengan tabel barang, dengan isian seperti gambar di bawah:

Jika kedua tabel telah selesai dibuat, maka tampilan dalam Server Explorer akan menjadi seperti gambar di bawah:

4. Membuat Diagram Relasi

Selanjutnya kita akan membuat relasi antar tabel. Klik kanan Database Diagrams dalam Server Explorer dan pilih Add New Diagram. Akan muncul kotak dialog konfirmasi, pilih Yes.

Setelah tombol Yes diklik, akan muncul kotak dialog "Add table". Tentukan tabel-tabel apa saja yang ingin dimasukkan ke dalam relasi. Dalam hal ini, masukkan tabel kategori dan tabel barang kemudian klik Close.

Tampilan tab diagram akan menjadi seperti gambar di bawah ini :

Klik dan tahan kolom KDKategori dari tabel kategori dan geser ke kolom KDKategori dalam tabel barang untuk membuat keduanya berelasi.

Akan muncul kotak konfirmasi, untuk memastikan kolom yang dimaksudkan sesuai dengan yang kita inginkan. Klik OK, maka akan tampil kotak dialog Foreign Key Relationship.

Pada bagian INSERT And UPDATE Specification, ubah nilai Delete Rule dan Update Rule menjadi Cascade :

Maksud dari Cascade dalam Delete Rule di atas adalah, setiap baris yang terdapat dalam relasi dengan pengaturan Cascade akan ikut terhapus bila tabel yang memiliki primary key dari relasi tersebut dihapus. Demikian juga dengan aturan Update Rule = Cascade.

Setelah tombol OK diklik, maka tampilan diagram relasinya menjadi :

Simpan diagram di atas dengan nama Diagram1.

5. Menambahkan LINQ to SQL Classes (Apa itu LINQ? = belum dibahas).

Berikutnya kita akan menambahkan LINQ to SQL Classes (LINQ = Language-Integrated Query). Klik Project > Add New Item.. kemudian pilih LINQ to SQL Classes dan beri nama DataClasses1.dbml kemudian klik Add.

Tab Object Relational Designer dari DataClasses1.dbml akan langsung terbuka. Masih dalam tab Object Relational Designer, buka Server Explorer dan geser kedua tabel yang barusan kita buat tadi ke dalam area Object Relational Designer, sehingga menjadi seperti gambar di bawah ini:

Klik Save untuk menyimpannya.

Simpan proyek kita dan tutup Visual Studio.

Sekian dulu untuk tutorial kali ini, pada kesempatan berikutnya akan saya lanjutkan dengan proses pembuatan form barang dan kategori, serta bagaimana melakukan query ke dalam database menggunakan LINQ. Stay tuned... Ciao!....

Apa itu LINQ?

LINQ (Language Integrated Query), merupakan suatu bahasa yang digunakan untuk melakukan query terhadap suatu sumber data (-sederhananya-). LINQ terdiri dari beberapa pernyataan (statement) yang bisa diterapkan ke dalam program kita untuk memilih item dari beberapa koleksi (collection) berdasarkan kriteria yang berbeda.

Contoh struktur LINQ dan aturannya dalam aplikasi. Coba kita lihat daftar array di bawah ini:

view plaincopy to clipboardprint?

1. Dim data() As Int16 = {3, 2, 5, 4, 6, 4, 12, 43, 45, 42, 65}  

Untuk menentukan elemen dari array tersebut, kita akan menggunakan looping For..Next, mengeksekusi tiap elemen array, dan nantinya bisa menyimpannya ke dalam array baru atau menghapusnya. Untuk memilih elemen dengan nilai yang lebih kecil dari 10, kita gunakan kode di bawah ini:

view plaincopy to clipboardprint?

1. Dim nilaiKecil(data.Length-1) As Integer   
2. Dim itm As Integer = 0   
3. For i As Integer = 0 To data.Length   
4.     If data(i) < 10 Then   
5.         nilaiKecil(itm) = data(i)   
6.         itm += 1   
7.     End If   
8. Next   
9. ReDim nilaiKecil(itm)  

Akan lebih mudah menyimpan elemen-elemen yang telah terpilih ke dalam suatu ArrayList menggunakan looping seperti di bawah ini:

view plaincopy to clipboardprint?

1. Dim nilaiKecil As New ArrayList   
2. Dim itm As Integer   
3. For Each itm In data   
4.     If itm < 10 Then   
5.         nilaiKecil.Add(itm)   
6.     End If   
7. Next  

Bila kita menggunakan LINQ,

view plaincopy to clipboardprint?

1. Dim nilaiKecil = From n In data _   
2.     Where n < 10 _   
3.     Select n  

Penggunaan bahasa dalam LINQ hampir sama dengan bahasa yang digunakan dalam SQL. Jika kita telah terbiasa dengan bahasa yang digunakan dalam SQL, kita akan menemukan beberapa kemiripan.

Contoh pernyataan SQL:

SELECT *

FROM data


WHERE data.n < 10

(Contoh di atas mengasumsikan dalam database kita terdapat tabel data yang memiliki kolom bernama n). Bila menggunakan LINQ, kode kita menjadi:

Dim = From n In data

Where n < 10

Ok, cukup teorinya... kita langsung saja ke praktek pembuatan program ;)

Pada tutorial kemarin kita telah membuat database barang dan kategori menggunakan SQL Express 2005, nah sekarang kita akan membuat tiap-tiap form untuk form barang dan untuk form kategori. Ikuti langkah-langkah berikut:

1. Menambah Form Barang

Tambahkan satu form dan beri nama frmBarang, dengan cara memilih menu Project > Add Windows Form atau dengan mengklik kanan nama proyek kita di solution explorer dan memilih Add > Windows Form. Akan muncul window Add New Item, masukkan nama frmBarang dan klik add.

Akan muncul form baru dengan nama frmBarang. Atur besar form sesuai keinginan.

2. Property Form Barang

(Skip jika ingin melewati bagian ini.)

Buka jendela property dari form barang (frmBarang) atau dengan cara menekan tombol F4. Atur property frmBarang sebagai berikut:

• 
  
  Text : Data barang
  
  



• 
  
  FormBorderStyle : FixedToolWindow
  
  

Ini hanya sekedar contoh dari property suatu form yang sering saya buat, silahkan di ubah sesuai keinginan.

3. Menambah DataGridView

Tampilkan jendela Toolbox (default: bagian kiri) dengan memilih menu View > Toolbox atau dengan menekan kombinasi tombol CTRL+ALT+X.

Geser control DataGridView ke dalam frmBarang:

Nama DataGridView1 akan secara otomatis diberikan untuk control DataGridView tadi.

4. Menampilkan data ke dalam DataGridView

Sekarang kita akan mencoba menampilkan data ke dalam control DataGridView1, data yang akan ditampilkan diambil dari tabel 'barang' dan tabel 'kategori.

Double klik tampilan frmBarang, maka kita akan masuk ke dalam tampilan Code View.

Ketikkan perintah berikut di bagian Private Sub frmBarang_Load

view plaincopy to clipboardprint?

1. Dim db As New DataClasses1DataContext   
2.         Dim qBarang = From barang In db.barangs _   
3.                       Join kategori In db.kategoris _   
4.                       On kategori.KDKategori Equals barang.KDKategori _   
5.                       Select barang   
6.   
7.         Me.DataGridView1.DataSource = qBarang  

Pada kode di atas (Hampir sama dengan pernyataan SQL) kita memulai dengan mendeklarasikan db sebagai object dari Class DataClasses1DataContext, kemudian membuat suatu variable baru dengan nama qBarang dan menuliskan query LINQ yang berfungsi untuk mengambil data dari 2 tabel (barang dan kategori, yang memiliki relasi pada kolom KDKategori) dari database. Hasil dari query LINQ tersebut akan ditampilkan dalam control DataGridView1 dengan menggunakan object DataSource dari property DataGridView1.

Kode lengkapnya seperti ini:

view plaincopy to clipboardprint?

1. Private Sub frmBarang_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load   
2.         Dim db As New DataClasses1DataContext   
3.         Dim qBarang = From barang In db.barangs _   
4.                       Join kategori In db.kategoris _   
5.                       On kategori.KDKategori Equals barang.KDKategori _   
6.                       Select barang   
7.   
8.         Me.DataGridView1.DataSource = qBarang   
9.   
10.     End Sub  

Sebelum kita mencoba menjalankan program ini, pastikan frmBarang merupakan Startup Form dengan cara memilih menu Project  > CTHAplikasi1 Properties. Pada tab Application bagian Startup form, pilih frmBarang sebagai form yang akan di load saat pertama kali aplikasi dijalankan. Jalankan aplikasi dengan menekan tombol F5.

Tampilan form setelah dijalankan (masih kosong karena belum ada data yang dimasukkan.. ) :

5. Menambah kontrol tombol, teks dan label.

Aplikasi kita sudah bisa dijalankan, tetapi kita masih perlu menambahkan tombol dan teks serta label ke dalam frmBarang agar memudahkan dalam interaksi dari user terhadap aplikasi.

Kembali ke Designer View (Klik kanan di area kosong di bagian kode dan pilih View Designer atau dengan menekan kombinasi tombol Shift+F7) dan tambahkan 1 label, dengan cara menggeser control Label dari Toolbox ke dalam frmBarang. Pada bagian property untuk Label1, untuk text masukkan 'Kode Barang:' dan untuk name masukkan 'lblKode'.

Tambahkan Control TextBox ke dalam frmBarang, dengan property, name: txtKodeBarang dan pada bagian text dikosongkan.

Lakukan hal yang sama untuk 4 Label, 1 ComboBox dan 3 TextBox selanjutnya dengan property sebagai berikut:

Control ComboBox: name = cmbKategori

Control TextBox: name = txtNamaBarang, text = dikosongkan

Control TextBox: name = txtJumlah, text = '0'

Control TextBox: name = txtHargaJual, text = '0'

Control Label: name = lblKategori, text = 'Kategori'

Control Label: name = lblNamaBarang, text = Nama Barang'

Control Label: name = lblJumlah, text = 'Jumlah'

Control Label: name = lblHargaJual, text = 'Harga Jual'

Sehingga hasilnya menjadi :

Setelah penambahan TextBox, Label serta ComboBox di atas selesai, kita lanjutkan dengan menambahkan Tombol-tombol (Button).

Klik dan geser 5 buah Control Button dari Toolbox ke dalam frmBarang dengan nilai property masing-masing:

Tombol 1: name = cmdEdit, Text = 'Edit'

Tombol 2: name = cmdBaru, Text = 'Baru'

Tombol 3: name = cmdSimpan, Text = 'Simpan'

Tombol 4: name = cmdHapus, Text = 'Hapus'

Tombol 5: name = cmdKeluar, Text = 'Keluar'

 

Sehingga tampilan akhir dari frmBarang akan menjadi :

6. Bersambung....

Yups, sekian dulu untuk tutorial bagian ke-2 ini. Nantinya kita akan mencoba menuliskan kode ke dalam frmBarang untuk mengeksekusi perintah saat ke lima tombol di atas diklik.

Tambahan (Upgrade dari VB 2005 ke VB 2008)

Mungkin masih banyak yang belum mengetahui bagaimana mengaktifkan LINQ dalam suatu project yang telah di upgrade dari VB 2005 ke VB 2008. (LINQ cuman ada di VB 2008).

Sekedar tambahan bagi yang menggunakan VB 2005 yang ingin bermigrasi ke VB 2008 dan ingin bereksperimen dengan LINQ:

1. 
   
   Konversi project ke VB 2008, setelah proses konversi berakhir,
   
   



2. 
   
   Buka Project Property
   
   



3. 
   
   Masuk ke tab Compile
   
   



4. 
   
   Pada Option Infer, pilih On.
   
   



5. 
   
   Masuk ke tab Reference
   
   



6. 
   
   Tambahkan reference System.Linq
   
   



7. 
   
   Tutup dan buka kembali project-nya..
   
   
   sumber asli:http://indosourcecode.blogspot.com/2008/07/tutorial-membuat-aplikasi-dengan-visual.html