I’m the kind of guy who likes to tinker where i shouldn’t and tonight I just couldn’t help myself and decided to see how far I could go in terms of hijacking the UI in Expression Blend.
The reason that sparked this quest was that I wanted to write my own special custom UI Panel for Blend that reflects a Skinning framework I’ve been working on. I was more specifically focused on how to hide Category panels that are basically not required, in that “Skin X Panel” is all I wanted developers to access for my given control (which in turn has all the relevant turnkey properties that they should tweak).
I managed to do this like any “Design-Time” solution can, by basically invoking BrowsableAttribute.No in the MetaDataStore.cs (Justin Angel has a brilliant write-up here on how to setup your own at – design time Expression Blend extensibility) which was working, except I noticed PropertyGrids like “Font” and “Grid” wouldn’t hide (Given they are DependencyProperties and are hard-coded into Blend).
Given this was annoying me, I decided to see if there was maybe a way for me to hijack blend via the internal VisualTree in order to react to a control type selection and then switch Category Panels on/off depending on the type that’s being accessed.
Armed with this mission, I proceeded to get a few much needed tools for my upcoming journey.
Peter Blois was a guy I used to always enjoy having coffee with as not only is he one of the Program Managers in Expression Blend team, but he often writes very cool small tools that just basically make your life easier should you wish to run up against the grain. Peter’s written a small open source app which attaches itself to an instance of Blend that you have open and then proceeds to walk the VisualTree within your current view.
Second: 2x Instances Visual Studio open.
Obviously the first one is to allow you to access your code base (duh) the second is for debugging Expression Blend, so make sure you attach the second VS instance to debug Expression Blend that you’re about to Snoop (i.e. Attach to Process tutorial here)
Jim Baltzell-Gauthier has written a class that basically takes FrameworkElement.FindName() and injects some steroids into place. This is important as you’ll need this to hunt specific nodes within Expression Blend’s internal VisualTree.
Armed with that, the first thing you’ll want to do is create a Construct in your MetaDataStore.cs (in your Expression Blend.DesignTime project). In this you’ll need to access the following branch to get yourself started.
This is pretty much like in Silverlight at runtime, your “root” starting point, from here you’ve pretty much got access to the XAML DOM much like you would in WPF today. To prove my point, try this:
Application.Current.MainWindow.Title = "RIAGENIC.COM is My Daddy";
I can haz your snoop Blend
Now you have probably some basic skills around how you can hack Expression Blend. The next step is to really screw around in the kitchen, in that let’s break something.
Let’s for example, hide the Panel which shows you what your control’s “Name” property is (ie see below).
To do this, open up Snoop and attach it to your Expression Blend. Then type into Snoop “InfoBar” into your Tree Filter textbox (first one above the actual tree). This should narrow your selection down to the following:
Now if you move your mouse over inside Snoop over the actual “InfoBar” node, you’ll see a preview of that control (ie snapshot of it). This is the one we want to mess with.
Next, inside your MetaDataStore.cs type in the following:
Border o = VisualTreeWalker.FindName("InfoBar", Application.Current.MainWindow) as Border; if (o != null) o.Visibility = Visibility.Visible;
Now, inside Expression Blend, “Rebuild the Project” and watch the Name Panel disappear.
Pretty cool huh?
The more you “Snoop” around inside the VisualTree the more you can start to see possibilities here on how you can really do some hardcore damage to the beloved Expression Blend. As with anything, with great power comes great responsibility, so do be careful and do understand that anything you touch via this route WILL NOT be supported by Microsoft (use at your own risk – if you could also potentially use this concept to inject time-bombed trial watermarks etc on developers using your 3rd party controls etc).
Where to from here?
I’m going to keep tweaking around with this, but basically I want to attach an event to the selection of a said control and then sniff the type. If the end user accesses my controls that I’ve made, I then want to do something unique and fun to provide a specific UI Panel for them to make use of.
Its, again, Unsupported but from what I’ve seen over the years this backdoor in hasn’t changed all that much as the hardest part to get to this point was creating a “Design-Time” project that worked for both WPF and Silverlight (Inside Expression Blend 4, this is fixed).