UWP(XAML& C#):动画CommandBar图标

时间:2016-02-22 11:38:04

标签: c# xaml animation windows-10 win-universal-app

在与OneDrive同步照片集期间,如何使照片应用程序中的CommandBar图标动画化?我应该使用GIF图像还是有更好的方法来做到这一点?

1 个答案:

答案 0 :(得分:8)

在xaml:

中定义Storyboard很容易
 <Page.Resources>
    <Storyboard x:Name="IconRotation" AutoReverse="False" RepeatBehavior="Forever">
        <DoubleAnimation Duration="0:0:1" To="360" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.Rotation)" Storyboard.TargetName="symbolIcon" />
   </Storyboard>
 </Page.Resources>

SymbolIconAppBarButtonCommandBar

<CommandBar>
  <AppBarButton>
    <AppBarButton.Icon>
     <SymbolIcon x:Name="symbolIcon"  Symbol="Sync" RenderTransformOrigin="0.5,0.5" >
       <SymbolIcon.RenderTransform>
          <CompositeTransform/>
       </SymbolIcon.RenderTransform>
      </SymbolIcon>
     </AppBarButton.Icon>
    </AppBarButton>
  </CommandBar>

运行它并在cs文件中停止它:

IconRotation.Begin();
IconRotation.Stop();

要更改轮换速度,请在故事板上更改Duration属性,您应该能够像在Photo应用中一样获得完全相同的动画。