windows phone水平滑动翻页动画效果

大家看windows phone上的应用，很多都用到了这种效果，想书中圣等小说阅读器，还有腾讯各种产品的第一次进入应用的信息提示界面。
最近做小说阅读器，需要实现那种滑动翻页的效果，在网上找的一些东西呢，有不好看懂，所以就想自己弄。想了几天终于弄出来了，拿过来分享一下。
当然这只是一些基本的代码。
下面是前台的代码，主要是一个grid里面放3个stackpanel。每个stackpanel都为之渲染一个CompositeTransform动画。
xaml代码

<Grid x:Name="LayoutRoot" Background="Transparent" Tap="LayoutRoot_Tap">
            <StackPanel   HorizontalAlignment="Left" x:Name="zero" VerticalAlignment="Top" Width="480" Height="750" RenderTransformOrigin="0.5,0.5" Grid.RowSpan="2" Canvas.Top="20">
                <TextBlock Width="480" Height="750" TextWrapping="Wrap" Text="0000000000000000000000000000000000000000000000000000000000000000000000000000000" FontSize="60"></TextBlock>
                <StackPanel.RenderTransform>
                    <CompositeTransform/>
                </StackPanel.RenderTransform>
            </StackPanel>
            <StackPanel   HorizontalAlignment="Left" x:Name="one" VerticalAlignment="Top" Width="480" Height="750" RenderTransformOrigin="0.5,0.5" Grid.RowSpan="2" Canvas.Left="480" Canvas.Top="20">
                
                <TextBlock Width="480" Height="750" TextWrapping="Wrap" Text="11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111" FontSize="60"></TextBlock>
                <StackPanel.RenderTransform>
                    <CompositeTransform />
                </StackPanel.RenderTransform>
            </StackPanel>
            <StackPanel   HorizontalAlignment="Left" x:Name="two" VerticalAlignment="Top" Width="480" Height="750" RenderTransformOrigin="0.5,0.5" Grid.RowSpan="2" Canvas.Left="960" Canvas.Top="20">
                
                <TextBlock Width="480" Height="750" TextWrapping="Wrap" Text="222222222222222222222222222222222222222222222222222222222222222222222222222" FontSize="60"></TextBlock>
                <StackPanel.RenderTransform>
                    <CompositeTransform />
                </StackPanel.RenderTransform>
            </StackPanel>
    </Grid>

主要的效果是，三个stackpanel是重叠的。但是正常来说，是左边一个，右边一个，中间一个。
所以在页面初始化之后需要给一个动画，我们称之为init
动画代码放到<phone:PhoneApplicationPage.Resources>里面
初始化动画

<Storyboard x:Name="Init" >
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="zero">
                <EasingDoubleKeyFrame KeyTime="0" Value="-480"/>
            </DoubleAnimationUsingKeyFrames>

            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="two">
                <EasingDoubleKeyFrame KeyTime="0" Value="480"/>
            </DoubleAnimationUsingKeyFrames>
        </Storyboard>

当我们想实现翻下一页的功能。name为zero的那个stackpanel应该是跑到了屏幕的右边，而编号为one和two的则往左边移动480像素。
上一页功能：name为two的那个stackpanel应该是跑到了屏幕的左边，而编号为one和two的则往右边移动480像素。
下一页动画

<Storyboard x:Name="Next" >
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="zero">
                <EasingDoubleKeyFrame KeyTime="0" Value="480"/>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="one">
              &n

补充：移动开发 , Windows Phone ,