是什么导致我的动画闪烁

我正在做一个简单的动画，按预期工作，直到我把我的网格放在边框上。只要我这样做，然后当我点击框架时动画闪烁。我正在尝试实现一个“滑入”视图的菜单。我在下面列出了我的代码。它几乎就像我的鼠标点击造成无限的动画循环。是什么导致我的动画闪烁

<Border BorderBrush="YellowGreen" CornerRadius="8" BorderThickness="10" Background="Black"> 
     <Grid MouseLeftButtonDown="DragWindow"> 
      <Grid.Resources> 
        <Style TargetType="Frame" x:Key="GrowingFrameStyle"> 
         <Setter Property="Foreground" Value="#505050"/> 
         <Setter Property="Background" Value="Black" /> 
         <Setter Property="Height" Value="20" /> 
         <Style.Triggers> 
          <Trigger Property="IsMouseOver" Value="True"> 
           <Trigger.EnterActions> 
            <BeginStoryboard> 
             <Storyboard> 
              <ColorAnimation Duration="0:0:0.5" Storyboard.TargetProperty="Foreground.Color" To="LightGray" /> 
              <ColorAnimation Duration="0:0:0.5" Storyboard.TargetProperty="Background.Color" To="SteelBlue" /> 
              <DoubleAnimation Storyboard.TargetProperty="Height" From="20" To="50" Duration="0:0:.3" /> 
             </Storyboard> 
            </BeginStoryboard> 
           </Trigger.EnterActions> 
           <Trigger.ExitActions> 
            <BeginStoryboard> 
             <Storyboard> 
              <ColorAnimation Duration="0:0:0.5" Storyboard.TargetProperty="Foreground.Color" To="#505050" /> 
              <ColorAnimation Duration="0:0:0.5" Storyboard.TargetProperty="Background.Color" To="Black" /> 
              <DoubleAnimation Storyboard.TargetProperty="Height" From="50" To="20" Duration="0:0:.3" /> 
             </Storyboard> 
            </BeginStoryboard> 
           </Trigger.ExitActions> 
          </Trigger> 
         </Style.Triggers> 
        </Style> 
      </Grid.Resources> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="*"/> 
       <ColumnDefinition Width="50"/> 
      </Grid.ColumnDefinitions> 
      <Grid.RowDefinitions> 
       <RowDefinition Height="20"/> 
       <RowDefinition Height="*"/> 
      </Grid.RowDefinitions> 
      <Label Grid.Row="1" Grid.ColumnSpan="2" Background="Black"/> 
      <Frame Grid.RowSpan="2" Grid.ColumnSpan="2" Background="SlateBlue" VerticalAlignment="Top" Style="{StaticResource GrowingFrameStyle}"/>   
     </Grid> 
    </Border>

唯一方法在后面的代码

private void DragWindow(object sender, System.Windows.Input.MouseButtonEventArgs e) 
{ 
    DragMove(); 
}

来源

2012-02-20 poco

我们可能需要看到DragWindow方法 – Phil 2012-02-20 18:33:59

我转载了这个问题。点击是一个IsMouseOver重新开始，但不是没有边界。我不知道为什么。如果您点击前20名，故事板只会运行一次。如果你点击底部的20-50，你会得到一个循环。我不知道答案，他们是我作为评论发布的原因。 – Paparazzi 2012-02-20 19:10:58

我认为答案是在事件冒泡的地方。如果在边界上打开IsHitVisable = false，则不会发生任何事情。我不知道答案，但它表明边界是偶数序列。 – Paparazzi 2012-02-20 19:16:53

它通过点击Frame的扩展区域造成的。

MouseUp事件似乎正在触发MouseLeave/MouseEnter事件。 MouseLeave正在触发动画以缩小框架，该框架排队收缩故事板事件，并且MouseEnter正在对动画进行排队以扩展框架，该框架排队展开故事板事件。通过缩小/扩大帧，MouseEnter/MouseLeave会再次被触发，并且动画再次运行。这两个继续发射，直到你将鼠标移出仅在帧展开时占据的魔法区域。

可以通过添加BeginTime="00:00:02"到您的故事板，可以添加2秒的延迟查看慢动作的延迟，并且可以通过将其在MouseEnter写入一行输出的方法验证MouseEnter/MouseLeave事件/ MouseLeave帧的事件。

至于修复它，我不确定最好的方法来做到这一点。也许尝试使用MouseEnter/MouseLeave事件在1秒延迟后手动触发事件，提供事件仍应该处理。

例如，如果MouseUp事件触发MouseLeave和MouseEnter事件，那么MouseLeave应该排队合拢动画，但拖延一秒钟，检查是否鼠标实际上是在对象上一秒钟后。如果不是，请取消折叠事件。这将导致MouseLeave事件不激发其动画，这意味着它不会无限地排列动画，直到鼠标移出扩展的Frame区域。

来源

2012-02-20 19:20:04 Rachel

是什么导致我的动画闪烁

回答

相关问题