Templating a XAML CheckBox to a thumbs-up/down control using Expression Blend

The checkbox has been been around in the Graphical User Interface for as long as I can remember doing GUI – since the early 90’s I guess. You know what, let’s make that “it’s been around for longer than I care to remember” ;). For my newest Windows Phone project I wanted something different. In stead of boring old 

I wanted something like this:

Turns out you can do this in pure XAML. And almost entirely in Expression Blend, too. I could just post the XAML and be done with it, but I like to document the track I took, not only to educate you, but also to remember myself how the hell I got here in the first place ;-).

Setting the stage

    Open Visual Studio 2010
    Create a new Windows Phone 7 (7.1 of course!) project,
    Make a folder “icons”build actions
    Download this image to your computer
    Paste it in the “icons” folder in Visual Studio
    Double check the image’s properties, they should be as showed to the right.
    Save the project

Read more: Microsoft .NET by Example
QR:

Posted via email from Jasper-net