Menggunakan TreeView Visual Basic .Net

icon post
Hi teman-teman visualbasic-indonesia bagaimana kabar kalian? Bah... :D wkwkwkwkwkwkwk semoga baik (*_-)

kali ini admin membagikan sedikit tutorial tentang bagimana cara mengeset dan mengisi treeview serta membuat event klik pada node-node treeview tersebut (kalau di kilik nodenya, trus bisa dibuat proses kayak commandbutton :D)

Sebenarnya TreeView dapat dibuat icon gambarnya, tapi untuk sekarang ini kita cukup mempelajari bagaimana cara membuat Node-node tersebut.

TreeView adalah komponen Visual Basic yang sangat bagus dan populer, seperti gambar diatas treeview mempunyai node-node (titik-titik) yang dapat mempunyai sub-node pada setiap nodenya tergantung kebutuhan, sebenarnya kita sudah sangat familiar terhadap treeview ini, karena kita sering membuka Microsoft Explorer Windows ketika melihat-lihat file dan folder yang ada dalam laptop atau komputer kita.

Analogi pengisian node ini sama seperti pada sebuah organisasi, kenapa?

Pertama-tama, Buat Nama Organisasi Misal Programming Club (node pertama)
Kemudian dibuat 3 Node lagi, yaitu WebProgramming, VisualProggramming, dan Robotics (sub node permtama)
Kemudian pada masing-masing node itu dimasukkan node anggota-anggota.(node terakhir)

jadi? kira-kira seperti itulah analogi pengisian TreeView saudara-sauda... wkwkwkkwkkwkwkw

Tetapi kita juga dapat membuat TreeView ini menjadi seperti menu-menu drop-down pada website, atau juga yang lainnya. Wah, banyak banget kegunaannya ya? Penasaran bagaimana cara membuatnya...? ChekItOUt..... :D hehehehhehe

1. Pertama-tama buat dulu projek baru pada Visual Basic .Net kalian guys... :D

Step 1 - Tree Component

2. kemudian masukkan komponen TreeView pada projek tersebut seperti dibawah ini : 
step 2 - design

3. Kemudian double clik form teman-teman, atau masuk kedalam event Load .. ketikkan kode dibawah ini guys :D

Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
        Dim _node As New TreeNode
        _node.Text = "Node Tutorial"

        For i As Integer = 0 To 2
            Dim _node_node As New TreeNode
            _node_node.Text = "Node " & i
            _node_node.Nodes.Add("node" & i & "1", "Sub Node 1")
            _node_node.Nodes.Add("node" & i & "2", "Sub Node 2")
            _node_node.Nodes.Add("node" & i & "3", "Sub Node 2")
            _node.Nodes.Add(_node_node)
        Next
        TreeView1.Nodes.Add(_node)
End Sub

4. Untuk membuat event clik pada tree view, cobalah pergi ke menu design, dan double click komponen treeview terseubu dan pada bagian kanan atas carilah event, NodeMouseClick , sebelum membahas tentang mouse click ini perhatikan penjelasan dibawah ini...

_node_node.Nodes.Add(KEY,TEXT)

untuk medapatkan event click pada node yang benar, maka setiap node diberi nama key masing-masing(berbeda). Karena KEY tersebutlah nantinya yang akan digunakan untuk membedakan node yang memiliki event click.

5. Kemudian pada event NodeMouseClick  ketikkan kode dibawah ini : 

 Private Sub TreeView1_NodeMouseClick(ByVal sender As Object, ByVal e As
 System.Windows.Forms.TreeNodeMouseClickEventArgs) Handles TreeView1.NodeMouseClick
        Select Case e.Node.Name
            Case "node01"
                MsgBox("Node 1")
            Case "node11"
                MsgBox("Node 2")
            Case "node21"
                MsgBox("Node 3")
        End Select
End Sub

Keterangan : 
    Select Case e.Node.Name
            Case "KEY"

Name maksudnya adalah KEY, dan KEY diisi dengan key yang kita buat pada masing-masing node. Got It?

jika yang anda ketik gagal, cobalah download contoh program dibawah ini : 


(* Artikel Tutorial dan Source Code oleh visualbasic-indonesia

Comments