Seems like I can't get away from writing designer tools. After shipping Glimmer: a jQuery Interactive Designer, I helped out with the Gestalt project and assisted with the XAML Playground

In the XAML Playground, you can drag and drop XAML controls onto the design surface, see the generated code-behind and even copy it into your own Gestalt applications. Note, however, that the XAML controls provided are a very small subset of those available.

Much of the code was written by Mike Harsh so mad props to him. I came in and added the property grid as well as some exception handling. Probably the most interesting part of writing this application for me was getting the databinding working between the property grid and the design surface itself.  Nothing too crazy here and, if you look at the code, I took the easy route and did not do it based on reflection, but rather just picked a subset of properties to support.  (Hey, if you want 'em all, go get Expression Blend!)  Through two way data binding, the XAML playground will update the property grid as you resize a control and will update the control as soon as you change a property. Yee hah!

The other funky thing I had to deal with was the source attribute of MediaElement and Image, since I actually render the media or image on the surface.  As such, my bindings have to deal with some goofy exception handling if the source is invalid. You can check out all the source code for the XAML Playground (and the entire Gestalt project, which is pretty rad) on Codeplex here.

Here's some screenshots:


Go Gestalt!