Tutorial VB.NET 2010 - Membuat Notepad Dengan Multi Tab Function

Cukup perkenalannya, 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 Tabcontrol1 - Home, Kasih nama buttonnya :
Add Tab
Remove Tab
Open
Save

- Lalu pada Edit dan Format Tabcontrol1 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..

Kalo sudah, sekarang kita mulai tutorial 2

#Tutorial 2 - Coding

Sekarang Double click form1.

Akan muncul kode berikut :

Code:

Public Class Form1

Lalu masukan ini dibawahnya

Code:

Dim I As Integer = 1

Lalu dibawah

Code:

 Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load

    End Sub

kita masukan RichTextBoxControl, copy paste ini diantara kode diatas (Baris Kosongnya).

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 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.

Sekarang kembali ke desain dan double click RemoveTab, lalu 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

Ok sekarang kembali ke desain, di menustrip, double click open dan masukan code ini :

Code:

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

Lakukan hal yang sama seperti diatas kali ini double click di menustrip - file - save

Code:

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)

Sama seperti sebelumnya, sekarang dibagian Exit pada menustrip, 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

Sekarang kembali ke desain dan pada menuStrip - Edit - klik dua kali pada Undo, masukan code berikut :

Code:

 CType(TabControl1.SelectedTab.Controls.Item(0), RichTextBox).Undo()

dan pada Redo masukan code ini :

Code:

 CType(TabControl1.SelectedTab.Controls.Item(0), RichTextBox).Redo()

untuk Select All, cut, copy, paste, dll sama aja. Tinggal mengganti .Redo () menjadi .SelectAll () dan lain lain, Anda bisa kan?Pasti bisa..

Tapi ingat pada Clear All berbeda, ini adalah codenya :

Code:

CType(TabControl1.SelectedTab.Controls.Item(0), RichTextBox).Text = “”

Sekarang kita pindah pada menu strip format, klik dua kali pada Font 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.

 Sekarang bagian format, double clik format dan 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

Lalu terakhir, kembali ke desain dan klik dua kali About, masukan code berikut.

Code:

 AboutWordPad.ShowDialog()

‘AboutWordPad bisa anda ganti dengan new item yang anda masukan tadi sebelumnya.

'Namun AboutWordPad adalah basic dari WordPad yang menunjukan Aboutnya..

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. :D

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.