Today I am going to explain how you can manually populate a TreeView control in WPF using F#. If you want to populate a TreeView Manually in WPF, you have to use a F# WPF Application template and need to add some reference.
A TreeView is a graphical user interface element that represents a hierarchical view of information. A TreeView is a window that can list multiple items in hierarchy like Directories in Windows Explorer. A TreeView can be seen in file manager applications. Where they allow the user to navigate the file system directories. A TreeView holds a collection of nodes so if you want to add a new node you need to define a new node and then you can add that node to the TreeView's collection. You can change the appearance of a TreeView with TreeView Style.
Properties of TreeView
Properties |
Description |
Adapter |
Gets the browser-specific adapter for the control |
BorderColor |
Get/set the border color of the web control |
Height |
Get/set the height of the web server control |
MaxDataBindDepth |
Get/set the maximum numbers of tree levels to bind to the TreeView control |
ShowExpandCollapse |
Get/set a value indicating whether expansion node indicators are displayed |
Width |
Get/set the width of the web server control |
TabIndex |
Get/set the tab index of the web server control |
SkinId |
Get/set the skin to apply to the control |
Methods of TreeView control
Methods |
Description |
EndUpdate |
Enables the redrawing of the TreeView |
ExpandAll |
Expand all the tree nodes |
GetNodeAt |
Retrieves the node that is at the specified point |
HitTest |
Provides node information, given at a point |
DoDragDrop |
Starts a drag-and-drop operation |
Dispose |
Releases all resources used by the component |
CreateGraphics |
Create the Graphics for the control |
CollapseAll |
Collapses all the tree nodes |
Getting Started
These are the steps to manually populate the Treeview in WPF using F#.
Step 1: First open a new project in F# using Visual Studio 2010 and select F# WPF application template and name it. As done in the following image.
Step 2: Now add the following references in your project by right-clicking on your project in the Solution Explorer.
-
PresentationCore
-
PresentationFramework
-
WindowsBase
- System
- System.Xaml
Step 3: When add all the references. Your Solution Explorer will look like following image.
Step 4: Now click on Program.fs file and write the following code in the Program.fs window; your window will look like below.
#light
open System
open System.Windows
open System.Windows.Controls
open System.Windows.Input
open System.Windows.Media
let addSubItems items (branch:TreeViewItem) = items |> Seq.iter (fun item ->
item |> branch.Items.Add |> ignore)
let tree = new TreeView()
tree.Items.Add
(let animalBranch = new TreeViewItem(Header="Languages")
animalBranch.Items.Add
(let branch = new TreeViewItem(Header=".NET version")
let dogs = [".NET3.0";".NET3.5";".NET 4.0"]
addSubItems dogs branch
branch) |>ignore
animalBranch.Items.Add
(let branch = new TreeViewItem(Header=".NET Languages")
branch.Items.Add(new TreeViewItem(Header="ASP.NET")) |>ignore
branch.Items.Add(new Button(Content="VB.NET")) |>ignore
branch.Items.Add(".NET") |>ignore
branch) |> ignore
animalBranch.Items.Add
(let branch = new TreeViewItem(Header=".NET Code Behind")
let primates = ["C#";"Visual Basic";"F#"]
addSubItems primates branch
branch) |> ignore
animalBranch) |> ignore
tree.Items.Add
(let branch = new TreeViewItem(Header="Books")
let minerals = ["F# Books";"WPF Books";"FrameWork Books"]
addSubItems minerals branch
branch) |> ignore
tree.Items.Add
(let branch = new TreeViewItem(Header="WebSites")
let vegetables = ["c-sharpcorner.com";"vbdotnetheaven";"Mindcracker.com"]
addSubItems vegetables branch
branch) |> ignore
let window = new Window(Title="WPF TreeView using F#",
Content=tree)
#if COMPILED
[<STAThread()>]
do
let app = Application() in
app.Run(window) |> ignore
#endif
Step 5: Now press F5 to execute the code.
Output
Summary
In this article I have discussed how to populate a TreeView manually in WPF using F#.