Question

我有一个自定义消息框，其中包含两个按钮“是”和“否”。按钮“是”为绿色，按钮“否”为红色。

我通过单独定义的xaml文件对两个按钮应用相同的样式，如下所示：

MsgBoxButtonStyle.xaml ：

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

    <Style TargetType="Button" 

x:Key="MsgBoxButtonStyle">
        <Setter Property="Background" 

        Value="Transparent" />
        <Setter Property="TextBlock.TextAlignment" 

        Value="Center" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Button">
                    <Border  Name="Border" CornerRadius="0"  

                    BorderBrush="#000" BorderThickness="1,1,1,1" 

                    Background="{TemplateBinding Background}">
                        <ContentPresenter x:Name="contentPresenter" 

                        ContentTemplate="{TemplateBinding ContentTemplate}" 

                        Content="{TemplateBinding Content}" 

                        HorizontalAlignment="{TemplateBinding HorizontalAlignment}" 

                        Margin="{TemplateBinding Padding}" 

                        VerticalAlignment="{TemplateBinding VerticalAlignment}" />
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

</ResourceDictionary>

这两个按钮位于我的WPF窗口中，如下所示：

<Window x:Class="My.XAML.Controls.Windows.WpfMessageBox"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation">

    <Window.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary  Source="/My.XAML;component/Styles/MsgBoxButtonStyle.xaml" />
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Window.Resources> 

   <Button Name="btnYes" Content="Yes"                             
            Click="Button_Click" Foreground="Black" 
            Style="{StaticResource MsgBoxButtonStyle}"    
            Background="#b6dbd6" 
            VerticalAlignment="Center" HorizontalAlignment="Stretch"  
            VerticalContentAlignment="Center" HorizontalContentAlignment="Center"/>

    <Button Name="btnNo" Content="No"                             
            Click="Button_Click" Foreground="Black" 
            Style="{StaticResource MsgBoxButtonStyle}"
            Background="#dbb6b6" 
            VerticalAlignment="Center" HorizontalAlignment="Stretch"  
            VerticalContentAlignment="Center" HorizontalContentAlignment="Center" />
</Window>

现在，当鼠标位于按钮上时，我想要执行一个很好的效果，某种闪烁或任何使用故事板并依赖于按钮的颜色。

另外，我想将这个故事板放在我现有的样式文件MsgBoxButtonStyle.xaml中，并且不在每个按钮的窗口中放置每个故事板，我想分享它。

我该怎么做？有人可以为按钮提供很好的效果吗？

Answer 1

只需在样式中添加触发器即可。这是一个让你开始的例子。

 <Style.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Trigger.EnterActions>
                    <BeginStoryboard>
                        <Storyboard>
                            <ThicknessAnimation Duration="0:0:0.250" To="0" 
                                                            Storyboard.TargetProperty="BorderThickness" />
                            <DoubleAnimation Duration="0:0:0.550" To="120" 
                                                            Storyboard.TargetProperty="Height" />
                            <DoubleAnimation Duration="0:0:0.550" To="120" 
                                                            Storyboard.TargetProperty="Width" />
                        </Storyboard>
                    </BeginStoryboard>
                </Trigger.EnterActions>
                <Trigger.ExitActions>
                    <BeginStoryboard>
                        <Storyboard>
                            <ThicknessAnimation Duration="0:0:0.250" To="0" 
                                                            Storyboard.TargetProperty="BorderThickness" />
                            <DoubleAnimation Duration="0:0:0.550" To="100" 
                                                            Storyboard.TargetProperty="Height" />
                            <DoubleAnimation Duration="0:0:0.550" To="100" 
                                                            Storyboard.TargetProperty="Width" />
                        </Storyboard>
                    </BeginStoryboard>
                </Trigger.ExitActions>
            </Trigger>
        </Style.Triggers>

WPF XAML鼠标悬停时动画/闪烁按钮

1 个答案: