Search

This article on how to use Visual State Manager is an edited version of a a section of a chapter David Kelley wrote for the book 'Professional Silverlight 4'.

Source: Hacking Silverlight

Part of the job of the designer or creative that you typically see being done in Expression Blend is skinning and templating controls, views, and other objects. For the most part, all controls have built-in templates, and in Visual Studio it is very difficult to get at these as they are part of the framework and not exposed. Expression Blend has a great tool to help you get at the templates by creating copies of templates for any control, putting them into your code and allowing you to edit them in the Designer using the Visual State Manager area labeled States that was mentioned earlier.

Source: Eclipsed4utoo's Blog

I will be using Blend 4 to do this tutorial. Blend will make this much easier to do rather than writing the XAML by hand.

The Visual State Manager allows you to create “states” of objects and then move to those states. Moving to those states can be done through code(just one line of code), or by using behaviors.

In this first approach, we’ll create the MVVM project as well as the editing form and we’ll populate it with data from an object.  To get started, open Expression Blend 4 (or Visual Studio 2010)  and select MvvmLight (SL4)  Name the project Validation and make sure Language is set to C# (or VB if you are transposing) and the Version is set to 4.0.  Click OK.

Jesse's previous posts you can find here:

• Visual State Manager A-Z
• Styles (followup)
• Templates, Visual State and Fun With Controls
• Teaching An Old Control New Tricks With Templates

Let’s start with the form that is used in my Getting Started With Silverlight video: Adding Controls To An Application.  That video uses the design surface in Visual Studio 2010, and a subsequent video creates the grid in Xaml. To round things out I’ll create this version in Expression Blend.

I’ll begin by opening Blend and creating a new project. I’ll click  in the grid margins to create 5 rows and 2 columns. 

In this video tutorial I show you how to use Behaviors and the Visual State Manager to create a navigation bar that slides in when the user places their mouse at the top of the page and then slides away when they move their mouse away from the navigation.

This post of Jeremy Likness is dedicated to MVVM and Unit Tests with Silverlight.

Over the past few posts I've been exploring models for modularized Silverlight applications that follow the MVVM pattern (using Prism/CAL). In this post, I'd like to cover unit testing, and writing appropriate tests not just for the view model, but the view itself.

In this post Jeremy Likness covers a lot of material - Prism and Silverlight, Dynamic Modules, Navigation...

I started a project to update my personal website using Silverlight. The goal is to use Prism/Composite Application Guidance to build out a nice site that demonstrates some Silverlight capabilities and make the source code available as a reference. One of the first pieces I chose to tackle was ensuring I could facilitate deep linking using Silverlight navigation and still take advantage of dynamic module loading using the Prism framework.

Steve from the Expression Blend and Deisgn blog has posted a simple cartoon animation made with the help of Expression Blend.

One of the goals of Silverlight’s Visual State Manager technology is to let you do quite a bit of control customization without needing to use Blend’s Timeline, nor even having to know what a Storyboard is! Feel free to test-drive the Silverlight Button below, and then read on for a run-down of how easily it can be built.

In this episode, Mark Tucker demonstrates making a checkbox control out of an image.

In our last official episode, we added the MagnifierOverBehavior, but now the magnifier is on all the time. To allow the player to turn it on or off, we will create a CheckBox control from an image of a magnifying glass. Creating controls from objects on the artboard is really powerful.

Check out the other parts of the Creating a Hidden Object Game in Silverlight 3 series.