1 <UserControl 2 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 3 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 4 xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk" xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity" xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions" mc:Ignorable="d" 5 x:Class="FlipDemo.MainPage" 6 Width="640" Height="480"> 7 8 <Grid x:Name="LayoutRoot" DataContext="{Binding Source={StaticResource SampleDataSource}}"> 9 <VisualStateManager.VisualStateGroups> 10 <VisualStateGroup x:Name="VisualStateGroup"> 11 <VisualStateGroup.Transitions> 12 <VisualTransition GeneratedDuration="0:0:3"/> 13 <VisualTransition GeneratedDuration="0:0:3" To="ToFront"> 14 <Storyboard> 15 <DoubleAnimation Duration="0:0:0.9" To="0.25" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" Storyboard.TargetName="dataGrid"/> 16 <DoubleAnimation Duration="0:0:0.9" To="0.25" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)" Storyboard.TargetName="dataGrid"/> 17 <DoubleAnimation BeginTime="0:0:1" Duration="0:0:0.4" To="-180" Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.RotationY)" Storyboard.TargetName="dataGrid"/> 18 <DoubleAnimation BeginTime="0:0:1.2" Duration="0" To="-10" Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.GlobalOffsetZ)" Storyboard.TargetName="dataGrid"/> 19 <DoubleAnimation BeginTime="0:0:1.5" Duration="0:0:1.5" To="1" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" Storyboard.TargetName="canvas"/> 20 <DoubleAnimation BeginTime="0:0:1.5" Duration="0:0:1.5" To="1" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)" Storyboard.TargetName="canvas"/> 21 <DoubleAnimation BeginTime="0:0:1" Duration="0:0:0.4" To="-360" Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.RotationY)" Storyboard.TargetName="canvas"/> 22 </Storyboard> 23 </VisualTransition> 24 <VisualTransition From="ToFront" GeneratedDuration="0:0:3"> 25 <Storyboard> 26 <DoubleAnimation BeginTime="0:0:1.5" Duration="0:0:1.5" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="dataGrid"/> 27 <DoubleAnimation BeginTime="0:0:1.5" Duration="0:0:1.5" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" Storyboard.TargetName="dataGrid"/> 28 <DoubleAnimation BeginTime="0:0:1.5" Duration="0:0:1.5" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)" Storyboard.TargetName="dataGrid"/> 29 <DoubleAnimation BeginTime="0:0:1" Duration="0:0:0.5" Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.RotationY)" Storyboard.TargetName="dataGrid"/> 30 <DoubleAnimation BeginTime="0:0:1.1" Duration="0:0:0.2" Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.GlobalOffsetZ)" Storyboard.TargetName="dataGrid"/> 31 <DoubleAnimation Duration="0:0:0.9" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" Storyboard.TargetName="canvas"/> 32 <DoubleAnimation Duration="0:0:0.9" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)" Storyboard.TargetName="canvas"/> 33 <DoubleAnimation BeginTime="0:0:1" Duration="0:0:0.5" Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.RotationY)" Storyboard.TargetName="canvas"/> 34 </Storyboard> 35 </VisualTransition> 36 </VisualStateGroup.Transitions> 37 <VisualState x:Name="Normal"/> 38 <VisualState x:Name="ToFront"> 39 <Storyboard> 40 <DoubleAnimation Duration="0" To="0" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="dataGrid" d:IsOptimized="True"/> 41 <DoubleAnimation Duration="0" To="0.25" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" Storyboard.TargetName="dataGrid" d:IsOptimized="True"/> 42 <DoubleAnimation Duration="0" To="0.25" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)" Storyboard.TargetName="dataGrid" d:IsOptimized="True"/> 43 <DoubleAnimation Duration="0" To="-180" Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.RotationY)" Storyboard.TargetName="dataGrid" d:IsOptimized="True"/> 44 <DoubleAnimation Duration="0" To="-10" Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.GlobalOffsetZ)" Storyboard.TargetName="dataGrid" d:IsOptimized="True"/> 45 <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" Storyboard.TargetName="canvas" d:IsOptimized="True"/> 46 <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)" Storyboard.TargetName="canvas" d:IsOptimized="True"/> 47 <DoubleAnimation Duration="0" To="-360" Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.RotationY)" Storyboard.TargetName="canvas" d:IsOptimized="True"/> 48 </Storyboard> 49 </VisualState> 50 </VisualStateGroup> 51 </VisualStateManager.VisualStateGroups> 52 <Grid.Background> 53 <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> 54 <GradientStop Color="Black" Offset="0"/> 55 <GradientStop Color="#FF3080D8" Offset="1"/> 56 </LinearGradientBrush> 57 </Grid.Background> 58 <Canvas x:Name="canvas" Margin="66,65,60,90" RenderTransformOrigin="0.5,0.5"> 59 <Canvas.Projection> 60 <PlaneProjection RotationY="-180"/> 61 </Canvas.Projection> 62 <Canvas.RenderTransform> 63 <CompositeTransform ScaleX="0.25" ScaleY="0.25"/> 64 </Canvas.RenderTransform> 65 <Canvas.Background> 66 <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> 67 <GradientStop Color="#FF14C4DE" Offset="0"/> 68 <GradientStop Color="#FF0A4249" Offset="0.996"/> 69 </LinearGradientBrush> 70 </Canvas.Background> 71 <sdk:Calendar Canvas.Left="43" Canvas.Top="23"/> 72 </Canvas> 73 <sdk:DataGrid x:Name="dataGrid" Margin="66,65,60,90" AutoGenerateColumns="False" ItemsSource="{Binding Collection}" RenderTransformOrigin="0.5,0.5"> 74 <sdk:DataGrid.Projection> 75 <PlaneProjection/> 76 </sdk:DataGrid.Projection> 77 <sdk:DataGrid.RenderTransform> 78 <CompositeTransform/> 79 </sdk:DataGrid.RenderTransform> 80 <sdk:DataGrid.Columns> 81 <sdk:DataGridTextColumn Binding="{Binding Address}" Header="Address"/> 82 <sdk:DataGridTextColumn Binding="{Binding Company}" Header="Company"/> 83 <sdk:DataGridTextColumn Binding="{Binding Email}" Header="Email"/> 84 <sdk:DataGridTextColumn Binding="{Binding Name}" Header="Name"/> 85 <sdk:DataGridTextColumn Binding="{Binding Tel}" Header="Tel"/> 86 </sdk:DataGrid.Columns> 87 </sdk:DataGrid> 88 <StackPanel Height="49" Margin="166,0,163,0" VerticalAlignment="Bottom" Orientation="Horizontal" Background="#FF434740"> 89 <Button Content="查看日期" Height="32" Margin="56,0,0,0" Width="74" VerticalAlignment="Center" HorizontalAlignment="Left"> 90 <i:Interaction.Triggers> 91 <i:EventTrigger EventName="Click"> 92 <ei:GoToStateAction StateName="ToFront"/> 93 </i:EventTrigger> 94 </i:Interaction.Triggers> 95 </Button> 96 <Button Content="查看信息" Height="31" Margin="71,0,55,0" Width="68" RenderTransformOrigin="0.64,1.967" HorizontalAlignment="Center" VerticalAlignment="Center"> 97 <i:Interaction.Triggers> 98 <i:EventTrigger EventName="Click"> 99 <ei:GoToStateAction StateName="Normal"/> 100 </i:EventTrigger> 101 </i:Interaction.Triggers> 102 </Button> 103 </StackPanel> 104 </Grid> 105 </UserControl>