Search

Source: Jesse Liberty's Blog

Create a demo programs that illustrates usage of the following data display items from the toolbox

• DataGrid
• DataPager
• TreeView

Source: virtual.olympus.blog

In this article, we walked through the addition of Question maintenance to the administrative application. We also covered some basic client and service side validation rules and built out a public interface to display our FAQ data. The application is fairly simple, but it allowed us to show a complete and functional Silverlight application with a rich administrative user experience. Improving the public facing experience is just a matter of some clever styling, and the client UI gracefully degrades when JavaScript is unavailable. We have met all our client requirements and provided the administrative staff with a pleasurable maintenance experience.

The goal of the application will be to present the TreeView of categories on the left-hand side of the screen, and a ListBox on the right-hand side which represents all images for the currently selected category.  The ListBox will allow the user to drop images into it for addition to the category, and we will also provide a link that launches a standard multi-select OpenFileDialog window to upload files.  As with the previous example, categories can be added, removed and reordered within the tree.  The images in the list can also be reordered by simple drag & drop operations and images can be dragged from the ListBox onto another category to move the image from one category to another. 

I’m recently worked on a project where I needed this property. At least I needed to be able to toggle drag’n’drop on and off depending on some conditions in the application. So here is how I did it.

For large hierarchies the TreeView in the Silverlight tool-kit suffers some performance problems, because the elements (once loaded and expanded, such that they could be seen by the user if they scrolled the scroll-bar) aren’t virtualized as aggressively as they could be. The for example the hierarchy shown below: If Child Node 4 is expanded, pushing Child Node 5 outside the limits of the view port of the TreeView then Node 5, as well as any other children of Node 4 that aren’t directly visible, _could_ be virtualized but currently aren’t by the Silverlight Treeview. 

Now usually when one thinks of implementing a Drag Drop operation on a TreeView, there are a couple of events like the DragEnter, DragLeave, DragOver and Drop that are to be raised and handled. In some cases, you must also cancel the drag-n-drop operation if the drop is invalid. Overall, this looks like a lot of work for a developer who wants to quickly implement drag-n-drop functionality on his/her controls.

You may find this post helpful if:

• You are using MVVM 
• You are using a TreeView control
• You want the SelectedItem of the TreeView control to be passed to another object

During a recent work I found some trouble working with the TreeView control in a Model-View-ViewModel scenario. As usually happen, the standard controls are designed to work in an event-driven behavior and this non always marries with a correct MVVM implementation. After some work, I found a way to change the TreeView and transform it to be lazy loadable.

Download Source Code

The Model-View-ViewModel pattern has been introduced in Silverlight by few time and this platform lacks a complete support to the pattern by the standard controls.

In this tutorial Shawn Oster shows how to add connecting lines using Blend 3.

One of the more annoying things when trying a do a little research into how you can tweak a control is having to come up with some kind of mock data to work with, especially when working with a TreeView because of its hierarchical nature.  Blend 3 introduced a huge time-saving feature, Sample Data, that we’ll take advantage of.

For this example I want to end up with a common TreeView UI pattern, an icon followed by some text, similar to a basic file browser.  With those requirements in mind lets create some sample data.