WPF MouseUp EventTrigger on Button 未设置 BorderBrush & BorderThick



我有一个重置按钮-期望的行为是在鼠标悬停时增加大小,一旦点击,它周围有一个边框。

IsMouseOver触发器工作,但我不能让MouseUp事件触发器工作(一旦按下按钮不显示边框)。

我已经试过了:

1)添加事件触发器到控件模板触发器

2)添加事件触发器到样式触发器

3)为按钮触发器添加事件触发器

我是否错误地编写了事件触发器?我已经为下面的三次尝试添加了代码-希望我只是错过了一些明显的东西,并且是一个快速修复。谢谢!

1 -添加事件触发器到控件模板触发器

    <Button x:Name="ResetButton"
                    Margin="0,0,20,0"
                    HorizontalAlignment="Right"
                    VerticalAlignment="Center"
                    Command="{Binding Path=DoClearCmd}"
                    ToolTip="Reset all search criteria.">
                <StackPanel HorizontalAlignment="Right" Orientation="Horizontal">
                      <TextBlock HorizontalAlignment="Center"
                                 VerticalAlignment="Center"
                                 FontSize="16"
                                 Foreground="White"
                                 Text=" Reset" />
                       <Image Width="16"
                              Height="16"
                              Margin="2,0,0,0"
                              HorizontalAlignment="Center"
                              VerticalAlignment="Center"                                          Source="..ResourcesDelete_16x16.png" />
                            </StackPanel>
                            <Button.Style>
                                <Style TargetType="{x:Type Button}">
                                    <Setter Property="dx:ThemeManager.ThemeName" Value="None" />
                                    <Setter Property="SnapsToDevicePixels" Value="true" />
                                    <Setter Property="OverridesDefaultStyle" Value="true" />
                                    <Setter Property="FocusVisualStyle" Value="{x:Null}" />
                                    <Setter Property="MinHeight" Value="25" />
                                    <Setter Property="MinWidth" Value="25" />
                                    <Setter Property="BorderBrush" Value="Transparent" />
                                    <Setter Property="BorderThickness" Value="0" />
                                    <Setter Property="RenderTransform">
                                        <Setter.Value>
                                            <ScaleTransform ScaleX="1" ScaleY="1" />
                                        </Setter.Value>
                                    </Setter>
                                    <Setter Property="Template">
                                        <Setter.Value>
                                            <ControlTemplate TargetType="Button">
                                                <Border x:Name="Border">
                                                    <ContentPresenter Margin="2"
                                                                      HorizontalAlignment="Center"
                                                                      VerticalAlignment="Center"
                                                                      RecognizesAccessKey="True" />
                                                </Border>
                                                <ControlTemplate.Triggers>
                                                    <EventTrigger RoutedEvent="MouseUp">
                                                        <BeginStoryboard>
                                                            <Storyboard RepeatBehavior="Forever">
                                                                <ColorAnimation Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)" To="Tomato" />
                                                                <DoubleAnimation Storyboard.TargetProperty="BorderThickness" To="2" />
                                                            </Storyboard>
                                                        </BeginStoryboard>
                                                    </EventTrigger>
                                                    <Trigger Property="IsMouseOver" Value="True">
                                                        <Trigger.EnterActions>
                                                            <BeginStoryboard>
                                                                <Storyboard>
                                                                    <DoubleAnimation Duration="0:0:0.2"
                                                                                     Storyboard.TargetProperty="RenderTransform.ScaleX"
                                                                                     To="1.05" />
                                                                    <DoubleAnimation Duration="0:0:0.2"
                                                                                     Storyboard.TargetProperty="RenderTransform.ScaleY"
                                                                                     To="1.05" />
                                                                </Storyboard>
                                                            </BeginStoryboard>
                                                        </Trigger.EnterActions>
                                                        <Trigger.ExitActions>
                                                            <BeginStoryboard>
                                                                <Storyboard>
                                                                    <DoubleAnimation Duration="0:0:0.2"
                                                                                     Storyboard.TargetProperty="RenderTransform.ScaleX"
                                                                                     To="1" />
                                                                    <DoubleAnimation Duration="0:0:0.2"
                                                                                     Storyboard.TargetProperty="RenderTransform.ScaleY"
                                                                                     To="1" />
                                                                </Storyboard>
                                                            </BeginStoryboard>
                                                        </Trigger.ExitActions>
                                                    </Trigger>
                                                </ControlTemplate.Triggers>
                                            </ControlTemplate>
                                        </Setter.Value>
                                    </Setter>
                                </Style>
                            </Button.Style>
                        </Button>

2 -添加一个事件触发器到样式触发器

      <Button x:Name="ResetButton"
                                Margin="0,0,20,0"
                                HorizontalAlignment="Right"
                                VerticalAlignment="Center"
                                Command="{Binding Path=DoClearCmd}"
                                ToolTip="Reset all search criteria.">
                            <StackPanel HorizontalAlignment="Right" Orientation="Horizontal">
                                <TextBlock HorizontalAlignment="Center"
                                           VerticalAlignment="Center"
                                           FontSize="16"
                                           Foreground="White"
                                           Text=" Reset" />
                                <Image Width="16"
                                       Height="16"
                                       Margin="2,0,0,0"
                                       HorizontalAlignment="Center"
                                       VerticalAlignment="Center"
                                       Source="..ResourcesDelete_16x16.png" />
                            </StackPanel>
                            <Button.Style>
                                <Style TargetType="{x:Type Button}">
                                    <Setter Property="dx:ThemeManager.ThemeName" Value="None" />
                                    <Setter Property="SnapsToDevicePixels" Value="true" />
                                    <Setter Property="OverridesDefaultStyle" Value="true" />
                                    <Setter Property="FocusVisualStyle" Value="{x:Null}" />
                                    <Setter Property="MinHeight" Value="25" />
                                    <Setter Property="MinWidth" Value="25" />
                                    <Setter Property="BorderBrush" Value="Transparent" />
                                    <Setter Property="BorderThickness" Value="0" />
                                    <Setter Property="RenderTransform">
                                        <Setter.Value>
                                            <ScaleTransform ScaleX="1" ScaleY="1" />
                                        </Setter.Value>
                                    </Setter>
                                    <Setter Property="Template">
                                        <Setter.Value>
                                            <ControlTemplate TargetType="Button">
                                                <Border x:Name="Border">
                                                    <ContentPresenter Margin="2"
                                                                      HorizontalAlignment="Center"
                                                                      VerticalAlignment="Center"
                                                                      RecognizesAccessKey="True" />
                                                </Border>
                                                <ControlTemplate.Triggers>                                                      
                                                    <Trigger Property="IsMouseOver" Value="True">
                                                        <Trigger.EnterActions>
                                                            <BeginStoryboard>
                                                                <Storyboard>
                                                                    <DoubleAnimation Duration="0:0:0.2"
                                                                                     Storyboard.TargetProperty="RenderTransform.ScaleX"
                                                                                     To="1.05" />
                                                                    <DoubleAnimation Duration="0:0:0.2"
                                                                                     Storyboard.TargetProperty="RenderTransform.ScaleY"
                                                                                     To="1.05" />
                                                                </Storyboard>
                                                            </BeginStoryboard>
                                                        </Trigger.EnterActions>
                                                        <Trigger.ExitActions>
                                                            <BeginStoryboard>
                                                                <Storyboard>
                                                                    <DoubleAnimation Duration="0:0:0.2"
                                                                                     Storyboard.TargetProperty="RenderTransform.ScaleX"
                                                                                     To="1" />
                                                                    <DoubleAnimation Duration="0:0:0.2"
                                                                                     Storyboard.TargetProperty="RenderTransform.ScaleY"
                                                                                     To="1" />
                                                                </Storyboard>
                                                            </BeginStoryboard>
                                                        </Trigger.ExitActions>
                                                    </Trigger>
                                                </ControlTemplate.Triggers>
                                            </ControlTemplate>
                                        </Setter.Value>
                                    </Setter>
                                    <Style.Triggers>
                                        <EventTrigger RoutedEvent="MouseUp">
                                            <BeginStoryboard>
                                                <Storyboard RepeatBehavior="Forever">
                                                    <ColorAnimation Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)" To="Tomato" />
                                                    <DoubleAnimation Storyboard.TargetProperty="BorderThickness" To="2" />
                                                </Storyboard>
                                            </BeginStoryboard>
                                        </EventTrigger>
                                    </Style.Triggers>
                                </Style>                                    
                            </Button.Style>
                        </Button>

3 -为按钮触发器添加事件触发器

    <Button x:Name="ResetButton"
                                Margin="0,0,20,0"
                                HorizontalAlignment="Right"
                                VerticalAlignment="Center"
                                Command="{Binding Path=DoClearCmd}"
                                ToolTip="Reset all search criteria.">
                            <StackPanel HorizontalAlignment="Right" Orientation="Horizontal">
                                <TextBlock HorizontalAlignment="Center"
                                           VerticalAlignment="Center"
                                           FontSize="16"
                                           Foreground="White"
                                           Text=" Reset" />
                                <Image Width="16"
                                       Height="16"
                                       Margin="2,0,0,0"
                                       HorizontalAlignment="Center"
                                       VerticalAlignment="Center"
                                       Source="..ResourcesDelete_16x16.png" />
                            </StackPanel>
                            <Button.Style>
                                <Style TargetType="{x:Type Button}">
                                    <Setter Property="dx:ThemeManager.ThemeName" Value="None" />
                                    <Setter Property="SnapsToDevicePixels" Value="true" />
                                    <Setter Property="OverridesDefaultStyle" Value="true" />
                                    <Setter Property="FocusVisualStyle" Value="{x:Null}" />
                                    <Setter Property="MinHeight" Value="25" />
                                    <Setter Property="MinWidth" Value="25" />
                                    <Setter Property="BorderBrush" Value="Transparent" />
                                    <Setter Property="BorderThickness" Value="0" />
                                    <Setter Property="RenderTransform">
                                        <Setter.Value>
                                            <ScaleTransform ScaleX="1" ScaleY="1" />
                                        </Setter.Value>
                                    </Setter>
                                    <Setter Property="Template">
                                        <Setter.Value>
                                            <ControlTemplate TargetType="Button">
                                                <Border x:Name="Border">
                                                    <ContentPresenter Margin="2"
                                                                      HorizontalAlignment="Center"
                                                                      VerticalAlignment="Center"
                                                                      RecognizesAccessKey="True" />
                                                </Border>
                                                <ControlTemplate.Triggers>                                                      
                                                    <Trigger Property="IsMouseOver" Value="True">
                                                        <Trigger.EnterActions>
                                                            <BeginStoryboard>
                                                                <Storyboard>
                                                                    <DoubleAnimation Duration="0:0:0.2"
                                                                                     Storyboard.TargetProperty="RenderTransform.ScaleX"
                                                                                     To="1.05" />
                                                                    <DoubleAnimation Duration="0:0:0.2"
                                                                                     Storyboard.TargetProperty="RenderTransform.ScaleY"
                                                                                     To="1.05" />
                                                                </Storyboard>
                                                            </BeginStoryboard>
                                                        </Trigger.EnterActions>
                                                        <Trigger.ExitActions>
                                                            <BeginStoryboard>
                                                                <Storyboard>
                                                                    <DoubleAnimation Duration="0:0:0.2"
                                                                                     Storyboard.TargetProperty="RenderTransform.ScaleX"
                                                                                     To="1" />
                                                                    <DoubleAnimation Duration="0:0:0.2"
                                                                                     Storyboard.TargetProperty="RenderTransform.ScaleY"
                                                                                     To="1" />
                                                                </Storyboard>
                                                            </BeginStoryboard>
                                                        </Trigger.ExitActions>
                                                    </Trigger>
                                                </ControlTemplate.Triggers>
                                            </ControlTemplate>
                                        </Setter.Value>
                                    </Setter>
                                </Style>                                    
                            </Button.Style>
                            <Button.Triggers>
                                <EventTrigger RoutedEvent="Button.MouseUp">
                                    <BeginStoryboard>
                                        <Storyboard RepeatBehavior="Forever">
                                            <ColorAnimation Storyboard.TargetName="ResetButton" Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)" To="Tomato" />
                                            <DoubleAnimation Storyboard.TargetName="ResetButton" Storyboard.TargetProperty="BorderThickness" To="2" />
                                        </Storyboard>
                                    </BeginStoryboard>
                                </EventTrigger>
                            </Button.Triggers>
                        </Button>
  1. 动画厚度,你必须使用ThicknessAnimation
  2. Button不触发MouseLeftButtonUp路由事件。解决方法是使用PreviewMouseLeftButtonUp事件。源
  3. 你必须绑定你的"Border"元素属性BorderBrush和BorderThickness到你的模板。

对于您的第一个案例:

        <Button>
            <Button.Style>
                <Style TargetType="{x:Type Button}">
                    <Setter Property="dx:ThemeManager.ThemeName" Value="None" />
                    <Setter Property="SnapsToDevicePixels" Value="true" />
                    <Setter Property="OverridesDefaultStyle" Value="true" />
                    <Setter Property="FocusVisualStyle" Value="{x:Null}" />
                    <Setter Property="MinHeight" Value="25" />
                    <Setter Property="MinWidth" Value="25" />
                    <Setter Property="BorderBrush" Value="Transparent" />
                    <Setter Property="BorderThickness" Value="0" />
                    <Setter Property="RenderTransform">
                        <Setter.Value>
                            <ScaleTransform ScaleX="1" ScaleY="1" />
                        </Setter.Value>
                    </Setter>
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="Button">
                                <Border x:Name="Border"
                                        BorderThickness="{TemplateBinding BorderThickness}"
                                        BorderBrush="{TemplateBinding BorderBrush}">
                                    <ContentPresenter Margin="2"
                                                                  HorizontalAlignment="Center"
                                                                  VerticalAlignment="Center"
                                                                  RecognizesAccessKey="True" />
                                </Border>
                                <ControlTemplate.Triggers>
                                    <EventTrigger RoutedEvent="MouseUp">
                                        <BeginStoryboard>
                                            <Storyboard Duration="0:0:2" AutoReverse="True" RepeatBehavior="Forever">
                                                <ColorAnimation Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)" To="Tomato" />
                                                <ThicknessAnimation Storyboard.TargetProperty="BorderThickness" To="4" />
                                            </Storyboard>
                                        </BeginStoryboard>
                                    </EventTrigger>
                                    <Trigger Property="IsMouseOver" Value="True">
                                        <Trigger.EnterActions>
                                            <BeginStoryboard>
                                                <Storyboard>
                                                    <DoubleAnimation Duration="0:0:0.2"
                                                                                 Storyboard.TargetProperty="RenderTransform.ScaleX"
                                                                                 To="1.05" />
                                                    <DoubleAnimation Duration="0:0:0.2"
                                                                                 Storyboard.TargetProperty="RenderTransform.ScaleY"
                                                                                 To="1.05" />
                                                </Storyboard>
                                            </BeginStoryboard>
                                        </Trigger.EnterActions>
                                        <Trigger.ExitActions>
                                            <BeginStoryboard>
                                                <Storyboard>
                                                    <DoubleAnimation Duration="0:0:0.2"
                                                                                 Storyboard.TargetProperty="RenderTransform.ScaleX"
                                                                                 To="1" />
                                                    <DoubleAnimation Duration="0:0:0.2"
                                                                                 Storyboard.TargetProperty="RenderTransform.ScaleY"
                                                                                 To="1" />
                                                </Storyboard>
                                            </BeginStoryboard>
                                        </Trigger.ExitActions>
                                    </Trigger>
                                </ControlTemplate.Triggers>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </Button.Style>
        </Button>

注意 MouseUp只在鼠标右键向上时触发

希望能有所帮助

这些方法不起作用的原因是MouseUp事件由按钮使用,而永远不会到达处理程序。这可以通过右击而不是左击来演示,并且上面的代码可以工作(我只测试了第一个示例)。

要解决这个问题,您可以使用使用PreviewMouseUp事件代替。

相关内容

  • 没有找到相关文章

最新更新