Tagged with WPF
As I wrote and subsequently taught the Silverlight Tour workshop, I've had a number of discussions with students, clients and the community-at-large about how to architect Silverlight applications.
The momentum behind the Model-View-ViewModel (MVVM) design pattern makes a lot of sense to me, especially with declarative views (as seen in Silverlight and WPF). Most of my thinking around this was covered in my MSDN article about it:
I've been digging into some of the open source and 3rd party controls that are becoming available for Silverlight 2. While running into some odd issues with some of them it occurred to me that there are some design guidelines that haven't been well communicated. Back in the early days of WPF I learned (though exactly where is unclear) that every control should support an empty constructor and that all properties (e.g. XAML Attributes) should have a default value. I knew this to be true but I couldn't document where it came from.
So as usual when I am stuck, I contacted Chris Sells as he was my mentor in early XAML usage. He was at MSDN at the time gathering content and helped me get the Data Binding articles as well into the Software Design Review for WPF (then Avalon). If anyone could help me figure out where I learned this, he'd know. He reminded me of the language they use internally: "Create-Set-Use". Essentially this means that the design pattern for controls is that they should work without requiring any properties:
<Grid ...> <Rectangle /> </Grid>
You can see that the Rectangle doesn't require any properties to be valid. Of course this Rectangle has no fill brush and no stroke brush which means it will likely not be visible. But that's OK because it is valid XAML and doesn't break. The XAML for a control doesn't have to read the mind of the user, but should behave (e.g. not throw exceptions). One of the most egregious was a control that threw an exception if I failed to set the Width and Height. Worse yet, when it did throw these exceptions, it didn't tell me what *all* the properties I needed therefore it was painful to use. Width and Height are particularly problematic in this way in that by not defaulting to "Auto", showing the control in a non-Canvas container meant I needed to set "Auto" to the values which is what they should *always* be defaulted to.
On Ian Griffiths blog (a must for any WPF developer), he shows a way to bind to the Length of the column in the template of the ListView's Grid to make the columns look right. Check it out here:
If you are doing any WPF development, get this new *free* (as in beer) tool from Chris Sells (with help from Ian Griffiths) that allows you to see the template of the built-in controls. It lets you see what the template is and what the control looks like across different themes. If you are writing your own controls (or just templating a built-in control) its a great way to 'borrow' from their ideas and make them better.
I use ListBox's and DataTemplates a lot to show data in different ways in WPF. One of the problems I've faced is how to change the look of the "Selected" element. All the examples I could find assumed you were not using a DataTemplate. Luckily Chris Sells came to my rescue and pointed me at the ItemContainerStyle. Using a Template for the ListBoxItem in the ItemContainerStyle let me control the look and feel of the Selected element (or disabled items) easily.
What I wanted was a nice glow effect instead of the default blue background:
I've worked up a simple example of how to use Commands in WPF. This example includes:
Please let me know what you think of the sample.
I've been digging into the Command infrastructure in WPF lately and I really like the way it works. Essentially it is a way to separate the idea that you have commands that a particular applciation can execute and the ways you start a command (e.g. menu, toolbar button, context menu, hotkey, pen gesture). WPF comes a standard set of commands that are commonly used (e.g. New, Close, Copy, Paste, Cut, etc.). You can define your own commands fairly easily as well.
In the XAML you can declaratively specify the commands like so:
<Window.CommandBindings> <CommandBinding Command="ApplicationCommands.New" Executed="OnNew" /> <CommandBinding Command="ApplicationCommands.Close" Executed="OnClose" CanExecute="OnCanClose"/> <CommandBinding Command="local:Window1.ImportFileCommand" Executed="OnImportFile" /> <CommandBinding Command="local:Window1.ExportFileCommand" Executed="OnExportFile" /> <CommandBinding Command="local:Window1.ChangeViewCommand" Executed="OnChangeView" /> </Window.CommandBindings>`
Finally, you can specify the command on XAML elements (with an optional CommandParameter) like so:
I've been digging a bit into how themes work for a new article. In doing that I wanted to see how WPF used their theme files. Their theme files are stored as BAML in the PresentationUI assembly. As usual reflector came to the rescue with a BamlViewer plugin (available as part of the ReflectorAddIn's CodePlex Project).
I downloaded it and started to look at the generic.xaml file that WPF uses. Unfortunately the XAML window in the add-in was hard to navigate and didn't support searching. What I really wanted was a way to support select/copy in the XAML viewer and a way to actually save the XAML files so I could do more in depth investigating. Since the add-in didn't support, I volunteered to add it:
NOTE: No WCF Designer in this drop and Cider (the WPF designer) doesn't work in VS Express.
Avalon WPF DataBinding Article has gone live on MSDN. Take a look. Part 2 will be published next week.
I had a great time tonight talking about all things XAML at the Atlanta Visual Basic Study Group. There were plenty of interesting questions and it's clear the Cider and Sparkle have come a long way, but still have a way to go. It was interesting to see how many people seemed to still tie WinFX with Vista and machine upgrades. I am glad to see how well everything runs on my XP boxes.
I was also a bit perplexed at the XAML code that we could generate with Sparkle (including samples) but Cider simply choked on. But since this is Cider's debut I can't be that hard on it.
I don't do enough book reviews on this site, but I felt that this book has influenced me enough to say something. Chris Sells and Ian Griffiths have a great book on their hands. I enjoyed the "Hello Avalon..." approach to the early chapters, but this book really helped me delve into the the tricky details of XAML data binding, animation and click-once deployment of WPF apps. I tend to not finish reading most technical books because they are written as references, not books. This book takes the departure and is actually readable. Chris and Ian are both masters of a story-driven approach to technical writing that I really enjoy. If you want to understand what WPF is all about or are using XAML in new projects, pick up this book.
Here is my first Avalon application. Its a Font Browser that shows all the fonts, allows you to specify a test phrase and size and will show Font alternates for a particular font, though I don't have any font's with alternates so I couldn't see this in action ;)
It does require the 2.0 Beta Framework and the Beta 1 Avalon package to be installed, but that's not much of a price to pay.
It's not finished yet, but I am working on a Font Browser using Avalon. It's fun to work with XAML and code-behind, but without splitter or treeview controls its hard to make something really fun. I am also working on a database browser with Avalon, but until I find a tree view that project is dead.
I will post the font browser this weekend.