Jan 7

Written by:
1/7/2011 9:01 PM 

Perhaps it would have been simpler if I just used a button, but I already created my WP7 app with a list that contained non buttons. However, when you select an item it doesn’t move at all. This didn’t quite feel right. The fix turned out to be really simple.

In Microsoft Expression Blend, I right-click on the ListBox, and selected Edit Additional Templates > Edit Generated Items > Edit Current.

In the Objects and Timeline window, I create a new Storyboard.

I call it ButtonPress 

I click on the Canvas 

Record a Keyframe 

A Keyframe is recorded

I move the timeline

I then set the Transform properties for the Canvas 

The change is reflected on the artboard

The Keyframes also show on the timeline

I move the timeline again

I then return the Transform properties for the Canvas back to 0

I can now play the animation and it will show on the artboard

I then go into the Assets window, and get a ControlStoryboard Action Behavior

I drop it on the Canvas

I set the Properties for the Behavior to play the ButtonPress Storyboard when the Mouse Button is down on the Canvas (this also fires when a finger is pressed on the Canvas on the Phone)

When done, the Return scope button takes me back to normal editing mode

When the Canvas element in the ListBox is pressed, the animation will play