How to program in VB.NET for the first time
My First Browser Tree Program in VB.NET
Introduction
Within the first few weeks of programming in VB.NET, your user interface should become a bit more sophisticated. The blog VBNETFOREST at WordPress (http://vbnetforest.wordpress.com) offers the source code as well as step by step in a single lesson to help you learn how you can turn your form into a browser tree so that you can display information in a structure of limitless complexity.As advertised by its slogan, VB.NET for the rest of us, this blog does not put you through an agony of extraneous verbiage. With two procedures plus the provided source code, you can in few minutes turn a simple form into a sophisticated browser tree, which is a window divided into two panels: a collapsible tree view on the left and a browser box on the right. When done coding your user can click on a node to show a different web page on the right. The short link to this lesson is http://wp.me/p1ISdW-5r (case sensitive). Or you can find it on http://vbnetforest.wordpress.com/lessons
Procedure 1 – Getting Started
A browser tree is a window divided into two panels. On the left is a collapsible tree view and on the right is a browser box. Click on a node to show a different web page on the right. To get started with the programming of a browser tree in VB.NET, do the following steps:
- Start Visual Studio and select the menu File » New Project …
- Select project type VB Windows and template WinFormApp.
- Set the application name as vs2008winAppBrowserTree or so.
- SelectFile » Save All
- Save the project and create the solution vs2008browserForest
- Select the menu View » Toolbox
- Drop down the tool collection Menus & Toolbars
- Drag the StatusStrip over and drop it on Form1.
- On the StatusStrip dropdown, select ToolStripStatusLabel1.
- Drag the MenuStrip over and drop it on Form1.
- Do the next two steps as instructed: using the exact spelling.
- Add &File and &Close menu items.
- Add&Help and &About menu items.
- Drop down the tool collection Components.
- Drag the Timer over and drop it on Form1.
- Press F7 to View » Code
- Replace the default code with the source code as shown below.
- Run the program and wait 5 seconds to see the status message disappears by itself.
- If all works as expected, follow the steps in the next procedure.
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
MsgBox("Welcome to " & s, MsgBoxStyle.Information, .ProductName) |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ToolStripStatusLabel1.Text = s |
|
|
|
|
Timer1.Enabled = |
|
|
|
|
|
|
|
|
|
Form1_MouseMove_StartTime = Now |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ToolStripStatusLabel1.Text = "" |
|
|
|
|
|
|
|
|
|
|
|
|
Procedure 2 – Add Tree View and Browser Box
- Open the project you created in the procedure prior to this.
- Drop down the tool collection Containers.
- Drag the SplitContainer control over and drop it on Form1.
- Set its border style to be fixed single.
- You should see Panel1 and Panel2 on Form1.
- Drop down the tool collection Common Controls.
- Drag the TreeView control over and drop it on Panel1.
- Click on the visible right arrow and dock the control.
- Drag the WebBrowser control over and drop it on Panel2.
- On the right of File and Help click on the blank spot.
- Do the next step as instructed: using the exact spelling.
- Type in and create new menu items: &View and &Tree
- Drag the View menu over and drop it in between File and Help.
- You should now see only three menu items on the menu bar.
- You should see only a single item under each of the three menus.
- Copy the source code as shown right below this procedure.
- Press F7 to view the source code.
- Insert the new code right above the End Class statement at the bottom.
- Run and test the new feature View » Tree
- If all works as expected, follow the steps in the next procedure.
|
|
|
|
|
|
|
|
|
.Panel1MinSize = 0 |
|
.Panel2MinSize = 0 |
|
|
.SplitterDistance = 0 |
|
|
|
|
TreeToolStripMenuItem.Checked = |
|
|
|
|
|
|
.Panel1MinSize = 25 |
|
.Panel2MinSize = 25 |
|
.SplitterDistance = .Width / 3 |
|
|
|
|
TreeToolStripMenuItem.Checked = |
|
|
|
|
ToggleTreeView = TreeToolStripMenuItem.Checked |
|
|
|
|
|
|
|
ToggleTreeView() |
|
|