New 3D Features in Silverlight 3

Mar 20 2009

You may have heard the news that Silverlight 3 has entered a developer beta phase. This news was shared at MIX09 on Wednesday. We’ve been fortunate here at RD2 to have been participating in the Silverlight 3 early adopter program for the past couple of months.

What’s New?

You can read about all of the new features on the official Silverlight 3 page. The two main reasons we’ve been involved in the new release are the 3D perspectives and the H.264 support. In this article I’ll discuss the 3D perspectives and leave the H.264 support for a later post.

3D Perspective

Silverlight 3 makes it easy to transform objects on a 3D plane. The Projection property on objects allows you to assign a PlaneProjection that can specify rotation on an X, Y, or Z axis and also specify the rotation point for each of those axes.

C#

Grid g = new Grid();

PlaneProjection p = new PlaneProjection();
p.CenterOfRotationX = 0.5;
p.CenterOfRotationY = 0.5;
p.CenterOfRotationZ = 0.5;
p.RotationX = 20.0;
p.RotationY = 80.0;
p.RotationZ = -30.0;

g.Projection = p;

XAML


CenterOfRotationY="0.5"
CenterOfRotationZ="0.5"
RotationX="20.0"
RotationY="80.0"
RotationZ="-30.0" />

You can then animate those rotation values using the standard storyboard animations.

C#

Storyboard s = new Storyboard();

DoubleAnimation d = new DoubleAnimation();
d.From = 0.0;
d.To = -30.0;
d.Duration = new Duration(TimeSpan.FromSeconds(1.0));
Storyboard.SetTarget(d, target);
Storyboard.SetTargetProperty(d,
new PropertyPath("(UIElement.Projection).(PlaneProjection.RotationY)"));

s.Children.Add(d);

XAML


To="-30.0"
Duration="00:00:01"
Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.RotationY)"
Storyboard.TargetName="target"/>

Demo

We’re really excited to be able to show off some demo code for these new features. We have a public project on CodePlex that shows a Flickr user’s photostream in an animated Silverlight slideshow. Feel free to download the source and do whatever you want with it. We’ll make periodic changes to this over the months ahead, so leave us some feedback and ideas as well.

Keep in mind that in order to run this demo on your machine, you’ll need to install all the Silverlight 3 bits which will make your machine a Silverlight 3 beta dev environment. You should really only do this if you’re ready to take the plunge into Silverlight 3 development since you can only target one Silverlight version in Visual Studio. We prepared a short screencast of our project to hopefully convince you to download the new Silverlight and give it a try. Enjoy!

Leave a Reply