Tree View Control for Silverlight.NET

Great toolset.

How can I display an ourglass whilst populate-ing?

In fact all events in xaml code have their corresponding events in c# code not only populate event

Hi Dan,

Below is the XAML code of the page :

<UserControl x:Class="TreeView.Page"
     xmlns="http://schemas.microsoft.com/client/2007"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:liquid="clr-namespace:Liquid;assembly=Liquid"
     Width="400" Height="300">
     <Grid x:Name="LayoutRoot" Background="White" VerticalAlignment="Top" HorizontalAlignment="Left">
         <liquid:Tree x:Name="testTree" Canvas.Top="295" Canvas.Left="200" EnableCheckboxes="true" EnableDragAndDrop="false" Width="200" Height="151" Margin="4" Populate="Tree_Populate" Drop="Tree_Drop" NodeClick="Tree_NodeClick" />
     </Grid>
</UserControl>


I ensured that the populate event has corresponding c# event handler . I tried the demo projects in this article without any changes but the same problem occur.

What do u think is this a visual studio bug?

Hi Zeinab/lycanthrop,

Can you post your XAML code to this page and we'll take a look. Ensure you have no event handlers declared in your XAML that do not have a corresponding C# event handler otherwise you will get compilation errors. Thanks!

Has anyone experienced random crashing of Visual Studio 2008 while using TreeView ?
It is a random event and cannot see any pattern yet.
And has only started since using TreeView.

Am using
Visual Studio 2008 with SP1 Beta 1 with .NET 3.5 SP1
Silverlight Version: 2.0.30523.8

p.s. Besides this, these tools where what was missing in the microsoft control set.

Hi dan ,

Yes this happens when viewing the xaml page.

I tried to close this page and i build and run the project successfully many times without any problem.

Hi Zeinab,

Does this happen when you are using the XAML preview page?

Hi Dan,

Building a basic silverlight project doesn't cause that error , and about running the example project i tried that and i tried to run examples for others Liquid controls but i still have the same problem.

This doesn't happen in all builds but approximately 85% of times that i build or run my project i got the same error.


Thanks for ur reply.

Hi Zeinab,

Have you attempted to download and run the example project rather than typing it in? Have you managed to build a basic Silverlight project and run that without the Liquid controls dll?

Hi

I am trying to use your tree View control but when i build my project i have an error in visual studio informing me that :
         "Microsoft Visual Studio has encountered a problem and needs to close." I am using Liquid.dll version 4.9 and i just tried the xaml code in this article. i don't know what causes this error .

I have the same error when reying to build your example.
Any Help please.

Thanks.

Hi Jason,

Thanks for the bug report. We have managed to replicate the problem you have been having with the Expand() method for the Node control and you are right, the introduction of the expand animation has introduced this bug to the Expand() method when called programatically.

The error only occurs when trying to expand a node that has been added programitally and does not affect nodes generated in XAML.

We'll get this addressed shortly. Thanks again!

Hi,

I have upgraded to the 4.9 version of the Tree View control. I now have a problem when I try to programmatically add tree nodes and expand them using the Node.Expand() method. This is the exception I get.

System.Reflection.TargetInvocationException: Exception has been thrown by the target of an invocation. ---> System.NullReferenceException: Object reference not set to an instance of an object.
    at Liquid.Node.SetChildVisibility(Boolean visible)
    at Liquid.Node.Expand()

You should be able to repro this by programmatically creating a parent node and then add a child node to it and then call Expand() on the parent node.

I suspect the problem might be related to how there is now an animated expanding storyboard that runs when a node is expanded. I'm pretty sure this worked in the 4.8 version.

Here is repro case... I modified the "TreeView" sample from this site and in the Tree_Populate method I programmatically add a node under the "My Music" node and then call Expand() for that node:

...
case "0":
try
{
Node n = new Node("1", "My Music", true, "TreeView;component/images/folder.png", "TreeView;component/images/folderOpen.png");
nodes.Add(n);
n.Expand();
}
catch (Exception ex)
{
string msg = ex.Message;
}
...

Is this a bug in the TreeView control?

Jason

Hi Phil,

Try replacing:

nodes.Add(new Node("0", "Issue Tracker", true, "IssueTracker;component/images/world.png"));

with:

nodes.Add(new Node("0", "Issue Tracker", true, "images/world.png"));

In Silverlight 2 BETA 2 you no longer have toi specify the assembly name and 'component', I've updated the examples above too. Let us know if your still having problems!

Oops, sorry about the spaces

Hi

I am trying to populate a Tree, however I get the JS error 'Sys.InvalidOperationException: ImageError #4001 in control 'Xaml1': AG_E_NETWORK_ERROR'

My image has been added as a Resource, and I am at my wits end trying to fix this.

Here is an example of my code:


private void Tree_Populate(object sender, TreeEventArgs e)
         {
                ObservableCollection<Node> nodes = (sender is Tree ? ((Tree)sender).Nodes : ((Node)sender).Nodes);

                if (sender is Tree)
                {
                     nodes.Add(new Node("0", "Issue Tracker", true, "IssueTracker;component/images/world.png"));
                }
                else
                {
                     // TODO: Add code here
                }
         }
Am I missing something????

Thanks

Phil

Hello Jason,

Glad you like the controls, and thanks for the bug reports we'll get these resolved in the next version. Thanks!

Hello, I am using your Tree View control. Great control! Very very nice work.

Just want to report a couple bugs I found with the 4.8 version in case you didn't know of these:

When using the Node ctor, such as this:
Node node = new Node(id, title, hasChildren, icon, iconExpanded);
I noticed that the iconExpanded is not being set. If I specify the path to two different icons for icon and iconExpanded, the path to icon is set for both of those two. If I set the node.IconExpanded property directly, that works fine.

When attaching a set of created Nodes to a parent node in code, such as this:
parentNode.Nodes = MyMethodThatCreatesTreeNodes();
It seems that the ParentNode for each of the new child nodes is not being set properly. It is null for all the children nodes. So, I wrote code after this like this:
foreach (Node node in parentNode.Nodes)
{
if (node.ParentNode != parentNode)
node.ParentNode = parentNode;
}
To properly set the ParentNode of each child node.

Hello,

Yes this is a bug in the current version and is being fixed in the next release, thanks for reporting this and for your patience during this busy period!

Hello,

Treeview does not resize dynamically - unless I'm missing something obvious :)

The treeview is contained within an autosizing grid. On the treeview control I have height and width = auto, alignment = stretch and margins = 10. The treeview control starts off very small. It adjusts its' size when nodes are expanded, allowing all nodes to be viewed, but this continues even when it pushes the control off the edge of the screen.

It's very frustrating becuase this inability to resize dynamically makes my application look amateurish. Please help!!

Hi,

When I place the treeview in a grid with multiple rows and columns and I set the width and height to auto it does not stretch to the available width and height. I also tried the HorizontalAlignment="Stretch" VerticalAlignment="Stretch" but this makes no difference.
Can you help me figure out what I'm doing wrong?

Kind regards,

Rob Houweling

Hello,

There is no way at the moment to enable connector lines, this is on the list for future enhancements, thanks for the post!

Hello - Is there a way to enable the TreeView connector lines? Or will this be enabled in the future? Thanks!

Hello Dan!
I'm working with your treeview for 3 months, and seriously it's a very good work!
I just have a question, I need to populate a node by the code, not just by clicking on the cross of the node...
How can I do?
I need something like myNode.Populate()..... That's already exists? (I don't think) That will be available soon?

Sorry for my english

Thanks in advance,
Adrien

Hello Phil,

We have identified a problem with the tree re-sizing correctly when the Width/Height properties are set at runtime and have fixed them in the next version which will be available in the coming week. Thanks for identifying this!

Dan,

Thank you for your response. I've done some further testing and am definitely experiencing problems with run-time re-sizing. If you can run some tests of your own, that would be great.

Here's a summary of my tests so far:

I've got a treeview that starts off with two nodes where HasChildren = true. It is on a grid with height and width set to Auto and a uniform margin on all sides. The Silverlight object re-sizes with the browser and so does the Page.Xaml user control and LayoutRoot grid element.

The treeview starts off very small. When a node is expanded, I use the NodeExpanded event to add two child nodes to it, also with HasChildren = true. All expansions then draw the treeview at the size required for showing the nodes and this continues even if it pushes the treeview control off the edge of the Silverlight object canvas.


If you'd like my test program, please feel free to e-mail me with an address where I can send it.

Thanks.

Hello,

The re-sizing should work fine, we'll run some tests and get back to you on this one. Thanks for letting us know!

Hi,

I do not seem to be able to dynamically re-size the TreeView at run time. Is this something you know about?

I've tried making the control re-size by a few methods. I've had it on a Grid and used stretch alignment and margins. I've also tried to manually re-size the control on both a grid and a canvas by using SetValue to set the HeightProperty and WidthProperty values when the SizeChanged event triggers. It seems to initialise with the size ok, but it then remembers it and overrides any attempt to change it.

Thanks.

Hi again,

silly mistake on the last post, so feel free to ignore it!
While the new version was running on the silverlight control, unfortunately the xap file still insisted on using the old version.

Hi Dan,

Brilliant controls: I'm currently using version 4.7 having upgraded a program I'v been playing around with since beta 1 - When attempting to enable checkboxes on my treeview I get the following error (using firebug)

System.ArgumentException: DependencyProperty of type System.Double cannot be set on an object of type System.Int32 at System.Windows.DependencyObject.SetObjectValueToCore(IntPtr oPtr, DependencyProperty dp, Object value) at System.Windows.DependencyObject.SetValueInternal(DependencyProperty dp, Object value, Boolean isSetByStyle, Boolean isSetByBuiltInStyle) at System.Windows.DependencyObject.SetValueInternal(DependencyProperty dp, Object value) at System.Windows.DependencyObject.SetValue(DependencyProperty dp, Object value) at Liquid.Node.UpdateVisualState() at Liquid.Node.UpdateCheckbox() at Liquid.Node.set_EnableCheckboxes(Boolean value) at Liquid.Tree.set_EnableCheckboxes(Boolean value)

Is there currently a workaround for this?
My code at the moment is simply ContactListTree.EnableCheckboxes = true;

Hello,

Thanks for the bug report, the switch-over to Silverlight 2 BETA 2 has broken a few things. This will be resolved soon.

Hi ,
There is bug in treeview ver.4.6
EnableCheckbox option does not have any change.

Please Check this option .

Thanks

mmilella:

Yes, there is a bug in the treeview control, it is under investigation/fixing at this moment and we hope to get this resolved in the next release.

kevinli:

Changing the font in the TreeView is in the next version.

Thanks for your patience!

I cannot get node events to fire... I have tried a number of them but have had no luck. The event I need it NodeExpanded. Is there something I am missing?

BTW Awesome Controls!!

Hi,

Can the TreeView font be changed?


Thanks,

Kevin

Hi,

Nodes are not editable at the moment on the Treeview itself, the text can only be changed programatically by setting the Title property. This is a good suggestion and has been added to the list of improvements for the next version!

Is there a way to rename a node as in WinForms by pressing F2 or any other key? I have looked in the demo and didn't see a way to accomplish this.

Thanks

Hi

When I add nodes programmatically and set EnableCheckboxes = true, they do not show up. However if I set the property through the Tree_node click event they show up fine.

Also, if I set the tree property EnableCheckboxes = true, then I can selectively disable checkboxes for child nodes

I am using Liquid Controls 4.4.

Hi

When I add nodes programmatically and set EnableCheckboxes = true, they do not show up. However if I set the property through the Tree_node click event they show up fine.

Also, if I set the tree property EnableCheckboxes = true, then I can selectively disable checkboxes for child nodes

I am using Liquid Controls 4.4.

Hi Dan,

Thanks for the speedy reply.

Yes I realised after I posted the Load was a standard event, sorry.

I will still need to reload the data for other reasons. Is there anywhere else I should be putting the ExpandAll call? I tried directly after the BuildRoot method call but whilst that does force the control to recursivly load all the sub nodes, it leaves the root visually collapsed. I tried a direct call to tree.Nodes[0].Expand() but that caused the rest of the tree to dissapear. I figured that was maybe because the tree was being populated asyncronously.

As for the little bug; yes I will try to break it down and send you the minimum code necessary to reproduce.

Thanks
P

Hello Paul,

Thanks for your comments. The Loaded event is a standard Silverlight control event and isn't used by the Tree control to indicate all data is loaded. We are looking at implement such an event at the moment.

The issue you are having with the duplicate nodes when dragging and dropping, I was unable to replicate this using the treeview demo on this site, do you have any sample code demonstrating the problem? If so, email it to us: support@vectorlight.net!

Hi there,

I am dynamically building the tree from code. I would like to be able to epand all nodes the moment the data has finished loading.

To do this I added a Loaded event handler and put a call to the tree.ExpandAll() method in there.

It does not appear that the Loaded event gets fired.

P.S.
One reason I am doing this revolves around the fact I want to reload the data each time I move a node because the control currently seems to have a small bug. When I drag a node from parent a to parent b, then drag the same node back to parent a - I get two identical nodes under parent a until I drag one back to parent b.

Thanks.
(Nice controls though :)

I now have a similar issue to one down further in this thread. I have a tree control within a split grid control. When I resize the split grid, the tree control losses it's scroll bars. Some nodes are hidden with no way to access them (without being able to scroll). However, when I click on a folder node to expand/contract it, the scrollbars come back and all works fine until I resize the workspace again via the split grid. Any work around or fix for this?

Hello,

The reason the screen whites out is because the image URL's in your Node declarations are incorrect or the images are missing. In the first example (The XAML one) there is the following attribute...

Icon="TreeViewXAML;component/images/folder.png"

The bit that says "TreeViewXAML" is the name of your project dll and in your project root folder the following file must exist and be included in your project as a resource...

"images/folder.png"

If the file is missing then .NET throws an exception and you get the white screen.

That's why the downloaded zip example works and your manual effort does not. Please let us know if you are still having problems with this!

I should also add to the comment below that when I download the sample project (TreeviewXAML) it works fine. When I follow the step by step instructions on this page to create a new Silverlight project and then insert this same tree, it doesn't work for me. I see the tree for a split second in the browser, then it dissappears. Any thoughts? Thanks.

I followed the instructions for the tree as listed on this page precisely. However, when the test page renders, it shows the tree control for a split second and then the screen whites out. There must be an exception occuring somewhere. I just downloaded the newest version. I'm building it with VS2008. Any ideas? I have all the xaml lines and reference to Liquid.dll set up in the project. I'd like to use this if I can get it to work.

Thanks.

I followed the instructions for the tree as listed on this page precisely. However, when the test page renders, it shows the tree control for a split second and then the screen whites out. There must be an exception occuring somewhere. I just downloaded the newest version. I'm building it with VS2008. Any ideas? I have all the xaml lines and reference to Liquid.dll set up in the project. I'd like to use this if I can get it to work.

Thanks.

Hello,

Thanks for the report, this is a bug and we'll be looking at this soon!

Hi Dan, it looks like I hit another problem. If I set checked property of the node programmatically (myNode.Checked = false), NodeCheckChanged event does not fire, though from UI everything looks OK. Could you check this?
Regards, Mikhail

Hello Mikhail,

The node that fired the checked event is available as the sender parameter. In the latest version 4.4 the node that fired the event is now in the Source field and also the ID is populated correctly. Thanks for the bug report!

Hi Dan,
it looks like I have another problem with the tree. If I enable checkboxes for the tree which I'm creating dynamically and try to handle NodeCheckChanged event fires OK, but partically all properties of the TreeEventArgs event are null (like source, target, ID). Which is most important that even I cast sender to Node, then its Checked property always shows false. Is this a bug?
Regards, Mikhail

Hello guys,

Firstly:

We can certainly add an event that fires when the Expand() / ExpandAll() method has completed, we've added this to the features list for the next version due out soon. Thanks for your input!

Secondly:

The source code for the above example on this page can be downloaded by clicking on the Red download image when you have logged in. The source code from the main demo at Dynamic TreeView which is what I think you want (which features the new version of the controls library) will be available soon (28/4/2008 or earlier)!

Good job for the new Tree view!
Just a question, that's possible to get the source code of the new tree view example?
(sorry for my english...)

Thx in advance.

Adrien

Hi,
This is a perfect control. Good work guy’s!!
I wonder if there is an event planned that fires when the expandAll of the expand function is called. Or is there another way to determine the moment the tree or node is fully expanded?

Hi,
This is a perfect control. Good work guy’s!!
I wonder if there is an event planned that fires when the expandAll of the expand function is called. Or is there another way to determine the moment the tree or node is fully expanded?

Hi Mikhail,

Were testing the issue you have reported regarding the use of the tree within the StackPanel and will determine if there is a problem here. We are aware of an issue with the ScrollViewer control when collapsing nodes and the scrollbar going off the bottom of the control which is being looked at.

We are making the properties of the ScrollViewer available to the developer in the next version which will allow you to control scrolling.

Thanks for your input!

Hi Dan,
I'm using version 4.3. I've populated the treeview dymamically and added it to the stack panel. The problem that I'm not able to use verstical scroll thought a number of treenodes is out of the scope of the treeview. Also I did not find any possibility to control scrolling through properties (I belive somthing like that was in the previous version). Can you comment on that?
Regards, Mikhail

Hello All,

Version 4.3 is available from the downloads page and fixes the various issues with population using asynchronous methods.

Hi,

The TreeView is in a state of transition:

1. Currently it uses a custom scrollable area which cannot be easily formatted. We are changing this to a standard Microsoft ScrollViewer control which will be included in the next version.
2. The SetSkin() method was for Silverlight 1.1 before the Templating method introduced in Silverlight 2 BETA, we have considered bringing it back as the new method of applying styles is fine in the XAML editor but you cannot dynamically apply styles at runtime. The next release of the TreeView will be highly customizable.

great control, but there are 2 questions i have(version 4.2)
1 is it possible to change treeview's color(text,scrollbar,background)
2 does the control still have SetSkin method

Hello All,

If you are experiencing problems with the TreeView (In particular using asynchronous call-backs) and you would like to BETA test the new version before release then please email me. We want to get this right in the next version and your help is greatly appreciated!

Hello,
I'm trying to create nodes dymanically (version 4.2). I have a treeview control defined in the page xaml (no populate event handler thought).
In my own method I'm trying something like that:
treeMetaData.Clear();
NodeData ndata = new NodeData("0", "Offices", 1, "Images/folder.png", "Images/folderOpen.png", true);
Node nd = new Node(ndata);
treeMetaData.Nodes.Add(nd);
First, it did not show anything (treeview area empty). Also when on the subsequent call it give null reference exception calling Clear(). What am I doing wrong? Just to mention that example with populate method works just fine.


But, first I can not see

Hello,

At the moment: No, we are working on this right now, all we can suggest is to use the previous version 4.1 for now until we have a fix. Thanks for your patience!

I have same problem with asynchrous call-backs.
Is there a way to populate event in call-backs function?

Hello,

There seems to be an issue with the new tree version and asynchronous call-backs, we are looking at this at the moment. In th mean-time please use version 4.1 of the controls when requiring asynchronous population.

Hello-

In the old treeview, you could save the state of the TreeEventArgs e variable, then write to it later and it would populate. So, if you call an asynchronous web service, you could save the 'e' variable, then write to it once the web service came back. When I do this now, there is no change to the treeview (I'm guessing the TreeEventArgs object is no longer valid at that point). Is there a way to do this now? Thanks!

-MDR

A quick note about the new treeview, you no longer need to call the BuildRoot() method for the first time, as in the example above the tree is built automatically when it is loaded. You must, however setup your Populate() event handler.

Hello,

At the moment it is not possible to style the treeview, it may be something we will implement in the future, remember, if you have a specific requirement then please see our development services page.

is it possible to replace treeview scrollbar with style similar to scrollbar available with silverlight 2 beta contols

Hello,

This problem has just been pointed out to us, there are some issues with the XAML designer and 4.1 which we are currently looking at, thanks for your patience!

I am using VS2005 and Expression Blend March Preview Beta 2 with support for Silverlight v2.0

Hello,

Are you using Visual Studio 2008 or Expression Blend? As these are not supported yet in Blend. Have you downloaded and tried the example zip?