I presented Week 5 material this week from my 6 part SRA-University course on SilverLight development. We began by reviewing the downloader control and an MSDN on-demand
web cast that showed how to refactor redundant XAML code using a web service, the downloader control, and the CreateFromXAML function. The CreateFromXAML method takes a string of XAML and returns a SilverLight object. In the webcast, the design scenario is a page that displays sales for 6 technical books over the course of a year. The sales are displayed as bar graphs on a web page, and the months and height of the rectangles are animated as sales are shown for each month using SilverLight animation. Instead of hard coding all of the data, such as the number of books, a two dimensional array is loaded, which for the sake of the demo, simulates a web service call. The code and video for this particular sample can be downloaded from the
SilverLight .Net site.
We then proceeded to discuss Chapter 9 of the course text,
SilverLight 1.0 Unleashed by Adam Nathan. The chapter begins by performing animation by hand, using only JavaScript and the SetInterval/SetTimer and ClearInterval functions. We then discussed animation using the SilverLight object model. We are able to perform DoubleAnimation, PointAnimation, and ColorAnimation. With DoubleAnimation, we are able to animate Width, Height, Opacity, ScaleX, ScaleY, Angle and other properties that use the double data type.
Animation using the SilverLight object model requires the following:
1) EventTrigger - which represents a trigger that applies a set of actions (animation storyboards) in response to an event.
2) StoryBoard - controls animations with a timeline, and provides object and property targeting information for its child animations
3) Begin StoryBoard object - a trigger action that begins a StoryBoard and distributes its animations to their targeted objects and properties.
Standard animation only varies a specific property from one value to another. More complex animations are performed using keyframe animation. There are alternative interpolation methods using keyframes such as the following:
1) Linear interpolation - With linear interpolation, the animation progresses at a constant rate of the segment duration.
2) Discrete interpolation - With discrete interpolation, the animation function jumps from one value to the next without interpolation.
3) Splined interpolation - Splined interpolation can be used to achieve more realistic timing effects. Because animations are so often used to imitate effects that occur in the real world, developers might need fine control of the acceleration and deceleration of objects, and close manipulation of timing segments. Spline key frames enable you to animate with splined interpolation.
Next week we are going to wrap up this semester with a discussion of SilverLight audio and video capabilities. Week 5 course content can be downloaded
here. See you next week!