2014-03-14 39 views
8

當前我有一個Image,它在加載時發出脈衝。當我更改圖像的可見性時,我希望激活故事板。但我看到Image.Triggers必須是EventTriggers激活故事板的可見性已更改

我需要掛鉤哪個事件?

<Image.Triggers> 
    <EventTrigger RoutedEvent="Image.Loaded"> 
     <BeginStoryboard> 
      <Storyboard> 
       <DoubleAnimation Storyboard.TargetName="MandateErrorImage" 
            Storyboard.TargetProperty="Opacity" 
            From="1.0" To="0.1" Duration="0:0:0.5" 
            AutoReverse="True" RepeatBehavior="0:0:2" /> 
      </Storyboard> 
     </BeginStoryboard> 
    </EventTrigger> 
</Image.Triggers> 
+3

頂端問題。我也需要這個答案。無法在互聯網上的任何地方找到它 – liquidsnake786

回答

5

在WPF有一個事件但UIElement.IsVisibleChanged是一個CLR事件,而不是路由事件,因此在EventTrigger不能使用。

在這種情況下使用IsVisible財產DataTrigger這樣的:

<Window.Resources> 
    <Style x:Key="AnimationImageStyle" TargetType="{x:Type Image}"> 
     <Style.Triggers> 
      <DataTrigger Binding="{Binding RelativeSource={x:Static RelativeSource.Self}, Path=IsVisible}" 
         Value="True"> 

       <DataTrigger.EnterActions> 
        <BeginStoryboard> 
         <Storyboard> 
          <DoubleAnimation Storyboard.TargetProperty="Opacity" 
              From="1.0" To="0.1" 
              Duration="0:0:0.5" 
              AutoReverse="True" 
              RepeatBehavior="0:0:2" /> 
         </Storyboard> 
        </BeginStoryboard> 
       </DataTrigger.EnterActions> 
      </DataTrigger> 
     </Style.Triggers> 
    </Style> 
</Window.Resources> 

<Grid> 
    <Image Name="TestImage" 
      Style="{StaticResource AnimationImageStyle}" 
      Source="Enter.jpg" 
      Width="400" 
      Height="400" />   
</Grid> 
1

如果要動畫在DependencyProperty或限值,您將需要創建您的圖像Style,並把動畫的風格。

以下Style將執行時,圖像的Visibility設置爲Visible動畫:

<Style x:Key="FlashingImageStyle" TargetType="{x:Type Image}"> 
     <Style.Triggers> 
      <Trigger Property="Visibility" Value="Visible"> 
       <Trigger.EnterActions> 
        <BeginStoryboard> 
         <Storyboard> 
          <DoubleAnimation 
            Storyboard.TargetProperty="Opacity" 
            From="1.0" To="0.1" Duration="0:0:0.5" 
            AutoReverse="True" RepeatBehavior="0:0:2" /> 
         </Storyboard> 
        </BeginStoryboard> 
       </Trigger.EnterActions> 
      </Trigger> 
     </Style.Triggers> 
    </Style>