Silverlight | WPF | Microsoft.Net » perspective 3D http://joel.neubeck.net Simplifing structure without changing results Wed, 26 May 2010 18:43:15 +0000 en hourly 1 http://wordpress.org/?v=3.0 Perspective 3D Screen flip with PlaneProjection http://joel.neubeck.net/2009/04/perspective-3d-screen-flip-with-planeprojection/ http://joel.neubeck.net/2009/04/perspective-3d-screen-flip-with-planeprojection/#comments Tue, 07 Apr 2009 16:31:09 +0000 joel http://joel.neubeck.net/?p=384 Almost a year ago I created a Silverlight 2 example that demonstrated how you could use a procedural animation to duplicate one of the transitions used on the iPhone. When a iPhone user goes to make a phone call, if you choose to display the keypad there is a cool 3D flip that occurs. Back in SL2 it was a pretty lengthy animation that never quite duplicated the correct amount of 3d perspective needed to make the flip look realistic.

Thankfully in Silverlight 3 we now have perspective 3D which allows us to take 2D objects and rotate them in 3D space. For this example I will use PlaneProjection to rotate a Grid with an extremely simple DoubleAnimationUsingKeyFrames.

3dflip_sl3


My first DoubleAnimationUsingKeyFrames simply targets the RotateY property of Grid.Projection.PlaneProjection. The second two are used to fade the back from opacity 0 to 1 and the front from opacity 1 to 0.

3dflip_sl3_2

To get my grid representing the back to start flipped 180 degrees I simply apply PlaneProject to it as well.

3dflip_sl3_3


Here is the final example with nothing in the code behind except for the Flip button handler.

Code: ScreenFlipv3.zip

]]> http://joel.neubeck.net/2009/04/perspective-3d-screen-flip-with-planeprojection/feed/ 0