Microsoft Sweetens the Pot

My Podder Skinning Competition is officially one notch cooler now. Microsoft has offered to give each of the winners an 8 GB green Zune! That was a nice surprise!! 😀

By the way, the most sought-after prize seems to be the steak dinner at Smith & Wollensky. Three people have already sent me e-mails saying that they are going to submit a skin into the competition just so that they can have me buy them a steak dinner. LOL! If you’ve ever been to Smith and Wollensky, I’m sure you understand…

Advertisement

Announcing the Podder Skinning Competition

I am excited to announce that I am hosting a new WPF competition!! This contest allows you to create and submit your own skin for Podder, the WPF podcast player application. Since Podder was built to support “structural skinning” it can use any UI that you dream up to display its data and behavior. This contest will allow participants to focus on using WPF to create an awesome user experience, without needing to worry about writing the underlying application functionality.

The Podder Skinning Competition, along with all the rules, prizes, and dates, is fully explained on this page of my blog. I also put together a step-by-step walkthrough of getting started with creating your own Podder skin, which you can check out here.

I look forward to seeing the creative Podder skins that people submit. This is a very exciting time to be a WPF developer or designer!

Joe Rattz to the Rescue

In my previous post, I showed a simple way to create animations in WPF using a sequence of images. That demo app used a LINQ query to get a sequence of BitmapImage objects based on the PNG files in a certain folder. Joe Rattz, the LINQ guru, dropped a comment on that post and also included his e-mail address. Big mistake!! 😀

I sent him an e-mail, asking if the BitmapImage objects in that LINQ query are created every time a new enumerator is created and iterated over. When I send an expert an e-mail I never expect to hear back. I certainly don’t reply to all of the questions that people send me! There are only 24 hours in a day. 😛

Luckily, Joe replied. Thanks Joe! It turns out that the answer is yes, the LINQ query is creating new BitmapImage objects for each new enumerator, as the enumerator is iterated. This is not a good thing. Since my demo app repeats the animation indefinitely, a potentially huge number of unnecessary BitmapImage objects were being created by the LINQ query.

The reason for all this is the fact that my LINQ query was only using deferred query operators. LINQ has deferred and non-deferred operators, as Joe’s book explains. If you use all deferred operators, the query’s results are not cached. Every time you iterate the resultset the query creates new objects for you. In some cases that is what you want. In my case, it is undesirable.

Working around this turned out to be easy, especially since Joe e-mailed me the answer. 😉

I needed to apply a non-deferred operator to the query. This would cause the results of the query to be cached, so that all enumerators created against the query iterate the same set of objects. Here is the new code-behind for the demo app:

Notice how the entire LINQ query is wrapped in parenthesis and then a call to the ToList extension method is placed at the end. ToList is a non-deferred query operator, which is the magic that fixes the issue.

If you want the source code for this app, download it here. Be sure to change the file extension from .DOC to .ZIP and then decompress the file.

Good old fashion image animations in WPF

As I tried in vain to fall asleep at a reasonable hour tonight, it dawned on me that something is missing from the standard WPF literature. Most of the animation examples show off the awesome built-in support for animations, which means changing a property’s value over time. What I felt was missing is an example of how to create an animation by showing a sequence of images in rapid succession.  Ya know, like Mickey Mouse.  So I got out of bed and made one!

I opened SnagIt, created 37 separate images, saved each one with a name like “001.png”, and then dropped them all into a new project in Visual Studio. All of the image files are copied to the project’s output directory, instead of saving them as resources in the assembly. After assigning the Window’s Content an Image element in XAML, I wrote the following code:

I just love using LINQ!  It makes data processing so much easier.  If you haven’t already done so, I highly recommend you read Joseph Rattz’s “Pro LINQ – Language Integrated Query in C# 2008“.

When I run the app, it looks like this:

If you want the source code, you can download it here. Be sure to change the file extension from .DOC to .ZIP and then decompress the file.

Why use WPF if it is not RAD yet?

I have been heavily involved with WPF for years now. When I first started out with “Avalon” it was hardly a blip on the .NET radar. After just a couple of years the crickets have been replaced by a rock concert, and the intensity just keeps growing. For a WPF geek, such as me, this is great news!

My numerous encounters with people using WPF have lead to me to conclude that the platform is finally gaining traction in the .NET universe. WPF has been picking up momentum for a while in the financial services world, in particular. I have also met quite a few people using WPF in the state/local government sector, the retail sector, entertainment sector, and quite a few others.

But, wait a minute…why are people moving to WPF? Visual Studio 2008 offers rather weak design-time support for WPF. The lack of drag-and-drop magic in VS2008 essentially kills any hope of the rapid application development (RAD) that so many software shops hold near and dear. Why are people leaving RAD for MAD (manual application development)? In this blog post, we will discuss why WinForms and ASP.NET developers have decided to move on to WPF. Note, everything in this post is based on discussions I have had with people, but is certainly not the “definitive” explanation by any means.

The most obvious reason that people are now moving to WPF is that Visual Studio 2008 natively supports WPF development without requiring any extensions to be installed (i.e. the Orcas extensions for VS2005). Even though the WPF design-time experience still leaves much to be desired, the fact that it is part of VS2008 is important for many software shops. Most companies simply will not base their software development on pre-release bits; and I do not blame them.

In the previous paragraph, I mentioned that Cider (the WPF designer in Visual Studio) leaves much to be desired. Compared to the high-productivity RAD tooling support to which Windows Forms and ASP.NET developers are accustomed, it might seem surprising that anyone would drift away into the not-so-RAD world of WPF. Let’s take a closer look at exactly what this means.

Moving from ASP.NET to WPF is not too radical of a shift (so I’ve heard), in terms of tooling. Both platforms involve a markup file with an associated code-behind file. In both ASP.NET and WPF, the developer expects to go into the markup file and tweak the tags by hand. The design surface can only get you so far. From a tooling perspective, the shift from ASP.NET to WPF is not as radical of a change as for WinForms developers.

For those of us who approach WPF with a strong background in Windows Forms, however, you are pretty much required to remove your brain from your skull, rotate it 180 degrees, and put it back in.

This stems from the fact that WinForms developers are trained to never look at the designer-generated muck that is written for the Forms that they whip together in VS. The idea of working with markup that represents a UI is foreign to most WinFormers. Trying to move from a world where the serialization format used by Visual Studio to represent a UI is irrelevant, into a world where you are hand-coding XAML to get a UI together represents a significant mental shift.

This brings us back to the original question. Why are people moving to WPF at an increasing rate? I have heard several recurring themes when I ask people this question. Below I summarize each theme, and try to explain the rationale behind them.

Many people who moved from WinForms to WPF have told me that they are concerned about Microsoft gradually phasing out WinForms and concentrating their new developments and customer support into WPF. Many people feel that sticking with WinForms is just asking to be left in the dust. That is a very forward thinking idea, though I obviously have no idea how long it will be before WinForms is retired.

Another common theme I have noticed is that people are leaving WinForms for WPF because they want to incorporate advanced data visualizations in their programs. There seems to be quite a lot of interest in the possibilities of charts and graphs that a vector-based rendering system, which supports 3D, has to offer. Creating animated 3D data visualizations in WinForms is not exactly something that the average developer can do, but in WPF the barrier to entry is significantly lower. In my mind, that’s a very good thing (unless you happen to be making excellent money by creating advanced 3D data visualizations via GDI+).

The other common thread I’ve noticed is that people move from WinForms to WPF because they find certain aspects of the platform appealing. For example, many folks I meet tell me that the WPF data binding system alone was compelling enough for them to make the switch. I completely understand that!! From a developer’s perspective, things like triggers, routed events, rich data binding, and commands are extremely useful and addictive.

The last thing I have heard people say, but not quite as often, is that they want to have an easier way to involve a Visual Designer in their project. People who say that are typically working on a product, as opposed to an internal application for a company. For them, the idea that their aesthetically-challenged developers will not be responsible for designing the user experience is a powerful selling point for WPF adoption. Once again, I completely understand that! 😉

The reasons why ASP.NET folks are moving to WPF overlap with the reasons listed above, for WinFormers. In addition, I have heard that some Web developers are just plain sick and tired of dealing with browser-incompatible HTML and CSS. I have met Web devs who originally got into Web programming because it made the deployment of their applications much simpler. They soon discovered that they traded the simplicity of development for simplicity of deployment. Pick your evil…

The other major reason that I hear of ASP.NET developers getting into WPF is so that they can get a jumpstart on Silverlight. Since Silverlight is planned to be a subset of WPF, many people find value in learning WPF now, so that they can apply that knowledge to Silverlight once it is officially released. I think that is a very wise plan.

What about you? Why have you started using WPF, or not? What are the key factors in your rationale for adopting or avoiding WPF?

WPF Disciples 3D Blogroll…with Audio!

Last night my brother introduced me to SoundSnap.com, and I decided to add some audio clips to the WPF Disciples blogroll viewer app. This is just too much fun! 🙂

The app now has two tracks running in the background: the sound of the ocean and some nice calm music. When you move items in the Panel3D, it plays a subtle sound that makes it feel like something physical is happening. Also, when you open a blogger’s bio or blog, it plays a sound that represents a Web browser being opened. I spent a while picking out the right sounds, and adjusting the volume levels so that they are not tacky. Hopefully my tastes are good!

The one interesting part about how this works is the way that the sound plays when you move items in the panel. Here is the way I achieved that in XAML:

That snippet takes advantage of the fact that Panel3D has an IsItemsMoving dependency property that is set to true when you call MoveItems() and is set to false when the call completes later on. For this trick to work, the MediaElement’s DataContext must be set to the Panel3D instance so that it can bind to the panel correctly.

If my audio files were .WAV files, instead of .MP3, I could have used the SoundPlayerAction instead of this tricky approach.

Here is a video showing this app in action, in case you do not have Visual Studio 2008 or .NET Framework 3.5 installed:

Download the source code here: WPF Disciples 3D Blogroll Viewer with Audio (source code)

Download the executable here: WPF Disciples 3D Blogroll Viewer with Audio (binaries)

NOTE: Be sure to change the file extension from .DOC to .ZIP and then decompress the file. This is a workaround for a limitation imposed by WordPress.

New features added to Panel3D

After publishing the article about Panel3D, I received a few excellent pieces of feedback. I implemented the features and improvements this evening, and updated the article/downloads to reflect the changes.

Here are the changes I made:

1. Exposed MaxVisibleModels as a public property
2. Added the IsMovingItems property
3. Added the GetVisibleIndexFromChildIndex method
4. Added (to the demo app) the ability to bring an item to the front of the 3D scene when you click on it.
5. Rewrote the logic that keeps Panel3D in sync with the selected item of the owning Selector control, so that it does not create a memory leak.

The article and source code can be found here.

Article about Panel3D

I just published an article to CodeProject showing my new Panel3D class.  The article is accompanied by a fairly interesting demo application that makes it easy to find appealing configurations for the panel’s 3D scene.  If you are interested, here is the link:

http://www.codeproject.com/KB/WPF/panel3d.aspx

Dr. WPF introduces Conceptual Children

Dr. WPF is amazingly brilliant. He figured out a way to create a panel whose children are neither visual or logical children, but simply “conceptual” children. This allows for many great things, including the ability to host the child elements in 3D space. His excellent article about the topic, with source code, can be found here.

I have been working closely with the good Doctor over the past week. His conceptual panel work has been the foundation of my new developments in displaying the items of a 2D ListBox as interactive, animated 3D objects. I will be writing about this exciting topic soon, but for now, just to whet your appetite…

Interactive Animated 2D Elements in a 3D ItemsControl

EDIT: After posting this entry, I published an article on CodeProject that shows a more robust and complete solution than the one shown here. You can view that article here.

A few posts back I showed how to apply a custom 3D panel to an ItemsControl, so that its items render in a Viewport3D contained in the panel’s adorner layer. In this post, I take that example a step further and show how to make those 2D elements respond to user input while in 3D space. The demo application is a 3D blogroll for members of the WPF Disciples group. It looks like this:

(click on the image to see it at full size)

Each item in the list represents a blogger from WPF Disciples who has a bio on the group’s blog. If you click on the person’s name, a Web browser opens to that person’s bio. If you click on the blogger’s picture, it opens a browser to that person’s blog. Click on the buttons below to navigate between bloggers. Holding a navigation button down will continuously scroll through the items.

I tried to use a Viewport2DVisual3D in my original 3D ItemsControl project,so that the user could interact with the list’s items. However, there was a problem. In order to a host a 2D element in a Viewport2DVisual3D it must be parented to it, by setting the Visual property to the 2D element. Since my Panel3D is being used as an ItemsControl’s ItemsPanel, it cannot add or remove child elements. WPF enforces that rule at run time, by throwing an exception after you try to remove an element from the Panel’s Children collection. A child element of an items panel cannot be parented to another element, but Viewport2DVisual3D must be the visual parent of a 2D element in order to host it in 3D space.

The panel has children that it cannot remove but it must somehow render them in 3D space. The solution I originally used was to create a 3D mesh painted with a VisualBrush that references the panel’s child element. That technique prevented the 2D elements from responding to user input, since they were not really in the 3D scene. It just looked like they were in the 3D scene.

After much experimentation and discussion with other WPF Disciples, I finally found a way around this barrier. I figured out a way to dynamically generate a ContentPresenter such that it renders the content exactly how a ContentPresenter generated by the ItemsControl renders it. Here is that magic method:

I had to jump through some hoops to make the ContentPresenter use the correct DataTemplate for its ContentTemplate property. What is even stranger is the fact that if it uses a typed DataTemplate, it must be declared in XAML with the explicit notation for the TypeExtension. For example, you must configure the typed DataTemplate with DataType=”{x:Type TypeName}” instead of the more convenient DataType=”TypeName“. Smells like a bug to me…

Here is the method that creates a Viewport2DVisual3D and calls the method seen above to create a 2D element:

You can download this project’s source code here: WPF Disciples 3D Blogroll (Source Code) NOTE: Be sure to change the file extension from .DOC to .ZIP and then decompress the file.