2016-07-26 85 views
0

如何通过单击按钮触发下面的颜色动画,而不使用任何代码隐藏?XAML从按钮启动动画

我知道如何在程序上启动动画 - 但我想将所有内容保存在XAML中。

目前动画运行所有的时间,因为它是由Grid的装载触发它包含在。

<Window x:Class="WpfApplication1.MainWindow" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     Title="MainWindow" Height="350" Width="525"> 
    <Grid> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="auto"></RowDefinition> 
      <RowDefinition Height="*"></RowDefinition> 
     </Grid.RowDefinitions> 
     <Grid.Triggers> 
      <EventTrigger RoutedEvent="Grid.Loaded"> 
       <BeginStoryboard> 
        <Storyboard> 
         <ColorAnimation 
          Storyboard.TargetName="ChangingBrush" 
          Storyboard.TargetProperty="Color" 
          From="White" 
          To="Blue" 
          Duration="0:0:2" 
          AutoReverse="True" 
          RepeatBehavior="Forever"></ColorAnimation> 
        </Storyboard> 
       </BeginStoryboard> 
      </EventTrigger> 
     </Grid.Triggers> 
     <Button 
      Grid.Row="0">Do Work</Button> 
     <Image Grid.Row="1"> 
      <Image.Source> 
       <DrawingImage> 
        <DrawingImage.Drawing> 
         <GeometryDrawing> 
          <GeometryDrawing.Brush> 
           <SolidColorBrush x:Name="ChangingBrush" Color="LightBlue"></SolidColorBrush> 
          </GeometryDrawing.Brush> 
          <GeometryDrawing.Geometry> 
           <EllipseGeometry RadiusX="1" RadiusY="1"></EllipseGeometry> 
          </GeometryDrawing.Geometry> 
         </GeometryDrawing> 
        </DrawingImage.Drawing> 
       </DrawingImage> 
      </Image.Source> 
     </Image> 
    </Grid> 
</Window> 

回答

1

给您的按钮名称和触发器绑定到它。如果您不希望它继续重复,请用RepeatBehavior="1x"></ColorAnimation>look here for further options替换RepeatBehavior="Forever"></ColorAnimation>

<Window x:Class="WpfApplication1.MainWindow" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     Title="MainWindow" Height="350" Width="525"> 
    <Grid> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="auto"></RowDefinition> 
      <RowDefinition Height="*"></RowDefinition> 
     </Grid.RowDefinitions> 
     <Grid.Triggers> 
      <EventTrigger RoutedEvent="Button.Click" SourceName="BeginButton"> 
       <BeginStoryboard> 
        <Storyboard> 
         <ColorAnimation 
          Storyboard.TargetName="ChangingBrush" 
          Storyboard.TargetProperty="Color" 
          From="White" 
          To="Blue" 
          Duration="0:0:2" 
          AutoReverse="True" 
          RepeatBehavior="Forever"></ColorAnimation> 
        </Storyboard> 
       </BeginStoryboard> 
      </EventTrigger> 
     </Grid.Triggers> 
     <Button 
      Name="BeginButton" 
      Grid.Row="0">Do Work</Button> 
     <Image Grid.Row="1"> 
      <Image.Source> 
       <DrawingImage> 
        <DrawingImage.Drawing> 
         <GeometryDrawing> 
          <GeometryDrawing.Brush> 
           <SolidColorBrush x:Name="ChangingBrush" Color="LightBlue"></SolidColorBrush> 
          </GeometryDrawing.Brush> 
          <GeometryDrawing.Geometry> 
           <EllipseGeometry RadiusX="1" RadiusY="1"></EllipseGeometry> 
          </GeometryDrawing.Geometry> 
         </GeometryDrawing> 
        </DrawingImage.Drawing> 
       </DrawingImage> 
      </Image.Source> 
     </Image> 
    </Grid> 
</Window> 
+0

我没有注意具体的例子,当我提供了另一个答案,所以我已经del'd我的和+1这个。 –