Step-by-step Shiny Button Template with Expression Blend 3 – Part 2

Introduction

This is the second of three posts showing how to use Expression Blend 3 to create a shiny button template for WPF and Silverlight.

Part 1 Creating the static template (WPF and Silverlight)

Part 2 Adding transitions using triggers (WPF only)

Part 3 Adding transitions with the Visual State Manager (Silverlight and WPF)

In part 1 we created a static template that was applied to the button shown below:

In this part we’ll be creating different appearances for various button states, and animating some of the transitions between states.

Step-by-step Shiny Button Template with Expression Blend 3 – Part 1

Introduction

In this step-by-step walkthrough I’ll be showing you how to use Expression Blend 3 to create a template for shiny round buttons somewhat like the play button in Windows Media Player or the back and forward buttons in Internet Explorer.

The tutorial is split over three posts:

Part 1 Creating the static template (WPF and Silverlight)

Part 2 Adding transitions using triggers (WPF only)

Part 3 Adding transitions with the Visual State Manager (Silverlight and WPF)

The resulting template can be applied to standard WPF or Silverlight Button controls and styled with different colours to create buttons like these: