On Selasa, 14 Februari 2012
sekarang langsung saja siapkan software yang dibutuhkan :
1. Microsoft Visual Basic .NET 2010 (apabila ada .NET 2008, gpp tapi mungkin ada sedikit perbedaan)
2. Kopi dan rokok (Bagi programmer yang merokok) atau Teh manis dan Cemilan (bagi yang tidak merokok.)
Sekilas tentang tingkat kesulitan = Advanced & Newbie (Ok)
Kalo sudah, langsung kita mulai...
Tutorial Disini saya bagi dua, yaitu tutorial 1 dan 2.
#Tutorial 1 - Design
- Buat sebuah Project Baru (Ctrl + N) pilih Windows Application, beri nama "MultiTabbedNotePAd.vb" atau nama lain terserah anda. :D
- Resize Form1 menjadi ukuran 683,448 di tempat minimum size tepatnya di PropertiesBox lalu rubah nama Form1 terserah anda.
- Sekarang masukin 1 buah Menustrip, 1 Tabcontrol dan 1 SavefileDialog dari Toolbox yang di drag ke Form Control.
> Pada MenuStrip masukan menu ini :
File
Edit
Format
About
> Lalu dibawah File kita masukan sub menu ini :
Add Tab
Remove Tab
Open
Save
Exit
> Dibawah Edit masukan sub menu ini :
Undo
Redo
(Separator)
Cut
Copy
Paste
Delete
Clear All
Select All
> Dibawah Format masukan sub menu ini :
Font
Colour
> Dan pada menu About, tidak dimasukan apa - apa pada tutorial ini, atau terserah anda deh mau masukin apa juga gpp.
> Ok sekarang giliran TabControl (kita singkat TC aja), beri nama pada design di propertiesBox Tabcontrol2, dock tab control dibawah menuBar yang tadi, ok..
Isi collection pada Tabcontrol (cari collection di propertiesBox klik ... ) dan masukan ini :
Home
Edit
Format
Hingga akhirnya seperti gambar dibawah ini :
- Setelah itu kita kasih button dibawah Tabcontrol2 - Home, Kasih nama buttonnya :
Add Tab
Remove Tab
Open
Save
- Lalu pada Edit dan Format Tabcontrol2 anda bisa memasukan button juga yang datanya sama dengan Edit dan Format di MenuStrip diatas, desain seperti gambar dibawah.
- Terakhir, silahkan anda klik file diatas dan add new item, pilih About Box..
Sudah? Ok sekarang silahkan diminum dulu minuman kopi atau teh, istirahat sejenak, hehe..:D
Kalo sudah, sekarang kita mulai tutorial 2
#Tutorial 2 - Coding
Sekarang Double click form1.
Akan muncul kode berikut :
Lalu masukan ini dibawahnyaCode:Public Class Form1
Lalu dibawahCode:Dim I As Integer = 1
kita masukan RichTextBoxControl, copy paste ini diantara kode diatas (Baris Kosongnya).Code:Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load End Sub
Sekarang kembali ke desain, dan klik dua kali pada add tab di menu strip dan masukan code ini :Code:Dim Edit As New RichTextBox TabControl1.TabPages.Add(1, "Page " & I) TabControl1.SelectTab(I - 1) Edit.Name = "TE" Edit.Dock = DockStyle.Fill TabControl1.SelectedTab.Controls.Add(Edit) I = I + 1
Kalo diperhatiin, sama aja kayak kode yang pertama cuma beda penempatan aja, tapi ini berfungsi.Code:Dim Edit As New RichTextBox TabControl1.TabPages.Add(1, "Page " & I) TabControl1.SelectTab(I - 1) Edit.Name = "TE" Edit.Dock = DockStyle.Fill TabControl1.SelectedTab.Controls.Add(Edit) I = I + 1
Sekarang kembali ke desain dan double click RemoveTab, lalu masukan code ini :
Ok sekarang kembali ke desain, di menustrip, double click open dan masukan code ini :Code:If TabControl1.TabCount = 1 Then MsgBox("Error You Can't Remove The Last Page", MsgBoxStyle.Critical) ‘Masukin kata - kata apa aja didalam messagebox kalo terjadi kesalahan ‘Jadi intinya kode ini bakal melarang kita me-remove kalo seandainya tabnya cuma 1 lagi ‘Ok, paham kan? Exit Sub Else End If TabControl1.TabPages.RemoveAt(TabControl1.SelectedIndex) TabControl1.SelectTab(TabControl1.TabPages.Count - 1) I = I - 1
Lakukan hal yang sama seperti diatas kali ini double click di menustrip - file - saveCode:Dim OpenFileDialog1 As New OpenFileDialog Dim AllText As String = "", LineOfText As String = "" ‘Yang dibawah ini, dia mem-filter jenis file tipe OpenFileDialog1.Filter = "All Files|*.*" ‘Kalo yang ini menampilkan open dialog OpenFileDialog1.ShowDialog() Try FileOpen(1, OpenFileDialog1.FileName, OpenMode.Input) Do Until EOF(1) LineOfText = LineInput(1) AllText = AllText & LineOfText & vbCrLf Loop CType(TabControl1.SelectedTab.Controls.Item(0), RichTextBox).Text = AllText Catch Finally FileClose(1) End Try
Sama seperti sebelumnya, sekarang dibagian Exit pada menustrip, masukan code berikutCode:Dim SaveFileDialog1 As New SaveFileDialog ‘Kode ini menunjukan file tipe apa yang bisa di save ‘Silahkan masukan file tipe yang anda mau, dalam kutipan harus yang bisa dibaca. ‘Seperti HTML, CSS, JS, dll... SaveFileDialog1.Filter = "Rich Text Files|*.rtf|Text Files|*.txt" ‘Ini dibawah mengingatkan anda jika ada show dialog baru anda ga bisa kembali ke 'program utama tanpa close dialog terlebih dahulu. SaveFileDialog1.ShowDialog() FileOpen(1, SaveFileDialog1.FileName, OpenMode.Output) PrintLine(1, CType(TabControl1.SelectedTab.Controls.Item(0), RichTextBox).Text) FileClose(1)
Sekarang kembali ke desain dan pada menuStrip - Edit - klik dua kali pada Undo, masukan code berikut :Code:Dim msg As String Dim title As String Dim style As MsgBoxStyle Dim response As MsgBoxResult msg = "Apa anda yakin mau keluar?" 'silahkan anda ganti dengan versi anda. style = MsgBoxStyle.Information Or _ MsgBoxStyle.YesNo ‘Pilihan Yes atau No title = "Notepad Canggih Seperti Wordpad" ' Masukan title program anda disini. response = MsgBox(msg, style, title) If response = MsgBoxResult.Yes Then ' Ngerikan algoritmanya ini ? 'Kalo menekan yes maka akan close.. Me.Close() Else 'Tapi kalo tekan No, maka akan tetap terbuka... Me.Show() End If
dan pada Redo masukan code ini :Code:CType(TabControl1.SelectedTab.Controls.Item(0), RichTextBox).Undo()
untuk Select All, cut, copy, paste, dll sama aja. Tinggal mengganti .Redo () menjadi .SelectAll () dan lain lain, Anda bisa kan?Pasti bisa..Code:CType(TabControl1.SelectedTab.Controls.Item(0), RichTextBox).Redo()
Tapi ingat pada Clear All berbeda, ini adalah codenya :
Sekarang kita pindah pada menu strip format, klik dua kali pada Font dan masukan code berikut :Code:CType(TabControl1.SelectedTab.Controls.Item(0), RichTextBox).Text = “”
Sekarang bagian format, double clik format dan masukan code berikut.Code:If TabControl1.TabCount = 0 Then End If Dim FS As New FontDialog FS.ShowDialog() CType(TabControl1.SelectedTab.Controls.Item(0), RichTextBox).Font = FS.Font 'Code diatas berfungsi memilih jenis font yang telah diinstall pada windows anda.
Lalu terakhir, kembali ke desain dan klik dua kali About, masukan code berikut.Code:If TabControl1.TabCount = 0 Then End If Dim FC As New ColorDialog FC.ShowDialog() CType(TabControl1.SelectedTab.Controls.Item(0), RichTextBox).ForeColor = FC.Color
Untuk mengedit UI (User Interface) pada About, silahkan double click pada About.vb (New Item yang anda masukan sebelumnya) dan silahkan isikan nama anda sebagai legalitas bahwa ini adalah program anda. :DCode:AboutWordPad.ShowDialog() ‘AboutWordPad bisa anda ganti dengan new item yang anda masukan tadi sebelumnya. 'Namun AboutWordPad adalah basic dari WordPad yang menunjukan Aboutnya..
Lalu bagaimana dengan button2x di tabcontrol2 tadi?
Sama codenya seperti yang di menustrip diatas, silahkan anda double click button dan masukan code yang sama sesuai nama buttonnya, misalkan copy maka masukan code yang sama dengan copy di menustrip..
Ok kalo sudah, dan saya asumsikan anda teliti mencopy dan menyimak tutorial ini. Lalu anda silahkan debug dengan menekan panah hijau kearah kanan di toolbar atau dengan menekan F5.
Search Box
dfggfgf