2017-09-22 124 views
0

我已經爲我的圖像控制下面的故事板,但是,運行這段代碼時,最後一個圖像不會被顯示:WPF動畫不能正常工作

<Image Height="15" Width="137" RenderTransformOrigin="0.415,4.583" Canvas.Left="104" Canvas.Top="13"> 

    <Image.Style> 
     <Style> 
      <Style.Triggers> 
       <DataTrigger Binding="{Binding State, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" Value="Reconnect"> 
        <DataTrigger.EnterActions>     
         <BeginStoryboard Name="reconnectStoryBoardImageChange" > 
          <Storyboard> 
           <ObjectAnimationUsingKeyFrames 
              BeginTime="00:00:00" RepeatBehavior="Forever" 
              Storyboard.TargetProperty="(Image.Source)"> 
            <DiscreteObjectKeyFrame KeyTime="00:00:01"> 
             <DiscreteObjectKeyFrame.Value> 
              <BitmapImage UriSource="Images/State/Reconnect.png" /> 
             </DiscreteObjectKeyFrame.Value> 
            </DiscreteObjectKeyFrame> 
            <DiscreteObjectKeyFrame KeyTime="00:00:02"> 
             <DiscreteObjectKeyFrame.Value> 
              <BitmapImage UriSource="Images/State/Reconnect_2.png" /> 
             </DiscreteObjectKeyFrame.Value> 
            </DiscreteObjectKeyFrame> 
            <DiscreteObjectKeyFrame KeyTime="00:00:03"> 
             <DiscreteObjectKeyFrame.Value> 
              <BitmapImage UriSource="Images/State/Reconnect_3.png" /> 
             </DiscreteObjectKeyFrame.Value> 
            </DiscreteObjectKeyFrame> 
            <DiscreteObjectKeyFrame KeyTime="00:00:04"> 
             <DiscreteObjectKeyFrame.Value> 
              <BitmapImage UriSource="Images/State/Reconnect_4.png" /> 
             </DiscreteObjectKeyFrame.Value> 
            </DiscreteObjectKeyFrame> 
           </ObjectAnimationUsingKeyFrames> 
          </Storyboard> 
         </BeginStoryboard> 
        </DataTrigger.EnterActions> 
        <DataTrigger.ExitActions>      
         <StopStoryboard BeginStoryboardName="reconnectStoryBoardImageChange"/> 
        </DataTrigger.ExitActions> 
       </DataTrigger> 
      </Style.Triggers> 
     </Style> 
    </Image.Style> 
</Image> 

這是什麼XAML做它在顯示不同的圖像不同的時間,但從不顯示reconnect_4,直到_3然後回到第一個圖像。

我做錯了什麼?

回答

0

你可以找到解釋爲什麼它不按你期望的方式工作here

如果動畫的持續時間是自動的或其持續時間等於最後一個關鍵幀的時間 ,則動畫結束。否則,如果動畫的持續時間大於最後一個關鍵幀 的關鍵時間,則動畫將保留關鍵幀值,直到達到其持續時間的末尾 。

因此,您應該指定StoryboardDuration。我會這樣做:

<Style.Triggers> 
    <DataTrigger Binding="{Binding State, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" Value="Reconnect"> 
     <DataTrigger.EnterActions> 
      <BeginStoryboard Name="reconnectStoryBoardImageChange" > 
       <Storyboard> 
        <ObjectAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:04" RepeatBehavior="Forever" Storyboard.TargetProperty="(Image.Source)"> 
         <DiscreteObjectKeyFrame KeyTime="00:00:00"> 
          <DiscreteObjectKeyFrame.Value> 
           <BitmapImage UriSource="Images/State/Reconnect.png" /> 
          </DiscreteObjectKeyFrame.Value> 
         </DiscreteObjectKeyFrame> 
         <DiscreteObjectKeyFrame KeyTime="00:00:01"> 
          <DiscreteObjectKeyFrame.Value> 
           <BitmapImage UriSource="Images/State/Reconnect_2.png" /> 
          </DiscreteObjectKeyFrame.Value> 
         </DiscreteObjectKeyFrame> 
         <DiscreteObjectKeyFrame KeyTime="00:00:02"> 
          <DiscreteObjectKeyFrame.Value> 
           <BitmapImage UriSource="Images/State/Reconnect_3.png" /> 
          </DiscreteObjectKeyFrame.Value> 
         </DiscreteObjectKeyFrame> 
         <DiscreteObjectKeyFrame KeyTime="00:00:03"> 
          <DiscreteObjectKeyFrame.Value> 
           <BitmapImage UriSource="Images/State/Reconnect_4.png" /> 
          </DiscreteObjectKeyFrame.Value> 
         </DiscreteObjectKeyFrame> 
        </ObjectAnimationUsingKeyFrames> 
       </Storyboard> 
      </BeginStoryboard> 
     </DataTrigger.EnterActions> 
     <DataTrigger.ExitActions> 
      <StopStoryboard BeginStoryboardName="reconnectStoryBoardImageChange"/> 
     </DataTrigger.ExitActions> 
    </DataTrigger> 
</Style.Triggers> 

我指定4秒作爲Duration。第一張圖像從00:00:00到00:00:01顯示。第二張圖像從00:00:01至00:00:02顯示。第三張圖像從00:00:02到00:00:03顯示。第四張圖像從00:00:03到00:00:04顯示。然後它重新啓動。

在你的情況下,最後一個關鍵幀持續0秒,因爲你的故事板過早結束。