1 Simple Step for Commanding in Silverlight

Christopher Bennage — Wed, 03 Mar 2010 16:24:00 GMT

Silverlight 4 is now supporting the commanding that we’ve come to love from WPF. Commanding was a foundational feature for MVVM. It’s what enabled us to bind to methods on our view models.

John Papa has an excellent introductory post on using commands in Silverlight 4. This pattern is called the DelegatingCommand pattern (or sometimes RelayingCommand).

I’d like to show you the Caliburn way of handling this. I’m going to steal John’s viewmodel from the aforementioned post (and hope he doesn’t sue).

The viewmodel presents a collection of all products and a filtered collection of products. You can modify the filter by calling LoadProducts().

public class ProductViewModel
{
    public ProductViewModel()
    {
        Products = new ObservableCollection<Product>();

        AllProducts = new ObservableCollection<Product>
                          {
                              new Product {ProductId = 1, ProductName = "Apple"},
                              new Product {ProductId = 2, ProductName = "Orange"},
                              new Product {ProductId = 3, ProductName = "Banana"},
                              new Product {ProductId = 4, ProductName = "Pear"},
                              new Product {ProductId = 5, ProductName = "Grape"},
                              new Product {ProductId = 6, ProductName = "Grapefruit"},
                              new Product {ProductId = 7, ProductName = "Strawberry"},
                              new Product {ProductId = 8, ProductName = "Melon"},
                              new Product {ProductId = 9, ProductName = "Guava"},
                              new Product {ProductId = 10, ProductName = "Kiwi"},
                              new Product {ProductId = 11, ProductName = "Pineapple"},
                              new Product {ProductId = 12, ProductName = "Mango"}
                          };
    }

    public ObservableCollection<Product> AllProducts { get; set; }

    public ObservableCollection<Product> Products { get; set; }

    public void LoadProducts(string filter)
    {
        Products.Clear();
        var query = from p in AllProducts
                    where p.ProductName.ToLower().StartsWith(filter.ToLower())
                    select p;
        foreach (var item in query)
        {
            Products.Add(item);
        }
    }

    public bool CanLoadProducts
    {
        get { return true; }
    }
}

Let me point out a few notable differences between John’s original and my version of the viewmodel.

There is no ICommand property.
CanLoadProducts is a property on my model, it was a method on the original

The snippet from the corresponding view would look like this:

<StackPanel>
    <TextBox x:Name="filter" />
    <Button x:Name="LoadProducts" Content="Load" />
</StackPanel>

The Explanation

It’s binding by convention, and it is a new feature of Caliburn added after the 1.1 release^[1]. So you’ll need to get the trunk to do this.

When you have a button named LoadProducts, Caliburn will look for a method on your viewmodel named LoadProducts and automagically handle the binding for you. In addition, it will check for either a method or property (as in this example) named CanLoadProducts that it will use to toggle the enable/disabled for the button. Also, since we have a parameter named “filter” on LoadProducts, Caliburn will check to see if there is an element in the view name “filter” and pull the value from that.

There’s a great deal more that you can do with conventions (and you can even plug in your own conventions).

This also works for Silverlight 3 and WPF.

You can also see an example of this in Ayende’s sample app Alexandria.

Actually, you can do some of this in 1.0, but it is easier and much richer in the trunk. Ping the forums if you have a need to use it in 1.x.

Things I’d Like To Present

Christopher Bennage — Fri, 08 Jan 2010 11:32:00 GMT

In case you are not familiar with MIX, it is a conference from Microsoft focusing on the collaboration of design and development. Admittedly, the sessions tend to favor the developer, but there is always excellent design and UX content.

There was an open call for presentations this year and the community gets to choose which of the proposals will be selected. There are a number of excellent proposals and I encourage you to go check out the list and vote for the sessions that you are genuinely interested in. (Even if you won’t be attending, the sessions will be broadcast.)

Here are some sessions that I proposed for MIX10:

Cross Compiling Games for Silverlight & XNA

Our friend and Silverlight MVP, Bill Reiss, has created an incredible library that enables you to cross compile XNA games for Silverlight. The library is called SilverSprite and we feature it on Silver Arcade. (Wow, that’s a lot of ‘silvers’ in one paragraph.)

In this session, we’d write a simple game for XNA (discussing some of the basic of game dev along the way) and then port the game over to Silverlight.

This is an area where I wish I could spend more time. I love game development, but it’s always taking a back burner to other projects.
[vote for this]

LinqToSQL and EntityFramework Profilers: Case Study

If you aren’t already familiar with the UberProf suite of ORM profilers, you can read tales of the development on Ayende’s blog. Rob and I built the UI side of the application, and we learned a lot in the process. I’d like to do a talk were we discuss the challenges of the project, how we solved them, and what we did wrong.

Yes, NHProf will be included too. (I submitted a case study for it last year, and it didn’t get picked. I have to sneak it in).

A few interesting aspects:

we built this using MVVM, but well before Caliburn reached maturity.
the four separate apps (NHProf, EFProf, L2SProf, HProf) all use a single code base.
we’re about to port the project from WPF to Silverlight.

[vote for this]

Silver Arcade: Case Study

This is a presentation that Rob and I have made a couple of times. Most recently at the Orlando .NET Users Group. We walk through the actual code for Silver Arcade explaining the philosophy, design choices and mistakes we made along the way.

For MIX, we would focus more design and UX choices, such as the separation of the behaviors from the views. However, we like to have a lot of audience interaction and tend to follow where ever the questions led (especially those leading questions that Scott Densmore tends to ask).

Silver Arcade is also interesting because we deliberately used a number of newer hipper technologies; including Azure, ASP.NET MVC, jQuery, MEF, NHibernate and so on.
[vote for this]