blocks|key|75871|text|要删除Button上的默认MouseOver行为，您需要修改ControlTemplate。将您的Style定义更改为以下内容应该可以解决此问题：|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|75872|<Style+TargetType="{x:Type+Button}">
++++<Setter+Property="Background"+Value="Green"/>
++++<Setter+Property="Template">
++++++++<Setter.Value>
++++++++++++<ControlTemplate+TargetType="{x:Type+Button}">
++++++++++++++++<Border+Background="{TemplateBinding+Background}"+BorderBrush="Black"+BorderThickness="1">
++++++++++++++++++++<ContentPresenter+HorizontalAlignment="Center"+VerticalAlignment="Center"/>
++++++++++++++++</Border>
++++++++++++</ControlTemplate>
++++++++</Setter.Value>
++++</Setter>
++++<Style.Triggers>
++++++++<Trigger+Property="IsMouseOver"+Value="True">
++++++++++++<Setter+Property="Background"+Value="Red"/>
++++++++</Trigger>
++++</Style.Triggers>
</Style>|code-block|syntax|javascript|75873|编辑:虽然晚了几年，但实际上你可以在边框内设置边框画笔。如果有人指出了这一点，但它看起来不像是...|75874|entityMap^0|3|6|D|9|U|F|1D|5|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@$9|P|A|Q|B|C]|$9|R|A|S|B|C]|$9|T|A|U|B|C]|$9|V|A|W|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|X|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|Y|8|@]|D|@]|E|$]]|$1|M|3|-4|5|6|7|Z|8|@]|D|@]|E|$]]]|N|$]]

<p>To remove the default <code>MouseOver</code> behaviour on the <code>Button</code> you will need to modify the <code>ControlTemplate</code>. Changing your <code>Style</code> definition to the following should do the trick:</p>

<pre><code>&lt;Style TargetType="{x:Type Button}"&gt;
    &lt;Setter Property="Background" Value="Green"/&gt;
    &lt;Setter Property="Template"&gt;
        &lt;Setter.Value&gt;
            &lt;ControlTemplate TargetType="{x:Type Button}"&gt;
                &lt;Border Background="{TemplateBinding Background}" BorderBrush="Black" BorderThickness="1"&gt;
                    &lt;ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/&gt;
                &lt;/Border&gt;
            &lt;/ControlTemplate&gt;
        &lt;/Setter.Value&gt;
    &lt;/Setter&gt;
    &lt;Style.Triggers&gt;
        &lt;Trigger Property="IsMouseOver" Value="True"&gt;
            &lt;Setter Property="Background" Value="Red"/&gt;
        &lt;/Trigger&gt;
    &lt;/Style.Triggers&gt;
&lt;/Style&gt;
</code></pre>

<p>EDIT: It's a few years late, but you are actually able to set the border brush inside of the border that is in there. Idk if that was pointed out but it doesn't seem like it was...</p>


blocks|key|75910|text|一个稍微困难一点的答案，使用ControlTemplate并具有动画效果(改编自https://docs.microsoft.com/en-us/dotnet/framework/wpf/controls/customizing-the-appearance-of-an-existing-control)|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|75911|在资源字典中，为按钮定义一个控件模板，如下所示：|75912|<ControlTemplate+TargetType="Button"+x:Key="testButtonTemplate2">
++++<Border+Name="RootElement">
++++++++<Border.Background>
++++++++++++<SolidColorBrush+x:Name="BorderBrush"+Color="Black"/>
++++++++</Border.Background>

++++++++<Grid+Margin="4"+>
++++++++++++<Grid.Background>
++++++++++++++++<SolidColorBrush+x:Name="ButtonBackground"+Color="Aquamarine"/>
++++++++++++</Grid.Background>
++++++++++++<ContentPresenter+HorizontalAlignment="{TemplateBinding+HorizontalContentAlignment}"+VerticalAlignment="{TemplateBinding+VerticalContentAlignment}"+Margin="4,5,4,4"/>
++++++++</Grid>
++++++++<VisualStateManager.VisualStateGroups>
++++++++++++<VisualStateGroup+x:Name="CommonStates">
++++++++++++++++<VisualState+x:Name="Normal"/>
++++++++++++++++<VisualState+x:Name="MouseOver">
++++++++++++++++++++<Storyboard>
++++++++++++++++++++++++<ColorAnimation+Storyboard.TargetName="ButtonBackground"+Storyboard.TargetProperty="Color"+To="Red"/>
++++++++++++++++++++</Storyboard>
++++++++++++++++</VisualState>
++++++++++++++++<VisualState+x:Name="Pressed">
++++++++++++++++++++<Storyboard>
++++++++++++++++++++++++<ColorAnimation+Storyboard.TargetName="ButtonBackground"+Storyboard.TargetProperty="Color"+To="Red"/>
++++++++++++++++++++</Storyboard>
++++++++++++++++</VisualState>
++++++++++++</VisualStateGroup>
++++++++</VisualStateManager.VisualStateGroups>
++++</Border>
</ControlTemplate>|code-block|syntax|javascript|75913|在XAML中，您可以为按钮使用上面的模板，如下所示：|75914|定义你的按钮|75915|<Button+Template="{StaticResource+testButtonTemplate2}"+
HorizontalAlignment="Center"+VerticalAlignment="Center"+
Foreground="White">My+button</Button>|75916|希望能有所帮助|75917|entityMap|0|LINK|mutability|MUTABLE|url|https://docs.microsoft.com/en-us/dotnet/framework/wpf/controls/customizing-the-appearance-of-an-existing-control^0|14|34|0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|10|8|@]|9|@$A|11|B|12|1|13]]|C|$]]|$1|D|3|E|5|6|7|14|8|@]|9|@]|C|$]]|$1|F|3|G|5|H|7|15|8|@]|9|@]|C|$I|J]]|$1|K|3|L|5|6|7|16|8|@]|9|@]|C|$]]|$1|M|3|N|5|6|7|17|8|@]|9|@]|C|$]]|$1|O|3|P|5|H|7|18|8|@]|9|@]|C|$I|J]]|$1|Q|3|R|5|6|7|19|8|@]|9|@]|C|$]]|$1|S|3|-4|5|6|7|1A|8|@]|9|@]|C|$]]]|T|$U|$5|V|W|X|C|$Y|Z]]]]

<p>A slight more difficult answer that uses ControlTemplate and has an animation effect
(adapted from <a href="https://docs.microsoft.com/en-us/dotnet/framework/wpf/controls/customizing-the-appearance-of-an-existing-control" rel="nofollow noreferrer">https://docs.microsoft.com/en-us/dotnet/framework/wpf/controls/customizing-the-appearance-of-an-existing-control</a>)</p>

<p>In your resource dictionary define a control template for your button like this one:</p>

<pre><code>&lt;ControlTemplate TargetType="Button" x:Key="testButtonTemplate2"&gt;
    &lt;Border Name="RootElement"&gt;
        &lt;Border.Background&gt;
            &lt;SolidColorBrush x:Name="BorderBrush" Color="Black"/&gt;
        &lt;/Border.Background&gt;

        &lt;Grid Margin="4" &gt;
            &lt;Grid.Background&gt;
                &lt;SolidColorBrush x:Name="ButtonBackground" Color="Aquamarine"/&gt;
            &lt;/Grid.Background&gt;
            &lt;ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Margin="4,5,4,4"/&gt;
        &lt;/Grid&gt;
        &lt;VisualStateManager.VisualStateGroups&gt;
            &lt;VisualStateGroup x:Name="CommonStates"&gt;
                &lt;VisualState x:Name="Normal"/&gt;
                &lt;VisualState x:Name="MouseOver"&gt;
                    &lt;Storyboard&gt;
                        &lt;ColorAnimation Storyboard.TargetName="ButtonBackground" Storyboard.TargetProperty="Color" To="Red"/&gt;
                    &lt;/Storyboard&gt;
                &lt;/VisualState&gt;
                &lt;VisualState x:Name="Pressed"&gt;
                    &lt;Storyboard&gt;
                        &lt;ColorAnimation Storyboard.TargetName="ButtonBackground" Storyboard.TargetProperty="Color" To="Red"/&gt;
                    &lt;/Storyboard&gt;
                &lt;/VisualState&gt;
            &lt;/VisualStateGroup&gt;
        &lt;/VisualStateManager.VisualStateGroups&gt;
    &lt;/Border&gt;
&lt;/ControlTemplate&gt;
</code></pre>

<p>in your XAML you can use the template above for your button as below:</p>

<p>Define your button</p>

<pre><code>&lt;Button Template="{StaticResource testButtonTemplate2}" 
HorizontalAlignment="Center" VerticalAlignment="Center" 
Foreground="White"&gt;My button&lt;/Button&gt;
</code></pre>

<p>Hope it helps</p>


blocks|key|293158|text|用于更改按钮样式|type|unstyled|depth|inlineStyleRanges|entityRanges|data|293159|第一步:定义资源样式|293160|<Window.Resources>

++++<Style+x:Key="OvergroundIn"+TargetType="Button">

++++++++<Setter+Property="Template">
++++++++++++<Setter.Value>
++++++++++++++++<ControlTemplate+TargetType="Button">
++++++++++++++++++++<Grid+Background="#FF16832F">
++++++++++++++++++++++++<ContentPresenter+TextBlock.Foreground="White"+TextBlock.TextAlignment="Center"+Margin="0,8,0,0"+></ContentPresenter>
++++++++++++++++++++</Grid>
++++++++++++++++</ControlTemplate>
++++++++++++</Setter.Value>
++++++++</Setter>

++++++++<Style.Triggers>
++++++++++++<Trigger+Property="IsMouseOver"+Value="True">

++++++++++++++++<Setter+Property="Template">
++++++++++++++++++++<Setter.Value>
++++++++++++++++++++++++<ControlTemplate+TargetType="Button">
++++++++++++++++++++++++++++<Grid+Background="#FF06731F">
++++++++++++++++++++++++++++++++<ContentPresenter+TextBlock.Foreground="White"+TextBlock.TextAlignment="Center"+Margin="0,8,0,0"+></ContentPresenter>
++++++++++++++++++++++++++++</Grid>
++++++++++++++++++++++++</ControlTemplate>
++++++++++++++++++++</Setter.Value>
++++++++++++++++</Setter>

++++++++++++</Trigger>
++++++++</Style.Triggers>

++++</Style>

++++<Style+x:Key="OvergroundOut"+TargetType="Button">

++++++++<Setter+Property="Template">
++++++++++++<Setter.Value>
++++++++++++++++<ControlTemplate+TargetType="Button">
++++++++++++++++++++<Grid+Background="#FFF35E5E">
++++++++++++++++++++++++<ContentPresenter+TextBlock.Foreground="White"+TextBlock.TextAlignment="Center"+Margin="0,8,0,0"+></ContentPresenter>
++++++++++++++++++++</Grid>
++++++++++++++++</ControlTemplate>
++++++++++++</Setter.Value>
++++++++</Setter>

++++++++<Style.Triggers>
++++++++++++<Trigger+Property="IsMouseOver"+Value="True">

++++++++++++++++<Setter+Property="Template">
++++++++++++++++++++<Setter.Value>
++++++++++++++++++++++++<ControlTemplate+TargetType="Button">
++++++++++++++++++++++++++++<Grid+Background="#FFE34E4E">
++++++++++++++++++++++++++++++++<ContentPresenter+TextBlock.Foreground="White"+TextBlock.TextAlignment="Center"+Margin="0,8,0,0"+></ContentPresenter>
++++++++++++++++++++++++++++</Grid>
++++++++++++++++++++++++</ControlTemplate>
++++++++++++++++++++</Setter.Value>
++++++++++++++++</Setter>

++++++++++++</Trigger>
++++++++</Style.Triggers>

++++</Style>


</Window.Resources>|code-block|syntax|javascript|293161|第二个定义按钮代码|293162|+++++++++++++++++++++++++++<Border+Grid.Column="2"+BorderBrush="LightGray"+BorderThickness="2"+CornerRadius="3"+Margin="2,2,2,2"++>
++++++++++++++++++++++++++++++++<Button+Name="btnFichar"+BorderThickness="0"+Click="BtnFichar_Click">
++++++++++++++++++++++++++++++++++++<Button.Content>
++++++++++++++++++++++++++++++++++++++++<Grid>
++++++++++++++++++++++++++++++++++++++++++++<TextBlock+Margin="0,7,0,7"+TextAlignment="Center">Fichar</TextBlock>+
++++++++++++++++++++++++++++++++++++++++</Grid>
++++++++++++++++++++++++++++++++++++</Button.Content>
++++++++++++++++++++++++++++++++</Button>
++++++++++++++++++++++++++++</Border>|293163|第3个代码|293164|++++public+void+ShowStatus()
++++{
++++++++switch+(((MainDto)this.DataContext).State)
++++++++{
++++++++++++case+State.IN:
++++++++++++++++this.btnFichar.BorderBrush+=+new+SolidColorBrush(Color.FromRgb(243,+94,+94));
++++++++++++++++this.btnFichar.Style+=+Resources["OvergroundIn"]+as+Style;
++++++++++++++++this.btnFichar.Content+=+"Fichar+Salida";
++++++++++++++++break;

++++++++++++case+State.OUT:
++++++++++++++++this.btnFichar.BorderBrush+=+new+SolidColorBrush(Color.FromRgb(76,+106,+83));
++++++++++++++++this.btnFichar.Style+=+Resources["OvergroundOut"]+as+Style;
++++++++++++++++this.btnFichar.Content+=+"Fichar+Entrada";
++++++++++++++++break;

++++++++}
++++}|293165|entityMap^0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|T|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|U|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|V|8|@]|9|@]|A|$]]|$1|K|3|L|5|F|7|W|8|@]|9|@]|A|$G|H]]|$1|M|3|N|5|6|7|X|8|@]|9|@]|A|$]]|$1|O|3|P|5|F|7|Y|8|@]|9|@]|A|$G|H]]|$1|Q|3|-4|5|6|7|Z|8|@]|9|@]|A|$]]]|R|$]]

<p>For change button style</p>

<p>1st: define resource styles</p>

<pre><code>&lt;Window.Resources&gt;

    &lt;Style x:Key="OvergroundIn" TargetType="Button"&gt;

        &lt;Setter Property="Template"&gt;
            &lt;Setter.Value&gt;
                &lt;ControlTemplate TargetType="Button"&gt;
                    &lt;Grid Background="#FF16832F"&gt;
                        &lt;ContentPresenter TextBlock.Foreground="White" TextBlock.TextAlignment="Center" Margin="0,8,0,0" &gt;&lt;/ContentPresenter&gt;
                    &lt;/Grid&gt;
                &lt;/ControlTemplate&gt;
            &lt;/Setter.Value&gt;
        &lt;/Setter&gt;

        &lt;Style.Triggers&gt;
            &lt;Trigger Property="IsMouseOver" Value="True"&gt;

                &lt;Setter Property="Template"&gt;
                    &lt;Setter.Value&gt;
                        &lt;ControlTemplate TargetType="Button"&gt;
                            &lt;Grid Background="#FF06731F"&gt;
                                &lt;ContentPresenter TextBlock.Foreground="White" TextBlock.TextAlignment="Center" Margin="0,8,0,0" &gt;&lt;/ContentPresenter&gt;
                            &lt;/Grid&gt;
                        &lt;/ControlTemplate&gt;
                    &lt;/Setter.Value&gt;
                &lt;/Setter&gt;

            &lt;/Trigger&gt;
        &lt;/Style.Triggers&gt;

    &lt;/Style&gt;

    &lt;Style x:Key="OvergroundOut" TargetType="Button"&gt;

        &lt;Setter Property="Template"&gt;
            &lt;Setter.Value&gt;
                &lt;ControlTemplate TargetType="Button"&gt;
                    &lt;Grid Background="#FFF35E5E"&gt;
                        &lt;ContentPresenter TextBlock.Foreground="White" TextBlock.TextAlignment="Center" Margin="0,8,0,0" &gt;&lt;/ContentPresenter&gt;
                    &lt;/Grid&gt;
                &lt;/ControlTemplate&gt;
            &lt;/Setter.Value&gt;
        &lt;/Setter&gt;

        &lt;Style.Triggers&gt;
            &lt;Trigger Property="IsMouseOver" Value="True"&gt;

                &lt;Setter Property="Template"&gt;
                    &lt;Setter.Value&gt;
                        &lt;ControlTemplate TargetType="Button"&gt;
                            &lt;Grid Background="#FFE34E4E"&gt;
                                &lt;ContentPresenter TextBlock.Foreground="White" TextBlock.TextAlignment="Center" Margin="0,8,0,0" &gt;&lt;/ContentPresenter&gt;
                            &lt;/Grid&gt;
                        &lt;/ControlTemplate&gt;
                    &lt;/Setter.Value&gt;
                &lt;/Setter&gt;

            &lt;/Trigger&gt;
        &lt;/Style.Triggers&gt;

    &lt;/Style&gt;


&lt;/Window.Resources&gt;
</code></pre>

<p>2nd define button code</p>

<pre><code>                           &lt;Border Grid.Column="2" BorderBrush="LightGray" BorderThickness="2" CornerRadius="3" Margin="2,2,2,2"  &gt;
                                &lt;Button Name="btnFichar" BorderThickness="0" Click="BtnFichar_Click"&gt;
                                    &lt;Button.Content&gt;
                                        &lt;Grid&gt;
                                            &lt;TextBlock Margin="0,7,0,7" TextAlignment="Center"&gt;Fichar&lt;/TextBlock&gt; 
                                        &lt;/Grid&gt;
                                    &lt;/Button.Content&gt;
                                &lt;/Button&gt;
                            &lt;/Border&gt;
</code></pre>

<p>3th code behind</p>

<pre><code>    public void ShowStatus()
    {
        switch (((MainDto)this.DataContext).State)
        {
            case State.IN:
                this.btnFichar.BorderBrush = new SolidColorBrush(Color.FromRgb(243, 94, 94));
                this.btnFichar.Style = Resources["OvergroundIn"] as Style;
                this.btnFichar.Content = "Fichar Salida";
                break;

            case State.OUT:
                this.btnFichar.BorderBrush = new SolidColorBrush(Color.FromRgb(76, 106, 83));
                this.btnFichar.Style = Resources["OvergroundOut"] as Style;
                this.btnFichar.Content = "Fichar Entrada";
                break;

        }
    }
</code></pre>


<p>I have a button on my page with this XAML:</p>

<pre><code>&lt;Button Content="Button" HorizontalAlignment="Left" VerticalAlignment="Bottom" 
    Width="50" Height="50" HorizontalContentAlignment="Left" 
    BorderBrush="{x:Null}" Foreground="{x:Null}" Margin="50,0,0,0"&gt;
    &lt;Button.Style&gt;
        &lt;Style TargetType="Button"&gt;
            &lt;Setter Property="Background" Value="Green"/&gt;
            &lt;Style.Triggers&gt;
                &lt;Trigger Property="IsMouseOver" Value="True"&gt;
                    &lt;Setter Property="Background" Value="Red"/&gt;
                &lt;/Trigger&gt;
            &lt;/Style.Triggers&gt;
        &lt;/Style&gt;
    &lt;/Button.Style&gt;
&lt;/Button&gt;
</code></pre>

<p>But when I put mouse over my button, button's background changes to default windows gray background.<br>What's The Problem?<br></p>

<p>This is the button picture before and after mouseover:<br>
Before:<br><img src="https://i.stack.imgur.com/9n8RM.png" alt="Before"><br>
After:<br><img src="https://i.stack.imgur.com/swHbJ.png" alt="After">
<br></p>


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

我的页面上有一个按钮，上面有这个XAML：<Button Content="Button" HorizontalAlignment="Left" VerticalAlignment="Bottom"     Width="50" Height="50" HorizontalContentAlignment="Left"...

问如何在WPF中更改按钮MouseOver的背景？
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在WPF中更改按钮MouseOver的背景？EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在WPF中更改按钮MouseOver的背景？
EN