Question

我需要一些帮助，弄清楚如何使按钮脉冲成为背景颜色。我使用下面的样式来创建按钮，并希望在正常状态下按钮背景颜色为脉冲（不同颜色的阴影）。目的是吸引用户注意按钮。

理想情况下，我希望在一段时间不活动后发生这种情况。是否可以在样式中执行此操作，还是需要创建完整的自定义UserControl？如果有可能我会很感激，如果有人可以提供说明如何实现这一目标的示例代码。

我相信应该可以做到以下几点： 1.创建ControlTemplate.Resources部分并添加一个Storyboard，用于定义要使用的动画 1.1故事板的外观如何，以及它与实际按钮背景颜色的关系 1.2如何在故事板的开头添加延迟（因此它只会在一段时间不活动后触发（即没有点击按钮） 2.以某种方式添加触发器以启动故事板。如何为按钮的正常状态做到这一点。

<Style x:Key="ContinueButton" TargetType="{x:Type Button}">
    <Setter Property="HorizontalContentAlignment" Value="Center"/>
    <Setter Property="VerticalContentAlignment" Value="Center"/>
    <Setter Property="Padding" Value="1"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type Button}">
                <Grid x:Name="grid">
                    <Border x:Name="border" CornerRadius="0" BorderBrush="{StaticResource ThemeSolidColorBrushGreen}" BorderThickness="2" Background="{StaticResource ThemeSolidColorBrushGreen}">

                        <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" TextElement.Foreground="White" 
                                          TextElement.FontSize="{Binding Source={StaticResource settingsProvider}, Path=Default.FontSizeParagraph}" TextElement.FontFamily="{Binding Source={StaticResource settingsProvider}, Path=Default.FontFamily}" TextElement.FontWeight="Bold"></ContentPresenter>
                    </Border>
                </Grid>
                <ControlTemplate.Triggers>

                    <Trigger Property="IsPressed" Value="True">
                        <Setter Property="Background" TargetName="border" Value="{StaticResource ThemeSolidColorBrushGreen}">

                        </Setter>
                    </Trigger>
                    <Trigger Property="IsMouseOver" Value="True">

                    </Trigger>
                    <Trigger Property="IsEnabled" Value="False">
                        <Setter Property="Opacity" TargetName="grid" Value="0.25"/>
                    </Trigger>

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

Answer 1

您可以使用EventTrigger来实现此目的。只需使用以下代码替换代码的ControlTemplate.Trigger部分

                          <ControlTemplate.Triggers>
                                <EventTrigger RoutedEvent="Button.MouseEnter">
                                    <BeginStoryboard>
                                        <Storyboard>
                                            <ColorAnimation  Storyboard.TargetName="border" AutoReverse="True"  
                                                             Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)" 
                                                             To="Blue" RepeatBehavior="Forever" Duration="0:0:1"/>
                                        </Storyboard>
                                    </BeginStoryboard>
                                </EventTrigger>
                                <Trigger Property="IsPressed" Value="True">
                                    <Setter Property="Background" TargetName="border" Value="GreenYellow"/>
                                </Trigger>
                                <!--<Trigger Property="IsMouseOver" Value="True">
                                    <Setter Property="Background" TargetName="border" Value="Gray"/>
                                </Trigger>-->
                                <Trigger Property="IsEnabled" Value="False">
                                    <Setter Property="Opacity" TargetName="grid" Value="0.25"/>
                                </Trigger>

                            </ControlTemplate.Triggers>

C＃WPF脉冲按钮

1 个答案: