Membuat Aplikasi Pembelian Sepatu atau sandal di Online Shop Andrias dengan Visual Studio

 Assalammualaikum Wr.Wb

Hai Hai Hai udeh lama ga ngasih tutorial nih kali ini gue bakal ngasih tutorial membuat semacam aplikasi pemesanan sepatu atau sandal di online shop Andrias (Ini cuma ngayal doang jadi ga bener bener ada online shop dan situs yg bakal gue cantumin nantinya, kalo memang ada kemiripan dengan situs atau nama online shop kalian gue minta maaf ya), Oiya aplikasi yg gue gunakan adalah Visual Studio 2012

Oke langsung aja ya.

Pertama kita buka aplikasi visual studionya, disini gue gunakan visual studio 2012

Lalu buat project baru, caranya pilih File -> New -> Project atau tekan Ctrl+Shift+N

Jika sudah muncul tampilan seperti ini pilih Windows Form Application lalu klik ok

  

Kolom Name itu untuk nama project kalian, Kolom Location itu lokasi dimana kalian akan menyimpan diproject ini nantinya, dan Solution Name itu rekomdasi nama dari visual studionya tenang kalo kolom name diatas diganti kolom solution name juga ikut terganti.

Jika sudah nanti akan muncul form kosong seperti ini lalu pilih ToolBox (kalo yg option toolboxnya ga ada bisa tekan Ctrl+Alt+X)

Dan isikan item item seperti ini :

ITEM	Jumlahnya
RadioButton (Dimasukan SourceCode)	9 Buah
TextBox (Tidak Diapa-apain)	9 Buah
ComboBox (Dimasukan SourceCode)	4 Buah
Button (Dimasukan SourceCode)	4 Buah
Label (Hanya Diganti Textnya)	8 Buah
GroupBox (Hanya Diganti Textnya)	6 Buah

Jika sudah susun seperti ini ya (Samain aja biar nantinya ga pusing sendiri hehe)

 

Cara ganti nama setiap itemnya klik itemnya 1x aja ya lalu cari dikanan bawah tampilan seperti ini lalu cari tulisan Text (Contoh item yg gue klik adalah GroupBox)

  

Desain sudah selesai sekarang kita akan masukan source code disetiap item agar setiap item ada fungsinya (cara masuk ke jendela tempat pengcodingan tinggal klik 2x item yg ingin dicoding).

Pertama kita akan memasukan source code untuk RadioButton agar setiap RadioButton yg kita klik akan muncul namanya di TextBox yg kita inginkan.

Klik RadioButton dua kali (bebas yg mana aja), Nanti akan muncul tampilan seperti ini (Contoh RadioButton yg gue klik adalah RadioButton1)

 

Isikan source code ini di celah yg kosong

 

TextBox1.Text = RadioButton1.Text

Arti dari source code diatas adalah isi dari TextBox1 = nama dari RadioButton1, Jadi source code dari 9 RadioButton itu sebenarnya sama saja yg perlu diganti hanya di RadioButton berapa kalian meng-klik/ingin mengcoding dan di TextBox berapa kalian ingin nama dari RadioButton itu keluar (yg gue lingkarin itu akan ada pembahan source code agar ketika di klik salah satu option contoh kita klik sepatu maka semua item yg berhubungan dengan sandal akan disembunyikan sementara begitu juga sebaliknya)

Nih source code tambahan untuk dua RadioButton yg gue lingkarin tadi :

Private Sub RadioButton5_CheckedChanged(sender As Object, e As EventArgs) Handles RadioButton5.CheckedChanged

TextBox4.Text = RadioButton5.Text

ComboBox3.Hide()

ComboBox4.Show()

ComboBox2.Hide()

ComboBox1.Show()

TextBox7.Hide()

TextBox5.Show()

TextBox6.Hide()

TextBox8.Show()

Button4.Hide()

Button2.Hide()

Button3.Show()

Button1.Show()

Form4.Hide()

Form2.Show()

RadioButton5.Checked = False

End Sub

Disini gue pake contoh RadioButton5, RadioButton5 ini yg text/tulisannya sepatu.

Private Sub RadioButton6_CheckedChanged(sender As Object, e As EventArgs) Handles RadioButton6.CheckedChanged

TextBox4.Text = RadioButton6.Text

ComboBox4.Hide()

ComboBox3.Show()

ComboBox1.Hide()

ComboBox2.Show()

TextBox5.Hide()

TextBox7.Show()

TextBox8.Hide()

TextBox6.Show()

Button4.Show()

Button2.Show()

Button3.Hide()

Button1.Hide()

Form2.Hide()

Form4.Show()

RadioButton6.Checked = False

Disini gue pake contoh RadioButton6, RadioButton6 ini yg text/tulisannya sandal.

(Karna jelasinnya susah gue bakal kasih gambar gif-nya aja ya)

Oke RadioButton sudah, sekarang kita akan memasukan source code untuk ComboBox, untuk ComboBox ini berbeda dengan RadioButton tadi kita harus mendeklarasikan dulu option apa saja yg akan muncul pada ComboBoxnya.

Cara mendeklarasikannya mudah klik 2x form kalian dan nanti akan muncul tampilan seperti ini

Lalu isikan deklarasi seperti ini :

ComboBox4.Items.Add("Adidas")

ComboBox4.Items.Add("Converse")

ComboBox4.Items.Add("Homiped")

ComboBox4.Items.Add("Nike")

ComboBox4.Items.Add("Precise")

ComboBox4.Items.Add("Vans")

Arti deklarasi diatas adalah tambahkan item Adidas,Converse,Homiped,Nike,Precise,dan Vans ke ComboBox4 (Contoh ComboBox yg gue gunakan adalah ComboBox4, di ComboBox4 ini nantinya akan gue isiin option merk-merk sepatu)(Seterah kalian mau meletakan di ComboBox berapa option berisi merk sepatu ini).

ComboBox3.Items.Add("Ando")

ComboBox3.Items.Add("Austin")

ComboBox3.Items.Add("Carvil")

ComboBox3.Items.Add("Eiger")

ComboBox3.Items.Add("Fladeo")

ComboBox3.Items.Add("Yongki")

Arti deklarasi diatas adalah tambahkan item Ando,Austin,Carvil,Eiger,Fladeo,dan Yongki ke ComboBox3 (Contoh ComboBox yg gue gunakan adalah ComboBox3, di ComboBox3 ini nantinya akan gue isiin option merk-merk sandal)(Seterah kalian mau meletakan di ComboBox berapa option berisi merk sandal ini).

For a = 35 To 45

ComboBox1.Items.Add(a)

Next

Arti deklarasi diatas adalah untuk a = 35 sampai 45, tambahkan a ke ComboBox1 karna a = 35 sampai 45 maka nantinya ComboBox1 akan berisi option 35-45(Contoh ComboBox yg gue gunakan adalah ComboBox1, di ComboBox1 ini nantinya akan gue isiin option size sepatu dari 35-45)(Seterah kalian mau meletakan di ComboBox berapa option berisi size sepatu ini)(Ini menggunakan fungsi Looping).

For b = 35 To 45

ComboBox2.Items.Add(b)

Next

Arti deklarasi diatas adalah untuk b = 35 sampai 45, tambahkan b ke ComboBox2 karna b = 35 sampai 45 maka nantinya ComboBox2 akan berisi option 35-45(Contoh ComboBox yg gue gunakan adalah ComboBox2, di ComboBox2 ini nantinya akan gue isiin option size sandal dari 35-45)(Seterah kalian mau meletakan di ComboBox berapa option berisi size sandal ini)(For harus ditutup dengan Next seperti halnya SelectCase ditutup EndSelect) (Ini menggunakan fungsi Looping).

Klik ComboBox dua kali (bebas yg mana aja), Nanti akan muncul tampilan seperti ini (Contoh ComboBox yg gue klik adalah ComboBox4)(ComboBox4 ini akan berisi merk sepatu dan apabila merk sepatu di ComboBox4 ini di klik option yg di klik akan muncul di Textbox, Contoh TextBox yg gue inginkan keluar nama dari ComboBox4 ini adalah TextBox8).

Lalu isikan source code ini di celah yg kosong :

Select Case ComboBox4.Text

Case "Adidas"

TextBox8.Text = "Adidas"

Case "Converse"

TextBox8.Text = "Converse"

Case "Homiped"

TextBox8.Text = "Homiped"

Case "Nike"

TextBox8.Text = "Nike"

Case "Precise"

TextBox8.Text = "Precise"

Case "Vans"

TextBox8.Text = "Vans"

End Select

Klik ComboBox dua kali (bebas yg mana aja), Nanti akan muncul tampilan seperti ini (Contoh ComboBox yg gue klik adalah ComboBox3)(ComboBox3 ini akan berisi merk sandal dan apabila merk sandal di ComboBox3 ini di klik option yg di klik akan muncul di Textbox, Contoh TextBox yg gue inginkan keluar nama dari ComboBox3 ini adalah TextBox7).

Lalu isikan source code ini di celah yg kosong :

Select Case ComboBox3.Text

Case "Ando"

TextBox7.Text = "Ando"

Case "Austin"

TextBox7.Text = "Austin"

Case "Carvil"

TextBox7.Text = "Carvil"

Case "Eiger"

TextBox7.Text = "Eiger"

Case "Fladeo"

TextBox7.Text = "Fladeo"

Case "Yongki"

TextBox7.Text = "Yongki"

End Select

Klik ComboBox dua kali (bebas yg mana aja), Nanti akan muncul tampilan seperti ini (Contoh ComboBox yg gue klik adalah ComboBox1)(ComboBox1 ini akan berisi size sepatu dan apabila size sepatu di ComboBox1 ini di klik option yg di klik akan muncul di Textbox, Contoh TextBox yg gue inginkan keluar size dari ComboBox1 ini adalah TextBox5).

Lalu isikan source code ini di celah yg kosong :

Select Case ComboBox1.Text

Case "35"

TextBox5.Text = "35"

Case "36"

TextBox5.Text = "36"

Case "37"

TextBox5.Text = "37"

Case "38"

TextBox5.Text = "38"

Case "39"

TextBox5.Text = "39"

Case "40"

TextBox5.Text = "40"

Case "41"

TextBox5.Text = "41"

Case "42"

TextBox5.Text = "42"

Case "43"

TextBox5.Text = "43"

Case "44"

TextBox5.Text = "44"

Case "45"

TextBox5.Text = "45"

End Select

Klik ComboBox dua kali (bebas yg mana aja), Nanti akan muncul tampilan seperti ini (Contoh ComboBox yg gue klik adalah ComboBox2)(ComboBox2 ini akan berisi size sandal dan apabila size sandal di ComboBox2 ini di klik option yg di klik akan muncul di Textbox, Contoh TextBox yg gue inginkan keluar size dari ComboBox2 ini adalah TextBox6).

Lalu isikan source code ini di celah yg kosong :

Select Case ComboBox2.Text

Case "35"

TextBox6.Text = "35"

Case "36"

TextBox6.Text = "36"

Case "37"

TextBox6.Text = "37"

Case "38"

TextBox6.Text = "38"

Case "39"

TextBox6.Text = "39"

Case "40"

TextBox6.Text = "40"

Case "41"

TextBox6.Text = "41"

Case "42"

TextBox6.Text = "42"

Case "43"

TextBox6.Text = "43"

Case "44"

TextBox6.Text = "44"

Case "45"

TextBox6.Text = "45"

End Select

Oke ComboBox sudah, sekarang kita akan memasukan source code untuk Button, Nah kita kan punya 4 Button dan semua Button ini fungsinya clear/pembersih dari setiap option ComboBox yg kalian pilih (Misalnya kalian tadinya memilih mau membeli sepatu pada pengisian form diatas dan sudah memilih merk sepatunya lalu kalian berubah pikiran untuk membeli sandal aja dan memilih merk sandal karna setiap pengisian form hanya bisa untuk pemesanan satu barang, maka disitu lah Button clear ini berfungsi).

Gue akan memberikan tutorial Button clearnya nih ya,

Sebelum kita coding Buttonnya kita harus deklarasi kan di  Public Class Form1 dulu, Jika sudah ketemu masukan deklarasi seperti ini (Karna ada 4 Button clear maka kita akan buat 4 deklarasi)

Sub Clear1()

TextBox8.Clear()

ComboBox4.ResetText()

End Sub

Arti dari deklarasi ini adalah baca/masukan clear1, kegunaan clear1 adalah membersihkan TextBox8 dan membersihkan kata kata pada kolom ComboBox4(clear1 ini akan dipakai Button3 untuk membersihkan TextBox8  dan ComboBox4 yg berisi merk sepatu di project yg gue buat)(Apabila ComboBox dan TextBox kalian yg berisi merk sepatu ga sama kaya project gue tinggal ganti aja TextBox berapa dan ComboBox berapa yg kalian gunakan).

Sub Clear2()

TextBox7.Clear()

ComboBox3.ResetText()

End Sub

Arti dari deklarasi ini adalah baca/masukan clear2, kegunaan clear2 adalah membersihkan TextBox7 dan membersihkan kata kata pada kolom ComboBox3(clear2 ini akan dipakai Button4 untuk membersihkan TextBox7  dan ComboBox3 yg berisi merk sandal di project yg gue buat)(Apabila ComboBox dan TextBox kalian yg berisi merk sandal ga sama kaya project gue tinggal ganti aja TextBox berapa dan ComboBox berapa yg kalian gunakan).

Sub Clear3()

TextBox5.Clear()

ComboBox1.ResetText()

End Sub

Arti dari deklarasi ini adalah baca/masukan clear3, kegunaan clear3 adalah membersihkan TextBox5 dan membersihkan kata kata pada kolom ComboBox1(clear3 ini akan dipakai Button1  untuk membersihkan TextBox5  dan ComboBox1 yg berisi size sepatu di project yg gue buat)(Apabila ComboBox dan TextBox kalian yg berisi size sepatu ga sama kaya project gue tinggal ganti aja TextBox berapa dan ComboBox berapa yg kalian gunakan).

Sub Clear4()

TextBox6.Clear()

ComboBox2.ResetText()

End Sub

Arti dari deklarasi ini adalah baca/masukan clear4, kegunaan clear4 adalah membersihkan TextBox6 dan membersihkan kata kata pada kolom ComboBox2(clear4 ini akan dipakai Button2  untuk membersihkan TextBox6  dan ComboBox2 yg berisi size sandal di project yg gue buat)(Apabila ComboBox dan TextBox kalian yg berisi size sandal ga sama kaya project gue tinggal ganti aja TextBox berapa dan ComboBox berapa yg kalian gunakan).

Oke deklarasinya sudah kita lanjut ke Button nya,

Klik Button dua kali (bebas yg mana aja), Nanti akan muncul tampilan seperti ini (Contoh Button yg gue klik adalah Button3)(Button3 ini nantinya akan berfungsi untuk membersihkan ComboBox dan TextBox pemilihan merk sepatu)

Lalu isikan source code ini di celah yg kosong :

Try

Call Clear1()

Catch ex As Exception

MsgBox(ex.Message)

End Try

Klik Button dua kali (bebas yg mana aja), Nanti akan muncul tampilan seperti ini (Contoh Button yg gue klik adalah Button4)(Button4 ini nantinya akan berfungsi untuk membersihkan ComboBox dan TextBox pemilihan merk sandal)

Lalu isikan source code ini di celah yg kosong :

Try

Call Clear2()

Catch ex As Exception

MsgBox(ex.Message)

End Try

Klik Button dua kali (bebas yg mana aja), Nanti akan muncul tampilan seperti ini (Contoh Button yg gue klik adalah Button1)(Button1 ini nantinya akan berfungsi untuk membersihkan ComboBox dan TextBox pemilihan size sepatu)

Lalu isikan source code ini di celah yg kosong :

Try

Call Clear3()

Catch ex As Exception

MsgBox(ex.Message)

End Try

Klik Button dua kali (bebas yg mana aja), Nanti akan muncul tampilan seperti ini (Contoh Button yg gue klik adalah Button2)(Button2 ini nantinya akan berfungsi untuk membersihkan ComboBox dan TextBox pemilihan size sandal)

Lalu isikan source code ini di celah yg kosong :

Try

Call Clear1()

Catch ex As Exception

MsgBox(ex.Message)

End Try

Button clear sudah beres.

Karna RadioButton sepatu dan sandal mempunyai fungsi untuk berpindah form jadi kita membutuhkan form baru dulu (kita membutuhkan 2 Form sekaligus yaitu form2 dan form3).

Cara menambahkan form diproject kita mudah klik WindowsApplication3(Sesuaikan dengan nama project yg pertama kalian buat) adanya dipojok kanan atas lalu pilih Add -> Windows Form

Jika sudah nanti akan muncul tampilan seperti ini dan pilih Installed -> Common Items -> Windows Form -> Isikan Name “Form2” -> Add

Sebelum kita lanjut desain form 2-nya, boleh dicoba di run dulu.

Sudah dirun? Gimana hasilnya? Bisakan? Kalo masih ada yg error tinggalin pesan dikomentar aja ya.

Sekarang kita lanjut ke form2, Isikan form2 dengan item item sebagai berikut :

ITEM	Jumlahnya
RadioButton (Dimasukan SourceCode)	18 Buah
TextBox (Tidak Diapa-apain)	1 Buah
PictureBox (Tidak Diapa-apain)	1 Buah
Button (Dimasukan SourceCode)	3 Buah

Jika sudah susun seperti ini ya (Samain aja biar nantinya ga pusing sendiri hehe)

Cara ganti nama setiap itemnya klik itemnya 1x aja ya lalu cari dikanan bawah tampilan seperti ini lalu cari tulisan Text (Contoh item yg gue klik adalah RadioButton)

Desain sudah selesai sekarang kita akan masukan source code disetiap item agar setiap item ada fungsinya (cara masuk ke jendela tempat pengcodingan tinggal klik 2x item yg ingin dicoding).

Pertama kita akan memasukan source code untuk RadioButton agar setiap RadioButton yg kita klik akan muncul namanya di TextBox yg kita inginkan dan gambar dari Type sepatu diRadioButton itu di PictureBox.

Klik RadioButton dua kali (bebas yg mana aja), Nanti akan muncul tampilan seperti ini (Contoh RadioButton yg gue klik adalah RadioButton1)

Isikan source code ini di celah yg kosong :

TextBox1.Text = RadioButton1.Text

PictureBox1.Image = System.Drawing.Image.FromFile("C:\Users\Rinaldi Andrias\Documents\Visual Studio 2012\Gambar\Sepatu\Adidas\Edberg.jpg")

Arti dari source code "TextBox1.Text = RadioButton1.Text" adalah isi dari TextBox1 = nama dari RadioButton1,

Arti dari source code "PictureBox1.Image = System.Drawing.Image.FromFile("C:\Users\Rinaldi Andrias\Documents\Visual Studio 2012\Gambar\Sepatu\Adidas\Edberg.jpg")" gambar dari PictureBox1 = edberg.jpg yg berlokasi di Local Disk C->User->Rinaldi Andrias->Document->Visual Studio 2012->Gambar->Sepatu->Adidas (Karna kita pakai PictureBox kalian harus menyiapkan beberapa gambar dulu sebelumnya)(Ganti tulisan yg berwarna merah  dengan lokasi dimana kalian menyimpan gambar yg akan ditampilkan apabila RadioButton yg kalian coding kalian klik)(Seperti Sebelumnya source code dari 18 RadioButton ini sebenarnya sama saja yg perlu diganti hanya di RadioButton berapa kalian meng-klik/ingin mengcoding, di TextBox berapa kalian ingin nama dari RadioButton itu keluar, Karna diform ini hanya ada satu TextBox maka TextBox1.Text-nya dibiarkan saja. Satu lagi yg perlu kalian ganti nama foto yg akan ditampilkan dan lokasi foto itu disimpan)

Oke RadioButton sudah, sekarang kita akan memasukan source code untuk Button, Nah diform2 ini kita punya 3 Button, 1 Button clear dan 2 Button berpindah form(back to form1 and next to form4)

Gue akan memberikan tutorial Button clearnya dulu ya,

Sebelum kita coding Buttonnya kita harus deklarasi kan di  Public Class Form2 dulu, Jika sudah ketemu masukan deklarasi seperti ini :

Sub Clear1()

RadioButton1.Checked = False

TextBox1.Clear()

RadioButton2.Checked = False

TextBox1.Clear()

RadioButton3.Checked = False

TextBox1.Clear()

RadioButton4.Checked = False

TextBox1.Clear()

RadioButton5.Checked = False

TextBox1.Clear()

RadioButton6.Checked = False

TextBox1.Clear()

RadioButton7.Checked = False

TextBox1.Clear()

RadioButton8.Checked = False

TextBox1.Clear()

RadioButton9.Checked = False

TextBox1.Clear()

RadioButton10.Checked = False

TextBox1.Clear()

RadioButton11.Checked = False

TextBox1.Clear()

RadioButton12.Checked = False

TextBox1.Clear()

RadioButton13.Checked = False

TextBox1.Clear()

RadioButton14.Checked = False

TextBox1.Clear()

RadioButton15.Checked = False

TextBox1.Clear()

RadioButton16.Checked = False

TextBox1.Clear()

RadioButton17.Checked = False

TextBox1.Clear()

RadioButton18.Checked = False

TextBox1.Clear()

PictureBox1.Image = System.Drawing.Image.FromFile("C:\Users\Rinaldi Andrias\Documents\Visual Studio 2012\Gambar\none.jpg")

End Sub

Arti dari deklarasi ini adalah baca/masukan clear1, kegunaan clear1 adalah membersihkan TextBox1, menghilangkan check yg aktif antara RadioButton1-RadioButton18 (clear1 ini akan dipakai Button3  untuk membersihkan TextBox1 dan menghilangkan check yg aktif antara RadioButton1-RadioButton18 yg berisi merk dan harga sepatu di project yg gue buat) dan menampilkan gambar "none.jpg" di PictureBox1 (Apabila ComboBox, TextBox dan PictureBox kalian yg berisi merk, harga dan gambar sepatu ga sama kaya project gue tinggal ganti aja TextBox berapa, ComboBox berapa dan PictureBox berapa yg kalian gunakan).

Klik Button dua kali (bebas yg mana aja), Nanti akan muncul tampilan seperti ini (Contoh Button yg gue klik adalah Button3)(Button3 ini nantinya akan berfungsi untuk membersihkan TextBox1 dan menghilangkan check yg aktif antara RadioButton1-RadioButton18)

Lalu isikan source code ini di celah yg kosong :

Try

Call Clear1()

Catch ex As Exception

MsgBox(ex.Message)

End Try

Button clear sudah beres, sekarang tinggal Button untuk pindah formnya deh, karna ada Button yg akan berfungsi untuk next ke form4 jadi kita memerlukan form baru lagi.

Cara menambahkan form diproject kita mudah klik WindowsApplication3(Sesuaikan dengan nama project yg pertama kalian buat) adanya dipojok kanan atas lalu pilih Add -> Windows Form

Jika sudah nanti akan muncul tampilan seperti ini dan pilih Installed -> Common Items -> Windows Form -> Isikan Name “Form4” -> Add

Form4 sudah ada sekarang Buttonnya kita coding deh.

Klik Button dua kali (bebas yg mana aja), Nanti akan muncul tampilan seperti ini (Contoh Button yg gue klik adalah Button2)

Lalu isikan source code ini di celah yg kosong :

Form4.Show()

Me.Hide()

Arti dari source code diatas adalah tampilkan form4  dan sembunyikan form2.

Button clear sudah, Button next beres, tinggal satu Button lagi nih yaitu Button back-nya.

Oke langsung aja klik dua kali Button yg tersisa, Nanti akan muncul tampilan seperti ini (Contoh Button yg gue klik adalah Button1)

Lalu isikan source code ini di celah yg kosong :

Form1.Show()

Me.Hide()

Arti dari source code diatas adalah tampilkan form1  dan sembunyikan form2.

Form1 sudah, Form2 beres,Form4 masih poloskan? Tenang karna Form3 akan gue skip tutorialnya karna sama aja ko Form3 dan Form2 cuma bedanya Form2 isinya harga, merk dan gambar sepatu nah klo Form3 isinya harga, merk dan gambar sandal, nanti gue kasih contoh desainnya aja ya? Oke oke.

Nih contoh desainnya

 

Oiya gue kasih juga deh cara penambahan Form3nya biar ga scroll scroll lagi ke atas, tambahkan Form3 ke project kalian dengan cara klik WindowsApplication3(Sesuaikan dengan nama project yg pertama kalian buat) adanya dipojok kanan atas lalu pilih Add -> Windows Form

Jika sudah nanti akan muncul tampilan seperti ini dan pilih Installed -> Common Items -> Windows Form -> Isikan Name “Form3” -> Add

Gue anggap Form1-Form3 udah beres ya? Gue lanjut kedesain Form4 nih

Isikan form4 dengan item item sebagai berikut :

ITEM	Jumlahnya
Button (Dimasukan SourceCode)	4 Buah
GroupBox (Hapus/Kosongkan Text)	1 Buah
Label (Hanya Diganti Text)	7 Buah

Jika sudah susun seperti ini ya (Samain aja biar nantinya ga pusing sendiri hehe)

Sudah selesai desainnya? Jika sudah gue bakal ngejelasin fungsi dari tombol word dan excel diatas.

Fungsi dari Button word dan excel diatas adalah menyalin data yg kita input di form1,2 atau 3 ke Microsoft Word (Auto Word) atau Excel (Auto Excel) bisa juga keduanya. Sebelum kita coding Buttonnya kita harus membuat file word dan excelnya dulu oke.

Buat tampilan wordnya seperti ini

Cara Add/Menambahkan Bookmark mudah ko tinggal buka option Insert->Bookmark seperti ini

Lalu akan muncul tampilan seperti ini (Ini tampilan jendela Bookmark yg sudah ada item Bookmarknya).

 

Masih Belum paham ya? Sebenarnya susah si kalo harus dijelasin pake kata kata gue kasih gambar gif nya aja ya, Nih Gambarnya

Kita focus ke Button wordnya dulu oke, Sebelum kita coding Buttonnya kita harus Add Referense dan deklarasi (ada 2 deklarasi) agar ga terjadi error nantinya, Gue kasih tau nih cara Add Referensenya (Add Referense ini agar visual studionya bisa berhubungan dengan word dan excelnya)

Pilih Project -> Add Referense seperti ini

Lalu akan muncul tampilan seperti ini dan pilih COM -> Cari tulisan Microsoft Word 14.0 Object Library (Ga ada tulisan kaya gini? Gapapa yg penting ada tulisan wordnya) -> Centang kotak seperti digambar -> Ok

Add Referensenya sudah sekarang kita lanjut ke deklarasi yg pertama (susah jelasinya jadi liat gambar aja ya hehe)

  

Tambahkan deklarasi "Imports word = Microsoft.Office.Interop.Word" diatas tulisan "Public Class Form4" seperti gambar diatas

Add Referensenya sudah deklarasi yg pertama juga sudah sekarang kita lanjut ke deklarasi yg ke dua (susah jelasinya jadi liat gambar aja ya hehe)

Tambahkan deklarasi  "Dim appnya As New word.Application" dan "Dim dokumennya As word.Document" diatas tulisan "Public Class Form4" seperti gambar diatas

Kalau file wordnya sudah kedua deklarasinya juga sudah kita lanjut coding Buttonnya deh, Klik Button wordnya dua kali maka akan muncul tampilan seperti ini

Lalu isikan source code ini di celah yg kosong :

dokumennya = appnya.Documents.Open("C:\Users\Rinaldi Andrias\Documents\Visual Studio 2012\Form Pemesanan Sepatu atau Sendal.docx")

dokumennya.Bookmarks("NamaPemesan").Select()

appnya.Selection.TypeText(Form1.TextBox2.Text)

dokumennya.Bookmarks("LokasiAnda").Select()

appnya.Selection.TypeText(Form1.TextBox1.Text)

dokumennya.Bookmarks("Sepatusendal").Select()

appnya.Selection.TypeText(Form1.TextBox4.Text)

dokumennya.Bookmarks("Size").Select()

appnya.Selection.TypeText(Form1.TextBox5.Text)

dokumennya.Bookmarks("Size").Select()

appnya.Selection.TypeText(Form1.TextBox6.Text)

dokumennya.Bookmarks("Merk").Select()

appnya.Selection.TypeText(Form1.TextBox8.Text)

dokumennya.Bookmarks("Merk").Select()

appnya.Selection.TypeText(Form1.TextBox7.Text)

dokumennya.Bookmarks("MetodePembayaran").Select()

appnya.Selection.TypeText(Form1.TextBox3.Text)

dokumennya.Bookmarks("Kontak").Select()

appnya.Selection.TypeText(Form1.TextBox9.Text)

dokumennya.Bookmarks("Model").Select()

appnya.Selection.TypeText(Form2.TextBox1.Text)

dokumennya.Bookmarks("Model").Select()

appnya.Selection.TypeText(Form3.TextBox1.Text)

dokumennya.SaveAs2("C:\Users\Rinaldi Andrias\Desktop\Auto Word dan Auto Excel Vs.Studio\Order dari " & Form1.TextBox2.Text & ".docx")

appnya.Visible = True

"("C:\Users\Rinaldi Andrias\Documents\Visual Studio 2012\Form Pemesanan Sepatu atau Sendal.docx")" = Tempat dimana kalian meletakan file wordnya

"Bookmarks("NamaPemesan")" = Nama bookmark yg tadi kalian buat diwordnya

"(Form1.TextBox2.Text)" = Tempat keluarnya data pada form (Contoh gue ambil dari inputan nama pemesan di form 1) (Contoh adalah TextBox2 di Form1 karna diTextBox itu nantinya keluar nama si pemesan)

"SaveAs2("C:\Users\Rinaldi Andrias\Desktop\Auto Word dan Auto Excel Vs.Studio\Order dari " & Form1.TextBox2.Text & ".docx")" = Tempat dimana kalian akan menyimpan word yg sudah berisi data dari pengisian form (saran jgn samakan nama file word ini dengan file word yg tadi kalian buat)

"appnya.Visible = True" = agar ketika kalian mengklik Button word diform yg sedang berjalan file word yg sudah berisi inputan dari form langsung terbuka

Button wordnya sudah kita lanjut ke Button excel.

Buat file excelnya seperti ini

  

Kalo diword menggunaka bookmark lain lagi diexcel, excel menggunakan range/dikolom berapa data itu akan keluar (Contoh nama pemesan akan keluar di range C8 seperti yg gue udeh tandain digambar)

File excel sudah sekarang kita tinggal Add Referense dan deklarasi (ada 2 deklarasi) agar ga terjadi error nantinya, Gue kasih tau nih cara Add Referensenya (Add Referense ini agar visual studionya bisa berhubungan dengan word dan excelnya)

Pilih Project -> Add Referense seperti ini

Lalu akan muncul tampilan seperti ini dan pilih COM -> Cari tulisan Microsoft Excel 14.0 Object Library (Ga ada tulisan kaya gini? Gapapa yg penting ada tulisan excelnya) -> Centang kotak seperti digambar -> Ok

 

Add Referensenya sudah sekarang kita lanjut ke deklarasi (susah jelasinya jadi liat gambar aja ya hehe)

Tambahkan deklarasi "Imports excel = Microsoft.Office.Interop.Excel" diatas tulisan "Public Class Form4" seperti gambar diatas

 Karna deklarasi yg satu lagi gue tempatinnya di Button jadi kita langsung coding Buttonnya aja ya, Klik dua kali Button excelnya dan akan muncul tampilan seperti ini

Lalu isikan source code ini di celah yg kosong :

Dim myExcelApp As New excel.Application

Dim myExcelBook As excel.Workbook

myExcelApp.Visible = True

myExcelBook = myExcelApp.Workbooks.Open("C:\Users\Rinaldi Andrias\Documents\Visual Studio 2012\Form Pemesanan Sepatu atau Sendal.xlsx")

myExcelApp.Range("C8").Value = Form1.TextBox2.Text

myExcelApp.Range("C9").Value = Form1.TextBox1.Text

myExcelApp.Range("C10").Value = Form1.TextBox4.Text

myExcelApp.Range("C12").Value = Form1.TextBox5.Text

myExcelApp.Range("C13").Value = Form1.TextBox6.Text

myExcelApp.Range("C15").Value = Form1.TextBox8.Text

myExcelApp.Range("C16").Value = Form1.TextBox7.Text

myExcelApp.Range("C17").Value = Form1.TextBox3.Text

myExcelApp.Range("C18").Value = Form1.TextBox9.Text

myExcelApp.Range("C20").Value = Form2.TextBox1.Text

myExcelApp.Range("C21").Value = Form4.TextBox1.Text

myExcelBook.SaveAs("C:\Users\Rinaldi Andrias\Desktop\Auto Word dan Auto Excel Vs.Studio\Order dari " & Form1.TextBox2.Text & ".xlsx")

"("C:\Users\Rinaldi Andrias\Documents\Visual Studio 2012\Form Pemesanan Sepatu atau Sendal.xlsx")" = Tempat dimana kalian meletakan file excelnya

"Range("C8")" = Tempat/kolom berapa yg akan keluar data inputan dari form diexcelnya (Contoh gue ambil dari nama pemesan yg akan keluar di range C8)

"(Form1.TextBox2.Text)" = Tempat keluarnya data pada form (Contoh gue ambil dari inputan nama pemesan di form 1) (Contoh adalah TextBox2 di Form1 karna diTextBox itu nantinya keluar nama si pemesan)

"SaveAs("C:\Users\Rinaldi Andrias\Desktop\Auto Word dan Auto Excel Vs.Studio\Order dari " & Form1.TextBox2.Text & ".xlsx")" = Tempat dimana kalian akan menyimpan excel yg sudah berisi data dari pengisian form (saran jgn samakan nama file excel ini dengan file excel yg tadi kalian buat)

"appnya.Visible = True" = agar ketika kalian mengklik Button excel diform yg sedang berjalan file excel yg sudah berisi inputan dari form langsung terbuka

 Button word dan excel sudah sekarang tinggal Button back to Form1 and exit, Kita akan coding Button back to Form1 nya dulu langsung saja klik 2x Button backnya dan akan muncul tampilan seperti ini

Lalu isikan source code ini di celah yg kosong :  

Form1.Show()

Me.Hide()

Arti dari source code diatas adalah tampilkan form1  dan sembunyikan form4.

Tinggal satu Button lagi deh yaitu Button exit langsung saja klik2x Button exitnya dan akan muncul tampilan seperti ini

Lalu isikan source code ini di celah yg kosong :

Dim x = MsgBox("Are You Sure?", MsgBoxStyle.YesNo + MsgBoxStyle.Question, "Confirmation")

If x = vbYes Then

Me.Close()

Form1.Close()

Form2.Close()

Form4.Close()

'End

End If

Arti dari source code diatas adalah x = munculnya semacam kotak baru bernama “Confirmation” dan bertuliskan “Are You Sure?”, kotak ini akan memunculkan pilihan “Yes or No” dan apabila kalian memilih Yes maka Form1-Form4 ditutup

Nih gambar gif dari aplikasi yg tadi kita buat

Oke Sekian dulu tutorial dari gue maaf kalau ada kata yg ga pantas dan maaf apabila penjelasan gue kurang jelas, Masih Bingung? Kolom komentar masih setia nungguin dibawah ko hehe.

See you Next Time.