Toolkit Extender for creating WPF/E components

If you haven't already seen ScottGu's post on WPF/E, I'd recommend checking it out.  WPF/E is a new technology that opens up incredible new possibilities for improving the richness and interactivity of the web.  Scott links to a few demos, and the WPF/E install is quick simple, and even works on a Mac!

Adding a WPF/E component to your page is still a little bit of work though.  To make it easier, I've created a simple Toolkit extender that automates this code so you can just create the extender and go.  See the attached file below - there is a C# and a VB.Net version of the component (though if you're just using the extender, it doesn't matter).

To add WPF/E to your website:

    1. Create your XAML file (there is a simple XAML file in the sample attached, otherwise you can use the Expression Interactive Designer beta).  Add the file to your website.  Also add any other scriptiing you'd like for your WPF/E component.
    2. Build the attached solution and add the WPFEHost DLL to your website's bin directory (you'll also need to add AjaxControlToolkit.dll if you don't already have it).
    3. In your website, create a Panel where you want the WPF/E content to show.  
    4. Add the WPFEHost extender.  Note that if you're writing any script against your WPF/E control, the ID of the WPF/E control will be set to the ID of Extender, for example "wpfeControl" below.

<wpfe:WPFEHostExtender ID="wpfeControl" Runat="server" Height="350px" TargetControlID="Panel1" Width="350px" XamlPath="myWpfeControl.xaml" BackgroundColor="transparent"/>

That's it! 

 

WPFEHostExtender.zip