TransitioningContentControl, developed by Ruurd Boeke, is one of the few Silverlight controls striving for what I am calling “data-driven animation.” You can load content from a database—let’s say an Observable Collection of data—, display one item from this Collection in the
TransitioningContentControl and then transition to the next item in the Collection—to be displayed in the
TransitioningContentControl. This transition is, by default, a story-board animation. Awe… some!
- Compose a “previz” storyboard in a separate file (I open a XAML-only file in Expression Blend among my “packed XAML” samples in my Silverlight BiggestBox).
- Edit a copy of the
TransitioningContentControlstyle in the actual layout.
- Add a new, named
VisualStateGroup x:Name="PresentationStates"in the Template setter of your copy of the
- Set the
Setter Property="Transition"value to the name of this
- When the transition is triggered, ensure that it does not trigger again during the transition. This will cause an exception. Use the
TransitionCompletedevent in a strategy to avoid this exception.
Composing the “previz” storyboard is the first time in my Microsoft developer life that a business need demands the use of storyboard composition (within the Expression Blend 4 timeframe of course).
Now some critiques…
- You should not need to use a style to customize the transition animation. This should not be the only way of customizing the transition.
- Silverlight, animation-based behaviors, like the
FluidMoveBehaviorshould be pluggable/Blendable into the control.
- No MSDN documentation (still considered “experimental”?).
Beyond the Transitioning Content Control?
Expression Blend Architect Kenny Young suggested years ago that Behaviors allow developers to avoid resorting to building storyboards by hand for relatively simple animations. Animating the event when an item is added/removed to/from a
ListBox should be considered a ‘simple’ animation. A Behavior should handle this.
The Transitioning Content Control does not support behaviors out of the box. In fact, to customize the animations that come with this control requires knowledge of “templating” and building storyboards. This would explain to me why this control might still be considered “experimental.”
So I tried for several days to avoid using this control by trying several techniques based on Behaviors. These are some of my findings:
FluidMoveBehaviorcan be configured to animate
Children. I have been unable to get the expected results from
FluidMoveBehaviorin ‘self-mode’… There is an old sample marked “Download AppliesTo: Self Example” by Microsoft’s Kirupa Chinnathambi that shows
Selfworking for Silverlight 3—however, when I upgrade the sample to Silverlight 4 it stops working! By the way, where the hell is Kenny Young?
- One workaround that should deal with this
FluidMoveBehaviorin ‘self-mode’ issue involves using an
ItemsControlthat is meant to only hold one item. Then
ItemsControl.ItemsPanelcan hold this behavior in its template. I tried this without success (but was probably confused with drowsy, late-night frustration).
- “Animated Visual State Transitions with the Transitioning Content Control [Jesse Liberty]”
- “Using the FluidMove Behavior—Page 4”
- “ItemsControl.Items must not be a UIElement type when an ItemTemplate is set.” This error came to me from trying to bind the currently selected item of a
InitialTagSpecify the tag that this element will appear to come from. Select Element for a stand-alone scenario. Select
DataContextfor a data-bound scenario. The
FluidMoveBehavioraction will attempt to locate an element that has been previously tagged with the same data using a