Mole For WPF Released!

This article and code have been replaced With Mole’s Home Page

Mole has been radically upgraded AGAIN. Mole now supports all Visual Studio projects.

Please get the word out and visit Mole For Visual Studio”

The remainded of the article are left here for historical purposes

Mole II Has Been Released.

Please use the newest release of Mole.  You can visit Mole II’s Home Page here: http://karlshifflett.wordpress.com/mole-visual-studio-visualizer-for-wpf/

---

This entry has been left here for historical purposes.To read the full story of Mole click here.Mole is a multifunction Visual Studio Visualizer that allows inspection of the visual tree while debugging WPF applications. For each element in the visual tree the developer can view all properties, visual image, run-time XAML and can drill through to property collections to view their values.

If you are a WPF developer, trust me, you’ll want to read about and download, Mole!

A complete article and downloads are posted at Code Project:

Mole v1 For WPF Article and Downloads

Just a grain of sand on the worlds beaches.

Triangle .NET User Group, Raleigh, NC Presentation – Authoring WPF Custom Controls

This Wednesday, 14 Nov 2007 I’ll be presenting at the Triangle .Net User Group.  The topic is Authoring WPF Custom Controls.  The pizza is served at 5:00pm, the presentation should kick off at 6:00pm.  Come join us!

The presentation will include my new WPF AJAX Style ComboBox along with my WPF CheckListBox, WPF ListBoxWithItemIndicator and WPF HyperlinkCustomControl.  There will be a demonstration of RoutedEvents and how they tunnel and bubble through the element tree.  A WPF traffic light will also be used to demonstrate the WPF concept of “lookless” controls.  The code is all contained in four projects that can be downloaded below.

After a quick look at the above demos, the presentation will focus on the steps to author a custom control.  Many insights will be shared.  Microsoft has made it easy for developers to author their own controls.  Join in the fun and add WPF custom control authoring to your skill set.

Download Presentation Project Code  After downloading, you MUST change the file extension from .doc to .zip.

Have a great day,

Karl

Just a grain of sand on the worlds beaches.

WPF AJAX Style ComboBox Custom Control

Not wanting the web developers to have something that WPF didn’t ship with, I wrote this WPF AJAX Style ComboBox custom control.

The control, article and demo program are posted at The Code Project:

WPF AJAX Style ComboBox Custom Control.

Enjoy!

Just a grain of sand on the worlds beaches.

Over Reaction To: A Simple WPF Explorer Tree

Sacha Barber recently posted an article to CodeProject titled A Simple WPF Explorer Tree. The article shows how to lazy-load the TreeView control with the directory structure on your machine. It is a nice gentle intro to lazy-loading the WPF TreeView, and I highly recommend checking it out.

In response to Sacha’s article Josh Smith made a few minor enhancements and posted his article Reaction to: A Simple WPF Explorer Tree. 

I had sent a few suggestions to Josh on his article which got me thinking about a XAML only solution.  I tried but couldn’t get one piece working just using XAML so I caved and added a value converter to my solution.

My solution uses the HierarchicalDataTemplate to do the heavy lifting.

XAML Code

Sorry about the compacted code here, just need to do this for the blog entry, the project is not compressed like this.

If you have yet to learn about the HeirachicalDataTemplate, this is going to be your day!  This is a super awesome WPF feature.  After you get an understanding you will find all sorts of practical applications in your “real world projects.”

We will start at the bottom of the code listing with the Grid object since everything is driven from its DataContext. 

The DataContext property has been set to the getDrives resource.  This returns a collection of DriveInfo objects.

The TreeView uses the Grid’s DataContext and starts adding TreeViewItems to itself.  For each DriveInfo object in the DataContext, one TreeViewItem will be created.  When the TreeView adds an item  of type DriveInfo, it will use the HierachicalDataTemplate that has the DataType set to DriveInfo.  The template creates a TreeViewItem with an Image and TextBlock control.  The Image Source is diskdrive.png and the TextBlock Text is the drive name.  Still with me, OK.

The Magic Begins

The HierachicalDataTemplate has its own items collection.  Notice the ItemsSource property that is bound to the results of the call to the GetFileSystemInformationConverter.  That super simple code is below.  When the converter is called, the DriveInfo object from the Grid’s DataContext is passed to it and the converter returns a collection of DirectoryInfo objects.

What the HierarchicalDataTemplate does is recursively call itself, this time it passes the DirectoryInfo object to itself.

When the TreeView goes to create at the new TreeViewItem, it’s being passed the DirectoryInfo object instead of the DriveInfo object which causes a different HierachicalDataTemplate to be used.  That other template displays a folder image instead of a drive image. 

What is really super cool, is that the HierachicalDataTemplate does lazy loading.  Meaning, it only loads directory information when the TreeView calls for it.

Code

Based on the type of object that value is, I select the proper function to call and return information.

Extending 

Since I used DriveInfo and DirectoryInfo objects, you can very easily extend this program to include the files also.  Since you are using these rich objects you have full access to their information and can display it just like Explorer does if you want to.  If you add the ability to view the files, just make sure you update the value converter code to get file information.

Download Project Code Here  After downloading, you MUST changed the extension to .zip.

Hope you like the program.

Just a grain of sand on the worlds beaches.

Routed Event Viewer

Understanding the order in which routed event handlers are invoked is an important WPF programming concept.

I wrote the below demonstration program as a visual aid for my WPF presentations and wanted to share it. It allows the user to select which routed event handlers to handle, which event handler will mark the routed event as handled and simulates code running in the handler.  If you have not read the MSDN topic “Routed Events Overview” I strongly suggest that you do.  Microsoft did an excellent job with the routed event documentation.

Running The Program

For your first run of the program, just press the Start Demo button and watch as the PreviewGenerateTrace routed event tunnels down the element tree and then the GenerateTrace bubbles up. As the each event handler is invoked, the viewer on the right (not pictured above) will be populated with the object type and routing strategy.

The CheckBoxes allow you to add event handlers for their associated object.

The RadioButtons allow you to designate which handler will mark the routed event as Handled. If the tunneling routed event PreviewGenerateTrace is Handled, the bubbling routed event GenerateTrace will not be raised. Once a routed event is marked as Handled, the remaining event handlers will still be invoked but their progress bars will be colored red to indicate that the routed event was previously Handled.

Class Handlers

For most readers of this post, the tunneling and bubbling of a routed event through the element tree will not be new information. However class handler might be.

Let’s start with a bubbling event first.  The MSDN documentation states, Class handlers are invoked before any instance listener handlers for an instance of that class, when that event reaches an element in its route. This can be seen in the above image, the bubbling Class handler gets invoked before any of the instance handlers.

This is true for the tunneling handlers also.  The tunneling class handler gets invoked before the instance handler of the Button that raised the event.

When I first read the documentation, I thought that the tunneling Class handler got called before any other tunneling event handlers, I was wrong.

Project

Download project source here.  After downloading, you MUST change the extension from .doc to .zip.

There are actually some pretty cool things going on within the program.  Getting the animations to process in the order the events actually got raised took some thinking.  After running the program but before diving into the code, think how you might program this.

Hope you like the program.

Just a grain of sand on the worlds beaches.