Question

我有一个有两个按钮的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>

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

有人知道如何解决这个问题吗？如果是这样，怎么样？

谢谢

Answer 1

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

Windows Phone中的动画按钮位置

1 个答案: