Thursday, October 25, 2012

Windows Phone Flip Animation

You can use the Projection class to produce the flip animation of a control.

The following XAML ilustrates this:
<UserControl.Resources>
    <Storyboard x:FieldModifier="private" x:Name="SBStartAnimation">
        <DoubleAnimation Storyboard.TargetName="SPPanel" Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.RotationX)" From="-90" To="0" Duration="0:0:0.150" />
    </Storyboard>
</UserControl.Resources>

<Border x:FieldModifier="private" x:Name="BShade" Background="#aa000000">
    <StackPanel x:FieldModifier="private" x:Name="SPPanel" VerticalAlignment="Top" Background="#222222">
        <StackPanel.Projection> 
            <PlaneProjection CenterOfRotationY="0.5" RotationX="0" /> 
         </StackPanel.Projection> 
        <Image Source="/Background.png" HorizontalAlignment="Center" Stretch="None" />
        <LC:ProgressLine x:FieldModifier="private" x:Name="PLProgress" Margin="0,-5,0,10" /> 
        <TextBlock Text="Working, please wait..." HorizontalAlignment="Center" Margin="0,0,0,20" /> 
    </StackPanel>
</Border> 
The SPPanel Stackpanel is flipped as defined in the SBStartAnimation Storyboard.

No comments:

Post a Comment