鼠标悬停时突出显示wpf按钮的边距

时间:2014-04-29 12:22:06

标签: c# wpf xaml triggers

我是WPF的新手,我的问题很小。我有一个带XAML的按钮:

<Button  FontSize="17" Margin="15" Background="White" 
         BorderThickness="0" BorderBrush="#f6f6f6"
         FontWeight="DemiBold"
                   fluent:KeyTip.Keys="X"
                   CommandParameter="{Binding}"                                                               
                   Click="OnLoadPluginClick">                                                
    <Button.Effect>
        <DropShadowEffect Opacity="0.15"/>
    </Button.Effect>                                                
    <Button.Template>
        <ControlTemplate TargetType="{x:Type Button}">
            <Border Name="Border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="1"
                    Grid.Row="0" Margin="5,10,0,0"  Height="180" Width="180" VerticalAlignment="Top" 
                    Background="{TemplateBinding Background}"
                   HorizontalAlignment="Left" >
                <Grid Height="180" Width="180" >
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"></RowDefinition>
                        <RowDefinition Height="*"></RowDefinition>
                    </Grid.RowDefinitions>
                    <TextBlock Grid.Row="0" Margin="10,10,0,0" FontSize="15" FontStretch="ExtraCondensed" Height="20" VerticalAlignment="Top"
                   HorizontalAlignment="Left" Text="{Binding Name}" />
                    <Image Stretch="Uniform" Width="70" Height="70" Grid.Row="1" HorizontalAlignment="Center" 
               VerticalAlignment="Center" Source="{Binding ImageSource}" />
                </Grid>
            </Border>

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

                </Trigger>                                                            
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="Effect">
                        <Setter.Value>
                            <DropShadowEffect ShadowDepth="0" Color="WhiteSmoke" Opacity="0.6" BlurRadius="20"/>
                        </Setter.Value>
                    </Setter>
                    <!--<Setter TargetName="Border" Property="Background" Value="LightGreen"></Setter>-->
                </Trigger>                                                            
            </ControlTemplate.Triggers>
        </ControlTemplate>
    </Button.Template>
</Button>

正如你所看到的,我有自己的触发器,但我不能想要的外观(鼠标在按钮上时的阴影)。我得到这样的东西:

WrongMarginHighlight

正如你所看到的,我只有我的边缘突出了灰色的灰色......

我需要的是:当鼠标位于按钮边框上时,边框会变得更大阴影,当按下边框时,它的背景设置为WhiteSmoke

这样的东西,但有图像: cancelButton

如何正确实现此按钮?

我会感激任何帮助。

1 个答案:

答案 0 :(得分:0)

在IsMouseOver Trigger的setter标签中设置TargetName = Border。它可能有用......

相关问题