Silverlight 3 introduces a little bit of 3D support out of the box.  Don’t get your hopes up, you’re not going to take what’s provided and write the next best First Person Shooter (although, using Silverlight 3’s GPU Acceleration and you just might J),  but you can do some pretty neat effects in very short order. In ScottGu's keynote at MIX, he showed a nice PlaneProjection with some Physics effects that made the projection "wobble" when clicked with the mouse.

What Silverlight 3 Beta 1 provides is a PlaneProjection, which allows you to rotate a 2D Canvas in 3D space. Here is a quick example. Suppose you have an image that looks like this:

… and then you place that image into a Canvas and add a PlaneProjection with a RotationX value of 50:

<Canvas x:Name="canvas3D" Height="400" Width="600" Background="{x:Null}" HorizontalAlignment="Center" VerticalAlignment="Center">

       <Canvas.Projection>

              <PlaneProjection RotationX="50" />

       Canvas.Projection>

       <Image Height="229" Width="234" Canvas.Left="192" Canvas.Top="171" Source="logo.png" Stretch="Fill"/>

Canvas>

This example will display the contents of “canvas3D” rotated at the X axis at 50 degrees, which will look something like this:

Not bad, but the really cool effects come from animating the PlaneProjection. We can use a StoryBoard to change any of the properties of the PlaneProjection and make some nice effects. Let’s use the projection to create a fly-in effect where the image rotates in 3D space up to the user.

We can use a DoubleAnimationUsingKeyFrames to change the RotationX of the Projection. This will make the Canvas Spin. Then we can add a second DoubleAnimation on GlobalOffsetZ, which will make the Canvas Zoom up to the user’s view.

<Storyboard x:Name="Storyboard1">

    <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="canvas3D" Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.RotationX)">

        <EasingDoubleKeyFrame KeyTime="00:00:00" Value="0"/>

        <EasingDoubleKeyFrame KeyTime="00:00:05" Value="360"/>

    DoubleAnimationUsingKeyFrames>

    <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="canvas3D" Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.GlobalOffsetZ)">

        <EasingDoubleKeyFrame KeyTime="00:00:00" Value="-30000"/>

        <EasingDoubleKeyFrame KeyTime="00:00:05" Value="0"/>

    DoubleAnimationUsingKeyFrames>

Storyboard>

UserControl.Resources>

Here is a demo application showing this animation of PlaneProjection in action:

IMPORTANT: THE FOLLOWING IS A SILVERLIGHT 3 DEMO! SILVERLIGHT 3 IS CURRENTLY IN BETA AND YOU SHOULD ONLY INSTALL SL3 IF YOU ARE A DEVELOPER INTERESTED IN EXPERIMENTING!

[VIEW THE DEMO]  [DOWNLOAD THE SOURCE]