Thursday, December 16, 2010

A Silverlight MVVM Feed Reader from Scratch in 30 Minutes

I thought it might be useful for users (and potential users) of Jounce, MVVM, and Silverlight in general if I were to show the full process of building an application. When people ask me about how complicated MVVM is, I reply "it's easy when you know it and use the right framework." I hope this video illustrates that. I also find Silverlight in general to be an amazing technology because I can build a useful application so quickly. You'll see in the video I could have done it faster using short cuts, designer, etc. I am still waiting for someone to show me how to do the same thing in HTML5 in the same amount of time.

After recording this video, I noted two issues that have been corrected in the source and the example below. These would not impact the overall time but I did catch them only after I went live. Here are the fixes:

Text Update

In both FireFox and Chrome, hitting TAB won't advance from the text box properly as it does in IE, so the "GO" button never activated unless you clicked outside of the application. This is easily fixed by resetting the error state on a key press. In the XAML, I just wired a text change event:

<TextBox Grid.Column="1" Grid.Row="1" TextChanged="TextBox_TextChanged"...>

In the code-behind, I simply update the data-binding source:

private void TextBox_TextChanged(object sender, TextChangedEventArgs e)
{
    ((TextBox)sender).GetBindingExpression(TextBox.TextProperty).UpdateSource();
}

The view model then gets this tweak to clear the errors to enable the button (it will put the errors back if you click and there is a problem):

public string FeedUri
{
    get { return _feedUri; }
    set
    {
        _feedUri = value;
        RaisePropertyChanged(() => FeedUri);
        ClearErrors(() => FeedUri);
    }
}

Missing Summary

For some reason IE brings back summary information, but Chrome and Firefox do not from the feed. Therefore, I needed to add this little fix to avoid a null object reference exception when the summary information is missing:

Summary = ConvertHtml(item.Summary != null ? item.Summary.Text : string.Empty)

Finally, in the video I typed "encode" instead of "decode" on the http utility. These are the only changes to the source and example below from what you see in the video.

RSS Feed Reader in 30 Minutes from Jeremy Likness on Vimeo.

You can download the source code here.

The finished product is here:

Enjoy!
Jeremy Likness