Download: Source

Try: SvFx

See: Online Demo

See it in action below:

These patterns will be available in future release. We focused on using Projection feature available in Silverlight 3 to add some cool transition effects for the SlideShow control.

New pattern is called Rotation3DSlideShowPattern. It has two properties ShowRotation and HideRotation. These properties are of ElementRotation type and are used to create show and hide transitions.

ElementRotation has Center, Offset and Rotation properties, which can be used to define 3D rotation effect.

I think it's better to examine how it can be used inside XAML code:

 <slideshow:Rotation3DSlideShowPattern 
                                     x:Name="SimpleRotation" 
                                     SpeedRatio="2" 
                                     TweenType="None" 
                                     SlideMode="Sequence" 
                                     SlideDelay="0.2" >
     <slideshow:Rotation3DSlideShowPattern.ShowRotation >
          <effects:ElementRotation >
               <effects:ElementRotation.Center >
                    <common:Point3D 
                                   X="0.5" 
                                   Y="0.5" 
                                   Z="0.5" />
               </effects:ElementRotation.Center>
               <effects:ElementRotation.Offset >
                    <common:Point3D 
                                   X="0" 
                                   Y="0" 
                                   Z="0" />
               </effects:ElementRotation.Offset>
               <effects:ElementRotation.Rotation >
                    <common:Point3D 
                                   X="0" 
                                   Y="90" 
                                   Z="0" />
               </effects:ElementRotation.Rotation>
          </effects:ElementRotation>
     </slideshow:Rotation3DSlideShowPattern.ShowRotation>
     <slideshow:Rotation3DSlideShowPattern.HideRotation >
          <effects:ElementRotation >
               <effects:ElementRotation.Center >
                    <common:Point3D 
                                   X="0.5" 
                                   Y="0.5" 
                                   Z="0.5" />
               </effects:ElementRotation.Center>
               <effects:ElementRotation.Offset >
                    <common:Point3D 
                                   X="0" 
                                   Y="0" 
                                   Z="0" />
               </effects:ElementRotation.Offset>
               <effects:ElementRotation.Rotation >
                    <common:Point3D 
                                   X="0" 
                                   Y="-90" 
                                   Z="0" />
               </effects:ElementRotation.Rotation>
          </effects:ElementRotation>
     </slideshow:Rotation3DSlideShowPattern.HideRotation>
 </slideshow:Rotation3DSlideShowPattern>

That's how Rotation3DSlideShowPattern can be used inside XAML code. I think that the code shown above is really simple compared to the actual transition effect we get.

What do you think? Is there any way we can simplify the code above? Please let me know!