.NET, WPF

My First WPF App

12 hours in the car coming back from the Outer Banks means that I finally had time to delve into WPF. It seems like every other week Microsoft is telling us about some new technology that is coming out. I figured that rather than try and learn them all at once, I’ll concentrate on just one. I picked WPF because WPF will be used extensively in Silverlight and because all of the WPF apps I’ve seen so far look awesome.

WPF is a big change from any desktop application platform in the past in that it encourages you to design a rich user experience. WinForms apps almost always have the same look and feel — buttons look the same in every app, everyone uses the same menus, the same toolbars, etc., and it’s really difficult to change the look and feel of them. Now Microsoft is pushing you to use your imagination and creativity to do whatever you want, while giving you the tools you need to do so.

This is both exciting and challenging. It’s really hard to try and put aside all of the UI concepts, layouts, colors, etc. and try and think outside the box. With WPF, you can do stuff that you would’ve never dreamed of attemping in Windows Forms, and it’s not that hard to do. Coming up with the ideas is the hard part!

Here’s what you need to get started:

These installs all take a long time, so allow plenty of time. :)

Here’s where I learned everything that I know:

  • Reading Windows Presentation Foundation Unleashed, by Adam Nathan. I’m only about halfway through, but this book does an excellent job of walking you through everything. Normally I don’t buy dead tree books, but when you are learning something completely new, it’s nice to have someone walk you through everything in the correct order.
  • Downloaded the Family.Show app. This app was written in WPF as an example application that contained examples of everything that you might want to do in a WPF app.
  • Watched the Family.Show guys talk about their app in this video.
  • Watched this video on designing rich client experiences with Expression Blend and WPF.

For my application I chose to solve a problem that I have — I can’t keep track of car repairs and when they need to be done. So I’m going to create a simple application that will allow me to record car repairs that I do and let me know when I’m due to have the repairs done again.

Most WPF apps that you’ve seen out there do lots crazy animation and 3D rotating of panels. I tried to stay away from that for now and just do the basic stuff that I would do in a normal application. In WPF, the basic stuff actually is in some cases a lot harder than the animation and 3D rotations.

Some thoughts so far:

  • I did more work in Expression Blend than I did in Visual Studio. Anyone doing WPF will almost always use Blend and Visual Studio side by side. You can even compile and run in Blend.
  • Blend is a really powerful tool and it allows you do to all the styling, layout, and animation. Timelines and event handling make it easy to make your controls react to button clicks, hovering over something with the mouse, etc. The use of data binding is really encouraged in WPF, more than it was in Windows Forms, and Blend makes it easy to use data binding in all kinds of places.
  • The learning curve of Blend wasn’t as bad as I expected it to be. Watching the MIX videos that I mentioned earlier really helped me learn all of the basic stuff. When you do get stuck and can’t find something in Blend, you can go edit the XAML directly and then go back into Blend and see what changed.
  • The Visual Studio Extensions are supposed to install the “Cider” designer (which is still in CTP). I couldn’t get anything to show up at all in the designer. I don’t know if this was a problem with my environment or a bug, but it doesn’t really matter because there’s no reason to do anything in the VS designer when you have Blend.
  • There is also Expression Design, which is essentially MS’s version of Adobe Illustrator. I haven’t really used either, but the nice thing about Design is that it also outputs XAML, so you can bring stuff from Design right into Blend. You can import all of your Illustrator files into Design.
  • Right now it’s taking me a long time to do relatively simple stuff, like figuring out how to get stuff laid out inside a list box item. Then again, I was in the car doing this so I was sans-Internet, and I’m sure there are lots of examples out there by now of how to do certain things.

I’ll try and post more updates and I continue to try and figure this all out.

June 19, 2007by Jon Kruger