Using Blend 2.5 Visual State Manager to Create a Silverlight 2.0 Image Viewer

1149 Users read it.
by Victor Gaudioso

Recently Microsoft released Blend 2.5 June Preview.  So, of course I started looking around to find what was new.  I was blown away by a new panel called the State panel.  This new panel allows you to create State Groups that you can then add states to (called a Visual State Manager (VSM)).  You can even specify the time (in seconds) it takes for a State to transition from one to the next.  So, I then started thinking about a practical application for this new feature.  Of course I could have made an application that had custom buttons (really just a series of grids and not actually a Button Control) and used the State panel to make MouseEnter and MouseLeave effects.  But, this seemed to me to not really show the power of this new feature.  So, then I came up with an idea to make an Image Viewer and use the VSM to handle the animation for me.  Here is how it works: when you roll over the thumbnail it grows to a larger size, when you roll off of it, it shrinks back down to the thumbnail size (see Figure 1-0).  Let’s get started now and build the StateImageViewer UserControl.

Figure 1-0: The StateManagerViewer UserControl in action.

User Rating (1 vote)
0 reviews available
$2.79 USD

User Level:Any
Product:Blend, Silverlight
Number Of Pages:18

Victor Gaudioso

Victor is a senior application engineer at IdentityMine, a top-tier software company specializing in designing and developing cutting edge software applications, creating customized WPF/Blend and Silverlight training programs and creating tools for designers and developers. Victor has worked with Fortune 500 companies such as Microsoft, Harrah's, Mattel, NBC/Universal, Disney, Best Buy, GameStop, Vivendi Universal Games, and New Line Cinema among others. Victor, a former Flash/ActionScript engineer still stays active in the Flash community by writing articles and tutorials on where he is also a moderator.

See All Postings From Victor Gaudioso >>

Follow us on twitter Subscribe to our RSS feed
Activate your free membership today | Login | Currency