【问题标题】:Animation triggers overriding each other in WPF动画触发器在 WPF 中相互覆盖
【发布时间】:2019-01-04 17:20:53
【问题描述】:

我的应用程序中有一个 3x3 的按钮网格。他们使用自己的模板,如下所示。 PushDown 和 PushUp 是前面在 Application.Resources 中定义的静态故事板。

我可以使用三种方法来触发这些动画,这些方法在 DataTriggers 中定义,在模板内具有不同的条件。但是,一旦我使用 IsMouseOver 触发按钮的动画,我就无法再使用 IsPressed 触发它。如果我使用 MultiBinding 条件触发它,我将无法再使用 IsMouseOver 和 IsPressed 触发它。

我计算了这些 (Multi)DataTriggers 影响的声明顺序,它们优先于哪个。我在这里缺少什么概念,如何确保动画情节提要在满足任何条件时始终播放?

Button 模板如下:

<!--Pusher Style-->
 <Style TargetType="Button"
       x:Key='Pusher'>
  <Setter Property='Background'
          Value='Gray' />
  <Setter Property='Foreground'
          Value='White' />
  <Setter Property='FontFamily'
          Value='Calibri' />

  <Setter Property="Template">
    <Setter.Value>
      <ControlTemplate TargetType="Button">

        <Grid>

          <Rectangle x:Name='_bottom'
                     Fill="#FF353535"
                     RadiusX="20"
                     RadiusY="20"
                     Margin='0,2,0,0' />

          <Border x:Name='_top'
                  Margin='0,0,0,10'>
            <Grid>
              <Rectangle x:Name='_color'
                         Fill="{TemplateBinding Background}"
                         RadiusX="20"
                         RadiusY="20" />
              <ContentPresenter ContentTemplate="{TemplateBinding ContentTemplate}"
                                Content="{TemplateBinding Content}"
                                HorizontalAlignment="Center"
                                VerticalAlignment="Center" />
            </Grid>
          </Border>
        </Grid>

        <ControlTemplate.Triggers>
          <!--Press down animation-->
          <MultiDataTrigger>
            <MultiDataTrigger.Conditions>
              <Condition Binding='{Binding RelativeSource={RelativeSource Self}, Path=IsPressed}'
                         Value='True' />
              <Condition Binding='{Binding IsHover}'
                         Value='False' />
            </MultiDataTrigger.Conditions>
            <MultiDataTrigger.EnterActions>
              <BeginStoryboard Storyboard='{StaticResource PushDown}' />
            </MultiDataTrigger.EnterActions>
            <MultiDataTrigger.ExitActions>
              <BeginStoryboard Storyboard='{StaticResource PushUp}' />
            </MultiDataTrigger.ExitActions>
          </MultiDataTrigger>

          <!--Conditional press down animation on hover-->
          <MultiDataTrigger>
            <MultiDataTrigger.Conditions>
              <Condition Binding='{Binding RelativeSource={RelativeSource Self}, Path=IsMouseOver}'
                         Value='True' />
              <Condition Binding='{Binding IsHover}'
                         Value='True' />
            </MultiDataTrigger.Conditions>
            <MultiDataTrigger.EnterActions>
              <BeginStoryboard Storyboard='{StaticResource PushDown}' />
            </MultiDataTrigger.EnterActions>
            <MultiDataTrigger.ExitActions>
              <BeginStoryboard Storyboard='{StaticResource PushUp}' />
            </MultiDataTrigger.ExitActions>
          </MultiDataTrigger>

          <!--Keyboard control animation-->
          <DataTrigger Value='True'>
            <DataTrigger.Binding>
              <MultiBinding Converter="{StaticResource CompareKey}">
                <Binding RelativeSource="{RelativeSource self}"
                         Path="Name"
                         Mode="OneWay" />
                <Binding Path='ButtonKey'
                         Mode="OneWay" />
              </MultiBinding>
            </DataTrigger.Binding>
            <DataTrigger.EnterActions>
              <BeginStoryboard Storyboard='{StaticResource PushDown}' />
            </DataTrigger.EnterActions>
            <DataTrigger.ExitActions>
              <BeginStoryboard Storyboard='{StaticResource PushUp}' />
            </DataTrigger.ExitActions>
          </DataTrigger>

          <Trigger Property="IsMouseOver"
                   Value="True">
            <Setter Property="Fill"
                    TargetName="_color"
                    Value="#FFEBCB31" />
          </Trigger>
          <Trigger Property='IsPressed'
                   Value="True">
            <Setter Property="Fill"
                    TargetName="_color"
                    Value="#FFD9AE2C" />
          </Trigger>

        </ControlTemplate.Triggers>
      </ControlTemplate>
    </Setter.Value>
  </Setter>

</Style>

【问题讨论】:

  • 你试过用 MouseEnter/MouseLeave 代替 IsMouseOver 吗?此外,代码示例不完整(缺少动画),因此我们很难测试。

标签: c# wpf xaml datatrigger


【解决方案1】:

解决方案是将所有三个条件组合成一个多重绑定,由它处理它们的逻辑 OR。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2011-10-08
    • 1970-01-01
    • 1970-01-01
    • 2010-12-12
    • 2011-10-04
    • 2017-03-23
    • 1970-01-01
    相关资源
    最近更新 更多