Frank La Vigne

Fear and Loathing in .NET

MVP Logo
Tablet PC MVP

Social Networks

Subscription Options

Add to Google

Subscribe in Bloglines

My Links


Post Categories

Archives

Image Galleries


GamerTag

Dev Community Events

Blog Stats

 

News


Blog Roll

Favorite Sites

Gadget Blogs

Tablet PC Links

Star Wars Scroller in Silverlight 3

Silverlight 3's Plane Projection feature inspired to create a Star Wars Crawler (See it in action)

silverlight 3 plane projection by you.

 

The text block resides in a Grid and the Grid has the following element

<Grid.Projection>
            <PlaneProjection x:Name="Projection"
                CenterOfRotationX="0.5"
                CenterOfRotationY="0.5"
                CenterOfRotationZ="0.5" RotationZ="0" RotationY="-1.393" RotationX="-45" />

</Grid.Projection>

This is what makes the text appear to be on a plane rotated 45 degrees away from the camera.

Cool, but what about animating this?

That's easy:

<Storyboard x:Name="Intro">
    <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="txtScroll" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)">
        <EasingDoubleKeyFrame KeyTime="00:00:00" Value="499.127"/>
        <EasingDoubleKeyFrame KeyTime="00:00:00.4000000" Value="499.12701416015625"/>
        <SplineDoubleKeyFrame KeyTime="00:00:44.4000000" Value="-777.966"/>
    </DoubleAnimationUsingKeyFrames>
</Storyboard>

In plain English, what I'm doing it changing the Y placement of the TextBlock on the Grid.

Since the plane projection is applied to the Grid, the "3D effect" of the plane projection will automatically be applied.

The only code to make this work is the code to start the Storyboard:

Storyboard sb = this.Resources["Intro"] as Storyboard;

sb.Begin();

Now, all I need to do is add music. :)

 

posted on Friday, May 01, 2009 10:55 PM