¿Cómo eliminar el efecto predeterminado del mouse sobre los botones WPF?

button mouseover

Question

Mi problema es que en WPF, cada vez que intento cambiar el color del fondo de un botón usando disparadores o animaciones, el efecto mouseover predeterminado (de ser gris con ese brillo naranja) parece tener prioridad.

Después de búsquedas exhaustivas, no tengo ni idea de cómo eliminar este efecto.

Answer 1

Debe crear su propia plantilla de botón personalizado para tener control total sobre la apariencia en todos los estados. Aquí hay un tutorial .

Answer 2

El Muffin Man tuvo una respuesta muy simple que funcionó para mí.

Para agregar una dirección un poco más específica, al menos para VS 2013:

• Haga clic derecho en el control
• Seleccione Editar plantilla => Editar una copia ...
• Seleccioné ''Aplicación'' para dónde guardar el estilo
  • Desde aquí, puede editar directamente App.xaml y ver las propiedades con nombre intuitivo. Para mis propósitos, simplemente configuro RenderMouseOver = "False"
• Luego, en MainWindow.xaml o donde sea que esté su GUI, puede pegar el nuevo estilo al final de la etiqueta Button, por ejemplo ... Style="{DynamicResource MouseOverNonDefault}"/>

Answer 3

Esto es similar a la solución referida por Mark Heath, pero no tiene tanto código como para crear un botón muy básico, sin el efecto de mouse incorporado sobre la animación. Conserva un efecto simple sobre el mouse de mostrar el borde del botón en negro. El estilo se puede insertar en la sección Window.Resources o UserControl.Resources por ejemplo (como se muestra).

    <UserControl.Resources>
        <!-- This style is used for buttons, to remove the WPF default ''animated'' mouse over effect -->
        <Style x:Key="MyButtonStyle" TargetType="Button">
            <Setter Property="OverridesDefaultStyle" Value="True"/>
            <Setter Property="Margin" Value="5"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Border Name="border" 
                            BorderThickness="1"
                            Padding="4,2" 
                            BorderBrush="DarkGray" 
                            CornerRadius="3" 
                            Background="{TemplateBinding Background}">
                            <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter TargetName="border" Property="BorderBrush" Value="Black" />
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </UserControl.Resources>

<!-- usage in xaml -->
<Button Style="{StaticResource MyButtonStyle}">Hello!</Button>

Answer 4

Si alguien no quiere anular la plantilla de control predeterminada, esta es la solución.

Puede crear DataTemplate para el botón que puede tener TextBlock y luego puede escribir Property trigger en la propiedad IsMouseOver para deshabilitar el mouse sobre el efecto. La altura de TextBlock y Button debe ser la misma.

    <Button Background="Black" Margin="0" Padding="0" BorderThickness="0" Cursor="Hand" Height="20">
                    <Button.ContentTemplate>
                        <DataTemplate>
                            <TextBlock Text="GO" Foreground="White" HorizontalAlignment="Center" VerticalAlignment="Center" TextDecorations="Underline" Margin="0" Padding="0" Height="20">
                                <TextBlock.Style>
                                    <Style TargetType="TextBlock">
                                        <Style.Triggers>
                                            <Trigger Property ="IsMouseOver" Value="True">
                                                <Setter Property= "Background" Value="Black"/>
                                            </Trigger>
                                        </Style.Triggers>
                                    </Style>
                                </TextBlock.Style>
                            </TextBlock>
                        </DataTemplate>
                    </Button.ContentTemplate>
                </Button>

Answer 5

Solo para agregar una solución muy simple, eso fue lo suficientemente bueno para mí, y creo que aborda el problema del OP. Utilicé la solución en esta respuesta, excepto con un valor de Background regular en lugar de una imagen.

<Style x:Key="SomeButtonStyle" TargetType="Button">
    <Setter Property="Background" Value="Transparent" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Grid Background="{TemplateBinding Background}">
                    <ContentPresenter />
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

No volver a crear plantillas más allá de forzar el Background para que siempre sea el fondo Transparent del botón de plantilla: el mouseover ya no afecta el fondo una vez que se hace esto. Obviamente reemplace Transparent con cualquier valor preferido.

Answer 6

Una extensión en la respuesta de dodgy_coder que agrega soporte para ...

• Mantener el estilo del botón WPF

• Agrega soporte para IsSelected y hover, es decir, un botón alternado

      <Style x:Key="Button.Hoverless" TargetType="{x:Type ButtonBase}">
          <Setter Property="Template">
              <Setter.Value>
                  <ControlTemplate TargetType="{x:Type ButtonBase}">
                      <Border Name="border"
                              BorderThickness="{TemplateBinding BorderThickness}"
                              Padding="{TemplateBinding Padding}"
                              BorderBrush="{TemplateBinding BorderBrush}"
                              Background="{TemplateBinding Background}">
                          <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
                      </Border>
                      <ControlTemplate.Triggers>
                          <MultiTrigger>
                              <MultiTrigger.Conditions>
                                  <Condition Property="IsMouseOver" Value="True" />
                                  <Condition Property="Selector.IsSelected" Value="False" />
                              </MultiTrigger.Conditions>
                              <Setter Property="Background" Value="#FFBEE6FD" />
                          </MultiTrigger>
  
                          <MultiTrigger>
                              <MultiTrigger.Conditions>
                                  <Condition Property="IsMouseOver" Value="True" />
                                  <Condition Property="Selector.IsSelected" Value="True" />
                              </MultiTrigger.Conditions>
                              <Setter Property="Background" Value="#BB90EE90" />
                          </MultiTrigger>
  
                          <MultiTrigger>
                              <MultiTrigger.Conditions>
                                  <Condition Property="IsMouseOver" Value="False" />
                                  <Condition Property="Selector.IsSelected" Value="True" />
                              </MultiTrigger.Conditions>
                              <Setter Property="Background" Value="LightGreen" />
                          </MultiTrigger>
  
                          <Trigger Property="IsPressed" Value="True">
                              <Setter TargetName="border" Property="Opacity" Value="0.95" />
                          </Trigger>
                      </ControlTemplate.Triggers>
                  </ControlTemplate>
              </Setter.Value>
          </Setter>
      </Style>

ejemplos ..

<Button Content="Wipe On" Selector.IsSelected="True" /> <Button Content="Wipe Off" Selector.IsSelected="False" />

Answer 7

Usando un activador de plantilla:

<Style x:Key="ButtonStyle" TargetType="{x:Type Button}">
    <Setter Property="Background" Value="White"></Setter>
    ...
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type Button}">
                <Border Background="{TemplateBinding Background}">
                    <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter Property="Background" Value="White"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>