2016-12-02 146 views
1

我有一个边框的WPF样式。它用于按钮。如何在样式中正确设置WPF EventTrigger?

<Style x:Key="RoundCorner" TargetType="{x:Type Button}"> 
    <Setter Property="ClickMode" Value="Press"/> 
    <EventSetter Event="PreviewMouseUp" Handler="RegularButtonRelease"/> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type Button}"> 
       <Grid x:Name="grid"> 
        <Border x:Name="border" CornerRadius="2" BorderBrush="#FF444444" BorderThickness="1"> 
         <Border.Background> 
          <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1.2" > 
           <GradientStop Color="#ffaaaaaa" Offset="0" /> 
           <GradientStop Color="White" Offset="1" /> 
          </LinearGradientBrush>        
         </Border.Background> 
        </Border> 
       </Grid> 
       <ControlTemplate.Triggers> 
        <Trigger Property="IsPressed" Value="True"> 
         <!--some style --> 
        </Trigger> 
        <Trigger Property="IsMouseOver" Value="True"> 
         <!--some style -->         
        </Trigger> 
        <EventTrigger RoutedEvent="PreviewMouseLeftButtonUp"> 
         <BeginStoryboard> 
          <Storyboard Duration="0:0:2" AutoReverse="False"> 
           <ColorAnimation 
            Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)" 
            FillBehavior="Stop" To="Tomato"/> 
          </Storyboard> 
         </BeginStoryboard> 
        </EventTrigger> 
       </ControlTemplate.Triggers> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

我想在给定的时间内设置边框背景颜色为不同的,当我释放鼠标点击按钮。 (例如按下按钮时是黑色的,当我释放时,它变为红色,然后变回白色)

使用上面的代码,我可以看到按钮颜色在释放鼠标按钮后不断变化,而我的事件处理程序RegularButtonRelease也被连续发射。 很快,应用程序挂起,并给我一个例外的System.StackOverflowException

如果我在风格上带走了EventTrigger,我的应用程序正确执行,所以我的EventTrigger必须是错误的。

我的问题是,我怎么能正确设置背景颜色变化在鼠标按钮(使用EventTrigger或其他)?

UPDATE:

我尝试设置边框和背景,同时使用:

<ColorAnimation 
    Duration="0:0:0.8" 
    Storyboard.TargetName="border" 
    Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)" 
    To="Red"/> 
<ColorAnimation 
    Duration="0:0:0.8" 
    Storyboard.TargetName="border" 
    Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)" 
    To="Red"/> 

这一次的边界线变为红色,就像一个魅力。但背景仍然存在,没有任何变化。

如何正确更改我的背景?

+0

这行添加到你的'Triggers'标签 - '<触发属性=“IsMouseOver” VALUE =“真”>' –

回答

2

首先,你的错误: 你正在试图改变Background,因为它被设置为LinearGradientBrush这是不可能的Color,其次你还没有设置Storyboard.TargetName可言。

我已经做了一些更改,第一次:将x:Name分配到第二个GradientStop,然后在动画中使用x:Name作为Storyboard.TargetName="C2"

<Style x:Key="RoundCorner" TargetType="{x:Type Button}"> 
     <Setter Property="ClickMode" Value="Press"/> 
     <EventSetter Event="PreviewMouseUp" Handler="RegularButtonRelease"/> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="{x:Type Button}"> 
        <Grid x:Name="grid"> 
         <Border x:Name="border" CornerRadius="2" BorderBrush="#FF444444" BorderThickness="1"> 
          <Border.Background> 
           <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1.2" > 
            <GradientStop Color="#ffaaaaaa" Offset="0" /> 
            <GradientStop x:Name="C2" Color="White" Offset="1" /> 
           </LinearGradientBrush> 
          </Border.Background> 
         </Border> 
        </Grid> 
        <ControlTemplate.Triggers> 
         <Trigger Property="IsPressed" Value="True"> 
          <!--some style --> 
         </Trigger> 
         <Trigger Property="IsMouseOver" Value="True"> 
          <!--some style --> 
         </Trigger> 
         <EventTrigger RoutedEvent="PreviewMouseLeftButtonUp"> 
          <BeginStoryboard> 
           <Storyboard Duration="0:0:1" AutoReverse="False"> 
            <ColorAnimation Storyboard.TargetName="C2" 
             Storyboard.TargetProperty="Color" 
             FillBehavior="Stop" To="Red"/> 
           </Storyboard> 
          </BeginStoryboard> 
         </EventTrigger> 
        </ControlTemplate.Triggers> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
+0

谢谢。你的修改效果很好。 – Dia

0

或者试试下面这个例子:

<ControlTemplate.Triggers> 
      <Trigger Property="IsPressed" Value="True"> 
       <Setter Property="Background" TargetName="Background" Value="Red"/> 
      </Trigger> 
     </ControlTemplate.Triggers> 

参考:

Change color of Button when Mouse is over

How do you change Background for a Button MouseOver in WPF?

来到System.StackOverflowException部分,根据MSDN,你可以通过创建太多得到StackOverflowExceptions堆栈中的大对象,它通常是因为你的代码已经存在而发生的进入一种反复调用相同功能链的状态。像递归一样。

+0

感谢评论,但我的风格已经有一个'IsPressed' tragger是改变边界背景。当我释放鼠标时,我想要另一种颜色,持续〜1秒。 – Dia

+0

类似于[Pietu1998答案](http://stackoverflow.com/a/21113588/5588347)中的内容? –

+0

呃,那对我没有帮助。但是现在我可以更改边框线的颜色,只能在更改背景时失败。我编辑了主帖。 – Dia

相关问题