Windows Phone 中的动画按钮位置答案

【问题标题】：Animate Button Position in Windows PhoneWindows Phone 中的动画按钮位置
【发布时间】：2013-04-08 21:37:09
【问题描述】：

我有一个有两个按钮的 Windows Phone 应用程序。我的应用程序的总体布局如下所示：

<Grid>
  <Grid.ColumnDefinitions>
    <ColumnDefinition Width="60" />
    <ColumnDefinition />
    <ColumnDefinition Width="60" />
  </Grid.ColumnDefinitions>

  <Grid x:Name="captionGrid" VerticalAlignment="Bottom" Grid.Column="1" Background="Transparent">                                
    <Border Background="#3D3D3D" Opacity="0.4" />
    <TextBlock Text="[Some Text Goes Here]" Foreground="White" TextWrapping="Wrap" />
  </Grid>

  <Button x:Name="previousButton" Click="previousButton_Click">
    <Button.Template>
      <ControlTemplate>
        <Grid Background="Transparent">
          <Border Background="#3D3D3D" Opacity="0.4" />
          <TextBlock Text="Prev." VerticalAlignment="Center" HorizontalAlignment="Center" Foreground="White" />
        </Grid>
      </ControlTemplate>
    </Button.Template>
  </Button>

  <Button x:Name="nextButton" Grid.Column="2" Click="nextButton_Click">
    <Button.Template>
      <ControlTemplate>
        <Grid>
          <Border Background="#3D3D3D" Opacity="0.4" />
          <TextBlock Text="Next" VerticalAlignment="Center" HorizontalAlignment="Center" Foreground="White" />
        </Grid>
      </ControlTemplate>
    </Button.Template>
  </Button>
</Grid>

当用户点击屏幕上的按钮时，我想运行 Storyboard。该 Storyboard 需要做三件事： 1) 将 Prev 按钮向左滑动，使其不可见。 2) 向右滑动下一步按钮，使其不在视野范围内。 3) 向下滑动 captionGrid 使其不在视野范围内。不过，我似乎无法为这三个元素的位置设置动画。 Margin 是一种厚度，因此 Silverlight 不直接支持它。如果我使用 Canvas 作为背景元素，则并非所有内容都适合屏幕的宽度/高度。

有人知道我该如何解决这个问题吗？如果有，怎么做？

谢谢

【问题讨论】：

标签： silverlight animation windows-phone-8

【解决方案1】：

您可以使用 RenderTransform 属性来制作动画。请参阅：http://msdn.microsoft.com/en-us/library/cc189019%28v=vs.95%29.aspx，标题为“动画变换”的部分

【讨论】：