Sample Application Using the Red Skin

In early March, I did Scott Guthrie's Silverlight 2 Digg sample application walkthrough, and it was amazing to see how easy and with so few lines of code it was to put together such an application. The UI I generated in the walkthrough was very basic, so I thought it might be fun to design a more interesting UI and apply one of the control skin styles I created in a previous post.

I started in a typical manner and created a very quick mockup of what the UI might look like in Blend, and then I opened the Digg project in Blend and redesigned most of the UI. When it came time to utilize one of the control skins (I decided to use the Red skin), I had to leave Blend and open the project in Visual Studio (because Expression Blend 2.5 Preview doesn't support control template editing for Silverlight; although, future versions will). In Visual Studio, I copied the Red skin's Application.Resources data into the Digg application's Application.Resources section (this is in the App.xaml file), and then I opened Page.xaml and added style references for the ListBox, TextBox, and Button controls. I also decided to leverage the tooltip style for a little error helper UI that I designed to appear when a term is entered into the search box and returns no results (I did this because it confused me at first when no results were returned and nothing was communicated in the UI, so I figured I'd add a little helper UI for my own sake; not to mention that it benefits anyone else playing with the application ;) ). I decided not to design the user control that pops up a closer look at each story presented in the listbox (master/details control), so I removed that part of the project, and, now, I was pretty much good to go, so I built my project and you can check it out at the link below.

 The following is a screen shot of the resultant application UI, and you can view it live here...

You can check out my project by downloading it here. The project should open and run fine in Visual Studio, but if you decide to open it in Expression Blend 2.5 Preview you'll want to remove the Style reference (the ItemContainerStyle reference is fine) from the ListBox or the UI won't render properly when opening Page.xaml, and I'm trying to track down the cause of the problem now.