« Emma - Gift Suggestions | Main | Slide Show: Philippe and Sylvie get married »

Utility to sort a WPF Resource Dictionary (XAML)

Yesterday, I posted a question on the Microsoft Blend Forums:

00-original-thread

I received a couple of emails from folks requesting the utility, so I thought I'd post it here.  You can download the utility itself and/or the source code:

The source code is a Visual Studio 2008 project; Microsoft .NET Framework 2.0, VB.

The reason we want to sort the resources alphabetically is that we are creating a naming standard for the resources.  Once we name them properly, we'll automatically get them sorted by type as well. 

Below I have more details on the utility and screenshots.


Screenshots and details

In Microsoft Blend, a graphics designer can create a resource dictionary and create resources such as DrawingBrush, LinearGradientBrush, SolidColorBrush, Color, Geometry, Style, etc...

My co-worker has created 192 such resources and at this point, they are not well organized.  Here's a screenshot of the resources in Blend:

01-blend-resources-notsorted

Notice that he can't see the type of resource from the "Resources" tab.  In addition the only way to sort the resources is by moving them around (drag and drop).

If we look at the XAML, it's the same issue, we can copy and paste the resources, but it would be a pain to sort them all.

02-blend-resources-notsorted

Here's another view of the same XAML, using XMLSPY.  Notice the resource names (x:Key)  and how they are not sorted at all (userIcon, folder_cover, etc...):

03-blend-resources-notsorted-xmlspy

It took me about an hour to write the "Resource Dictionary Sorter", utility.  When you run it, you can see it's input and output parameters:
 04-resourcedictionarysorder-run-01

Once it reads the resource dictionary, it uses a .NET SortedList to easily sort the resources by x:Key (name):
 05-resourcedictionarysorder-run-02

It then writes out a new sorted resource dictionary XAML file appending ".sorted.xaml" to the original name:
 06-resourcedictionarysorder-run-03

The parameters are found in the ResourceDictionarySorter.exe.config file:
 07-configuration

One problem that I didn't solve is that the namespaces attributes were added to the different resource nodes.  Notice every resource has additional attributes such as:

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 



For example, The <LinearGradientBrush> (x:Key="backgroundBodyGradient_Blue50%trasp") below should not have these additional attributes: 

08-missingattributes

I added some code to add the namespaces to the root node, but for some reason one name space still was present on every node:
 09-extraattributexmlns

Therefore, after running the Resource Dictionary Sorter, you must manually remove this namespace from every resource.  You can use any text editor to do this, I use "UltraStudio":


1. Select the attribute to be deleted:
 10-removexmlns

Replace it with nothing (blank) and click "Replace All":

 11-replaceallxmlns

Don't forget to add it back to the root node:
 12-finalfile

That's it!  You now have a resource dictionary alphabetically sorted by resource name.  Here's the XAML viewed in XMLSpy; notice that we start with "backgroundBodyGradient_Blue50%trasp":
 13-sortedxml-01

And end with "XamTextEditorCreditReport":
 14-sortedxml-02

Our team will now start naming our resources, appending them with 2 or 3 letters that describe the type of resource, for example:

  • lgbBackgroundBodyBlue for a <LinearGradientBrush>
  • scbActiveWindow for a <SolidColorBrush>
  • dbInvalidDocument for a <DrawingBrush>
  • etc...

We'll then automatically have all resources sorted by type as well - this will makes it much easier to find the resource that needs to be applied to a specific control:

15-assignresource


| More



Comments

About

This page contains a single entry from the blog posted on March 14, 2008 12:23 PM.

The previous post in this blog was Emma - Gift Suggestions.

The next post in this blog is Slide Show: Philippe and Sylvie get married.

Many more can be found on the main index page or by looking through the archives.

Powered by
Movable Type 3.35